Allow multi-env theme commands to accept CLI flags

dejmedus · dejmedus · commit 1f4fd78a506b · 2025-07-23T10:05:16.000-06:00
Previously required multi-environment command flags were
only taken from the `shopify.theme.toml` file.
This commit updates ThemeCommand to accept flags from
the CLI as well, with CLI flags taking precedence.
diff --git a/.changeset/breezy-papayas-watch.md b/.changeset/breezy-papayas-watch.md
@@ -0,0 +1,6 @@
+---
+'@shopify/theme': minor
+'@shopify/cli': minor
+---
+
+Allow multi-environment theme commands to accept flags from CLI
diff --git a/packages/theme/src/cli/utilities/theme-command.test.ts b/packages/theme/src/cli/utilities/theme-command.test.ts
@@ -3,7 +3,7 @@ import {describe, vi, expect, test, beforeEach} from 'vitest'
 import {Config, Flags} from '@oclif/core'
 import {AdminSession, ensureAuthenticatedThemes} from '@shopify/cli-kit/node/session'
 import {loadEnvironment} from '@shopify/cli-kit/node/environments'
-import {renderConcurrent} from '@shopify/cli-kit/node/ui'
+import {renderConcurrent, renderConfirmationPrompt, renderError} from '@shopify/cli-kit/node/ui'
 import type {Writable} from 'stream'
 
 vi.mock('@shopify/cli-kit/node/session')
@@ -29,10 +29,19 @@ class TestThemeCommand extends ThemeCommand {
 
   static multiEnvironmentsFlags = ['store']
 
-  commandCalls: {flags: any; session: AdminSession; context?: any}[] = []
+  commandCalls: {flags: any; session: AdminSession; multiEnvironment?: boolean; context?: any}[] = []
 
-  async command(flags: any, session: AdminSession, context?: {stdout?: Writable; stderr?: Writable}): Promise<void> {
-    this.commandCalls.push({flags, session, context})
+  async command(
+    flags: any,
+    session: AdminSession,
+    multiEnvironment?: boolean,
+    context?: {stdout?: Writable; stderr?: Writable},
+  ): Promise<void> {
+    this.commandCalls.push({flags, session, multiEnvironment, context})
+
+    if (flags.environment && flags.environment[0] === 'command-error') {
+      throw new Error('Mocking a command error')
+    }
   }
 }
 
@@ -125,4 +134,92 @@ describe('ThemeCommand', () => {
       )
     })
   })
+
+  describe('multi environment', () => {
+    test('should not execute commands in environments that are missing required flags', async () => {
+      // Given
+      vi.mocked(loadEnvironment)
+        .mockResolvedValueOnce({store: 'store1.myshopify.com'})
+        .mockResolvedValueOnce({})
+        .mockResolvedValueOnce({store: 'store3.myshopify.com'})
+
+      vi.mocked(renderConfirmationPrompt).mockResolvedValue(true)
+      vi.mocked(renderConcurrent).mockResolvedValue(undefined)
+
+      await CommandConfig.load()
+      const command = new TestThemeCommand(
+        ['--environment', 'development', '--environment', 'env-missing-store', '--environment', 'production'],
+        CommandConfig,
+      )
+
+      // When
+      await command.run()
+
+      // Then
+      const renderConcurrentProcesses = vi.mocked(renderConcurrent).mock.calls[0]?.[0]?.processes
+      expect(renderConcurrentProcesses).toHaveLength(2)
+      expect(renderConcurrentProcesses?.map((process) => process.prefix)).toEqual(['development', 'production'])
+    })
+
+    test('commands error gracefully and continue with other environments', async () => {
+      // Given
+      vi.mocked(loadEnvironment).mockResolvedValue({store: 'store.myshopify.com'})
+
+      vi.mocked(renderConfirmationPrompt).mockResolvedValue(true)
+      vi.mocked(renderConcurrent).mockImplementation(async ({processes}) => {
+        for (const process of processes) {
+          // eslint-disable-next-line no-await-in-loop
+          await process.action({} as Writable, {} as Writable, {} as any)
+        }
+      })
+
+      await CommandConfig.load()
+      const command = new TestThemeCommand(
+        ['--environment', 'command-error', '--environment', 'development', '--environment', 'production'],
+        CommandConfig,
+      )
+
+      // When
+      await command.run()
+
+      // Then
+      const renderConcurrentProcesses = vi.mocked(renderConcurrent).mock.calls[0]?.[0]?.processes
+      expect(renderConcurrentProcesses).toHaveLength(3)
+      expect(renderConcurrentProcesses?.map((process) => process.prefix)).toEqual([
+        'command-error',
+        'development',
+        'production',
+      ])
+    })
+
+    test('error messages contain the environment name', async () => {
+      // Given
+      const environmentConfig = {store: 'store.myshopify.com'}
+      vi.mocked(loadEnvironment).mockResolvedValue(environmentConfig)
+      vi.mocked(renderConfirmationPrompt).mockResolvedValue(true)
+
+      vi.mocked(renderConcurrent).mockImplementation(async ({processes}) => {
+        for (const process of processes) {
+          // eslint-disable-next-line no-await-in-loop
+          await process.action({} as Writable, {} as Writable, {} as any)
+        }
+      })
+
+      await CommandConfig.load()
+      const command = new TestThemeCommand(
+        ['--environment', 'command-error', '--environment', 'development'],
+        CommandConfig,
+      )
+
+      // When
+      await command.run()
+
+      // Then
+      expect(renderError).toHaveBeenCalledWith(
+        expect.objectContaining({
+          body: ['Environment command-error failed: \n\nMocking a command error'],
+        }),
+      )
+    })
+  })
 })
