Validate @shopify/shopify_function version on build

.changeset/tough-guests-behave.md

@@ -0,0 +1,5 @@
+---
+'@shopify/app': patch
+---
+
+Validate the @shopify/shopify_function NPM package version is compatible with the Javy version

packages/app/src/cli/services/function/build.test.ts

@@ -67,6 +67,9 @@ async function installShopifyLibrary(tmpDir: string) {
   const runModule = joinPath(shopifyFunctionDir, 'run.ts')
   await writeFile(runModule, '')
 
+  const packageJson = joinPath(shopifyFunctionDir, 'package.json')
+  await writeFile(packageJson, JSON.stringify({version: '1.0.0'}))
+
   return shopifyFunction
 }
 
@@ -136,6 +139,28 @@ describe('bundleExtension', () => {
     })
   })
 
+  test('errors if shopify library is not on a compatible version', async () => {
+    await inTemporaryDirectory(async (tmpDir) => {
+      // Given
+      const incompatibleVersion = '0.0.1'
+      const ourFunction = await testFunctionExtension({dir: tmpDir})
+      ourFunction.entrySourceFilePath = joinPath(tmpDir, 'src/index.ts')
+      await installShopifyLibrary(tmpDir)
+      await writeFile(
+        joinPath(tmpDir, 'node_modules/@shopify/shopify_function/package.json'),
+        JSON.stringify({version: incompatibleVersion}),
+      )
+
+      // When
+      const got = bundleExtension(ourFunction, {stdout, stderr, signal, app})
+
+      // Then
+      await expect(got).rejects.toThrow(
+        /The installed version of the Shopify Functions JavaScript library is not compatible with this version of Shopify CLI./,
+      )
+    })
+  })
+
   test('errors if user function not found', async () => {
     await inTemporaryDirectory(async (tmpDir) => {
       // Given

packages/app/src/cli/services/function/build.ts

@@ -9,14 +9,34 @@
 import {exec} from '@shopify/cli-kit/node/system'
 import {dirname, joinPath} from '@shopify/cli-kit/node/path'
 import {build as esBuild, BuildResult} from 'esbuild'
-import {findPathUp, inTemporaryDirectory, writeFile} from '@shopify/cli-kit/node/fs'
+import {findPathUp, inTemporaryDirectory, readFile, writeFile} from '@shopify/cli-kit/node/fs'
 import {AbortSignal} from '@shopify/cli-kit/node/abort'
 import {renderTasks} from '@shopify/cli-kit/node/ui'
 import {pickBy} from '@shopify/cli-kit/common/object'
 import {runWithTimer} from '@shopify/cli-kit/node/metadata'
 import {AbortError} from '@shopify/cli-kit/node/error'
 import {Writable} from 'stream'
 
+export const SHOPIFY_FUNCTION_NPM_PACKAGE_MAJOR_VERSION = '1'
+
+class InvalidShopifyFunctionPackageError extends AbortError {
+  constructor(message: string) {
+    super(
+      message,
+      outputContent`Make sure you have a compatible version of the ${outputToken.yellow(
+        '@shopify/shopify_function',
+      )} library installed.`,
+      [
+        outputContent`Add ${outputToken.green(
+          `"@shopify/shopify_function": "~${SHOPIFY_FUNCTION_NPM_PACKAGE_MAJOR_VERSION}.0.0"`,
+        )} to the dependencies section of the package.json file in your function's directory, if not already present.`
+          .value,
+        `Run your package manager's install command to update dependencies.`,
+      ],
+    )
+  }
+}
+
 interface JSFunctionBuildOptions {
   stdout: Writable
   stderr: Writable
@@ -117,19 +137,7 @@
   })
 
   if (!entryPoint || !runModule) {
-    throw new AbortError(
-      'Could not find the Shopify Functions JavaScript library.',
-      outputContent`Make sure you have the latest ${outputToken.yellow(
-        '@shopify/shopify_function',
-      )} library installed.`,
-      [
-        outputContent`Add ${outputToken.green(
-          '"@shopify/shopify_function": "1.0.0"',
-        )} to the dependencies section of the package.json file in your function's directory, if not already present.`
-          .value,
-        `Run your package manager's install command to update dependencies.`,
-      ],
-    )
+    throw new InvalidShopifyFunctionPackageError('Could not find the Shopify Functions JavaScript library.')
   }
 
   if (!fun.entrySourceFilePath) {
@@ -139,11 +147,32 @@
   return entryPoint
 }
 
+async function validateShopifyFunctionPackageVersion(fun: ExtensionInstance<FunctionConfigType>) {
+  const packageJsonPath = await findPathUp('node_modules/@shopify/shopify_function/package.json', {
+    type: 'file',
+    cwd: fun.directory,
+  })
+
+  if (!packageJsonPath) {
+    throw new InvalidShopifyFunctionPackageError('Could not find the Shopify Functions JavaScript library.')
+  }
+
+  const packageJson = JSON.parse(await readFile(packageJsonPath))
+  const majorVersion = packageJson.version.split('.')[0]
+
+  if (majorVersion !== SHOPIFY_FUNCTION_NPM_PACKAGE_MAJOR_VERSION) {
+    throw new InvalidShopifyFunctionPackageError(
+      'The installed version of the Shopify Functions JavaScript library is not compatible with this version of Shopify CLI.',
+    )
+  }
+}
+
 export async function bundleExtension(
   fun: ExtensionInstance<FunctionConfigType>,
   options: JSFunctionBuildOptions,
   processEnv = process.env,
 ) {
+  await validateShopifyFunctionPackageVersion(fun)
   const entryPoint = await checkForShopifyFunctionRuntimeEntrypoint(fun)
 
   const esbuildOptions = {
@@ -276,6 +305,7 @@
   }
 
   async bundle(fun: ExtensionInstance<FunctionConfigType>, options: JSFunctionBuildOptions, processEnv = process.env) {
+    await validateShopifyFunctionPackageVersion(fun)
     await checkForShopifyFunctionRuntimeEntrypoint(fun)
 
     const contents = this.entrypointContents
@@ -333,7 +363,7 @@
 }
 
 export function jsExports(fun: ExtensionInstance<FunctionConfigType>) {
   const targets = fun.configuration.targeting || []
   const withoutExport = targets.filter((target) => !target.export)
   const withExport = targets.filter((target) => Boolean(target.export))
 

packages/app/src/cli/services/generate/extension.ts

@@ -1,6 +1,6 @@
 import {configurationFileNames, versions} from '../../constants.js'
 import {AppInterface} from '../../models/app/app.js'
-import {buildGraphqlTypes} from '../function/build.js'
+import {buildGraphqlTypes, SHOPIFY_FUNCTION_NPM_PACKAGE_MAJOR_VERSION} from '../function/build.js'
 import {GenerateExtensionContentOutput} from '../../prompts/generate/extension.js'
 import {ExtensionFlavor, ExtensionTemplate} from '../../models/app/template.js'
 import {ensureDownloadedExtensionFlavorExists, ensureExtensionDirectoryExists} from '../extensions/common.js'
@@ -82,7 +82,7 @@
     (flavor) => flavor.value === extensionFlavorValue,
   )
   const directory = await ensureExtensionDirectoryExists({app: options.app, name: extensionName})
   const url = options.cloneUrl || options.extensionTemplate.url
   const uid = options.developerPlatformClient.supportsAtomicDeployments ? randomUUID() : undefined
   const initOptions: ExtensionInitOptions = {
     directory,
@@ -174,7 +174,7 @@
       })
 
       if (templateLanguage === 'javascript') {
         const srcFileExtension = getSrcFileExtension(extensionFlavor?.value || 'rust')
         await changeIndexFileExtension(directory, srcFileExtension, '!(*.graphql)')
       }
     },
@@ -299,7 +299,10 @@
 export function getFunctionRuntimeDependencies(templateLanguage: string): DependencyVersion[] {
   const dependencies: DependencyVersion[] = []
   if (templateLanguage === 'javascript') {
-    dependencies.push({name: '@shopify/shopify_function', version: '1.0.0'})
+    dependencies.push({
+      name: '@shopify/shopify_function',
+      version: `~${SHOPIFY_FUNCTION_NPM_PACKAGE_MAJOR_VERSION}.0.0`,
+    })
   }
   return dependencies
 }