Update theme processing error messages

packages/app/src/cli/utilities/host-theme-watcher.test.ts

@@ -1,4 +1,4 @@
-import {UPDATER_TIMEOUT, waitForThemeToBeProcessed} from './host-theme-watcher.js'
+import {FAILED_TO_CREATE_THEME_MESSAGE, UPDATER_TIMEOUT, waitForThemeToBeProcessed} from './host-theme-watcher.js'
 import {AdminSession} from '@shopify/cli-kit/node/session'
 import {sleep} from '@shopify/cli-kit/node/system'
 import {fetchTheme} from '@shopify/cli-kit/node/themes/api'
@@ -51,6 +51,17 @@ describe('HostThemeWatcher', () => {
  const promise = waitForThemeToBeProcessed(themeId, adminSession, Date.now() - UPDATER_TIMEOUT)
 
  // Then
- await expect(promise).rejects.toThrowError('Theme Processing Timeout')
+ await expect(promise).rejects.toThrowError(FAILED_TO_CREATE_THEME_MESSAGE)
+ })
+
+ test('should throw an error if the theme is not found', async () => {
+ // Given
+ vi.mocked(fetchTheme).mockResolvedValue(undefined)
+
+ // When
+ const promise = waitForThemeToBeProcessed(themeId, adminSession, Date.now())
+
+ // Then
+ await expect(promise).rejects.toThrowError(FAILED_TO_CREATE_THEME_MESSAGE)
  })
 })

packages/app/src/cli/utilities/host-theme-watcher.ts

@@ -2,9 +2,12 @@ import {AbortError} from '@shopify/cli-kit/node/error'
 import {AdminSession} from '@shopify/cli-kit/node/session'
 import {sleep} from '@shopify/cli-kit/node/system'
 import {fetchTheme} from '@shopify/cli-kit/node/themes/api'
+import {Theme} from '@shopify/cli-kit/node/themes/types'
 
 // 5 minutes
 export const UPDATER_TIMEOUT = 5 * 60 * 1000
+export const FAILED_TO_CREATE_THEME_MESSAGE =
+ 'The host theme could not be created to host your theme app extension. Please try again or use the "--theme" flag to use an existing theme as the host theme.'
 
 export async function waitForThemeToBeProcessed(themeId: number, adminSession: AdminSession, startTime = Date.now()) {
  // Each iteration must wait for the response before the next poll is initiated.
@@ -15,18 +18,15 @@ export async function waitForThemeToBeProcessed(themeId: number, adminSession: A
 async function themeIsProcessing(themeId: number, session: AdminSession, startTime: number) {
  const theme = await fetchTheme(themeId, session)
 
- if (!theme) {
- throw new AbortError('No theme app extension host theme found.', 'Please try again.')
- }
-
- const elapsedTime = Date.now() - startTime
-
- if (theme.processing && elapsedTime >= UPDATER_TIMEOUT) {
- throw new AbortError('Theme Processing Timeout', 'Please try again.')
+ if (!theme || themeProcessingTimedOut(theme, startTime)) {
+ throw new AbortError(FAILED_TO_CREATE_THEME_MESSAGE)
  }
 
  // Sleep for 3 seconds before polling again
  await sleep(3)
 
  return theme.processing
 }
+function themeProcessingTimedOut(theme: Theme, startTime: number): boolean {
+ return theme.processing && Date.now() - startTime >= UPDATER_TIMEOUT
+}