diff --git a/packages/theme/src/cli/utilities/theme-command.ts b/packages/theme/src/cli/utilities/theme-command.ts
@@ -4,8 +4,7 @@ import {Input} from '@oclif/core/interfaces'
 import Command, {ArgOutput, FlagOutput} from '@shopify/cli-kit/node/base-command'
 import {AdminSession, ensureAuthenticatedThemes} from '@shopify/cli-kit/node/session'
 import {loadEnvironment} from '@shopify/cli-kit/node/environments'
-import {renderWarning, renderConcurrent} from '@shopify/cli-kit/node/ui'
-import {AbortError} from '@shopify/cli-kit/node/error'
+import {renderWarning, renderConcurrent, renderError} from '@shopify/cli-kit/node/ui'
 import {AbortController} from '@shopify/cli-kit/node/abort'
 import type {Writable} from 'stream'
 
@@ -16,6 +15,7 @@ interface PassThroughFlagsOptions {
   // Only pass on flags that are relevant to CLI2
   allowedFlags?: string[]
 }
+type EnvironmentName = string
 
 export default abstract class ThemeCommand extends Command {
   passThroughFlags(flags: FlagValues, {allowedFlags}: PassThroughFlagsOptions): string[] {
@@ -41,6 +41,7 @@ export default abstract class ThemeCommand extends Command {
   async command(
     _flags: FlagValues,
     _session: AdminSession,
+    _multiEnvironment = false,
     _context?: {stdout?: Writable; stderr?: Writable},
   ): Promise<void> {}
 
@@ -60,72 +61,125 @@ export default abstract class ThemeCommand extends Command {
 
     // Single environment or no environment
     if (environments.length <= 1) {
-      const session = await this.ensureAuthenticated(flags)
+      const session = await this.createSession(flags)
+
       await this.command(flags, session)
       return
     }
 
     // Multiple environments
-    const sessions: {[storeFqdn: string]: AdminSession} = {}
+    const environmentsMap = await this.loadEnvironments(environments, flags)
+    const validationResults = await this.validateEnvironments(environmentsMap, requiredFlags)
+
+    await this.runConcurrent(validationResults.valid)
+  }
+
+  /**
+   * Create a map of environments from the shopify.theme.toml file
+   * @param environments - Names of environments to load
+   * @param flags - Flags provided via the CLI
+   * @returns The map of environments
+   */
+  private async loadEnvironments(
+    environments: EnvironmentName[],
+    flags: FlagValues,
+  ): Promise<Map<EnvironmentName, FlagValues>> {
+    const environmentMap = new Map<EnvironmentName, FlagValues>()
 
-    // Authenticate on all environments sequentially to avoid race conditions,
-    // with authentication happening in parallel.
     for (const environmentName of environments) {
       // eslint-disable-next-line no-await-in-loop
-      const environmentConfig = await loadEnvironment(environmentName, 'shopify.theme.toml', {
-        from: flags.path,
+      const environmentFlags = await loadEnvironment(environmentName, 'shopify.theme.toml', {
+        from: flags.path as string,
         silent: true,
       })
+
+      environmentMap.set(environmentName, {
+        ...environmentFlags,
+        ...flags,
+        environment: [environmentName],
+      })
+    }
+
+    return environmentMap
+  }
+
+  /**
+   * Split environments into valid and invalid based on flags
+   * @param environmentMap - The map of environments to validate
+   * @param requiredFlags - The required flags to check for
+   * @returns An object containing valid and invalid environment arrays
+   */
+  private async validateEnvironments(environmentMap: Map<EnvironmentName, FlagValues>, requiredFlags: string[]) {
+    const valid: {environment: EnvironmentName; flags: FlagValues; session: AdminSession}[] = []
+    const invalid: {environment: EnvironmentName; reason: string}[] = []
+
+    for (const [environmentName, environmentFlags] of environmentMap) {
       // eslint-disable-next-line no-await-in-loop
-      sessions[environmentName] = await this.ensureAuthenticated(environmentConfig as FlagValues)
+      const session = await this.createSession(environmentFlags)
+
+      const validationResult = this.validConfig(environmentFlags, requiredFlags, environmentName)
+      if (validationResult !== true) {
+        const missingFlagsText = validationResult.join(', ')
+        invalid.push({environment: environmentName, reason: `Missing flags: ${missingFlagsText}`})
+        continue
+      }
+
+      valid.push({environment: environmentName, flags: environmentFlags, session})
     }
 
-    // Use renderConcurrent for multi-environment execution
+    return {valid, invalid}
+  }
+
+  /**
+   * Run the command in each valid environment concurrently
+   * @param validEnvironments - The valid environments to run the command in
+   */
+  private async runConcurrent(
+    validEnvironments: {environment: EnvironmentName; flags: FlagValues; session: AdminSession}[],
+  ) {
     const abortController = new AbortController()
 
     await renderConcurrent({
-      processes: environments.map((environment: string) => ({
+      processes: validEnvironments.map(({environment, flags, session}) => ({
         prefix: environment,
         action: async (stdout: Writable, stderr: Writable, _signal) => {
-          const environmentConfig = await loadEnvironment(environment, 'shopify.theme.toml', {
-            from: flags.path,
-            silent: true,
-          })
-          const environmentFlags = {
-            ...flags,
-            ...environmentConfig,
-            environment: [environment],
+          try {
+            await this.command(flags, session, true, {stdout, stderr})
+
+            // eslint-disable-next-line no-catch-all/no-catch-all
+          } catch (error) {
+            if (error instanceof Error) {
+              error.message = `Environment ${environment} failed: \n\n${error.message}`
+              renderError({body: [error.message]})
+            }
           }
-
-          if (!this.validConfig(environmentConfig as FlagValues, requiredFlags, environment)) return
-
-          const session = sessions[environment]
-
-          if (!session) {
-            throw new AbortError(`No session found for environment ${environment}`)
-          }
-
-          await this.command(environmentFlags, session, {stdout, stderr})
         },
       })),
       abortSignal: abortController.signal,
       showTimestamps: true,
     })
   }
 
-  private async ensureAuthenticated(flags: FlagValues) {
+  /**
+   * Create an authenticated session object from the flags
+   * @param flags - The environment flags containing store and password
+   * @returns The unauthenticated session object
+   */
+  private async createSession(flags: FlagValues) {
     const store = flags.store as string
     const password = flags.password as string
     return ensureAuthenticatedThemes(ensureThemeStore({store}), password)
   }
 
-  private validConfig(environmentConfig: FlagValues, requiredFlags: string[], environmentName: string): boolean {
-    if (!environmentConfig) {
-      renderWarning({body: 'Environment configuration is empty.'})
-      return false
-    }
-    const required = [...requiredFlags]
-    const missingFlags = required.filter((flag) => !environmentConfig[flag])
+  /**
+   * Ensure that all required flags are present
+   * @param environmentFlags - The environment flags
+   * @param requiredFlags - The flags required by the command
+   * @param environmentName - The name of the environment
+   * @returns The missing flags or true if the environment has all required flags
+   */
+  private validConfig(environmentFlags: FlagValues, requiredFlags: string[], environmentName: string): string[] | true {
+    const missingFlags = requiredFlags.filter((flag) => !environmentFlags[flag])
 
     if (missingFlags.length > 0) {
       renderWarning({
@@ -134,7 +188,7 @@ export default abstract class ThemeCommand extends Command {
           {list: {items: missingFlags}},
         ],
       })
-      return false
+      return missingFlags
     }
 
     return true
