Merge pull request #4850 from Shopify/improve-dev-session-start-2

Fix an issue were a token refresh might break dev session start

packages/app/src/cli/services/dev/processes/dev-session.ts

@@ -47,7 +47,7 @@ let bundleControllers: AbortController[] = []
 
 // Current status of the dev session
 // Since the watcher can emit events before the dev session is ready, we need to keep track of the status
-let devSessionStatus: 'idle' | 'initializing' | 'ready' = 'idle'
+let isDevSessionReady = false
 
 export async function setupDevSessionProcess({
   app,
@@ -89,7 +89,7 @@ export const pushUpdatesForDevSession: DevProcessFunction<DevSessionOptions> = a
 
   appWatcher
     .onEvent(async (event) => {
-      if (devSessionStatus !== 'ready') {
+      if (!isDevSessionReady) {
         await printWarning('Change detected, but dev session is not ready yet.', processOptions.stdout)
         return
       }
@@ -131,7 +131,7 @@ export const pushUpdatesForDevSession: DevProcessFunction<DevSessionOptions> = a
 // utility to debug issues with the dev API.
 function startTimeout(processOptions: DevSessionProcessOptions) {
   setTimeout(() => {
-    if (devSessionStatus !== 'ready') {
+    if (!isDevSessionReady) {
       printError('❌ Timeout, session failed to start in 30s, please try again.', processOptions.stdout).catch(() => {})
       process.exit(1)
     }
@@ -171,20 +171,10 @@ async function handleDevSessionResult(
  * @param updating - Whether the dev session is being updated or created
  */
 async function bundleExtensionsAndUpload(options: DevSessionProcessOptions): Promise<DevSessionResult> {
-  // If the dev session is still initializing, ignore this event
-  if (devSessionStatus === 'initializing') return {status: 'aborted'}
-  // If the dev session is idle, set the status to initializing
-  if (devSessionStatus === 'idle') devSessionStatus = 'initializing'
-
   // Every new bundle process gets its own controller. This way we can cancel any previous one if a new change
   // is detected even when multiple events are triggered very quickly (which causes weird edge cases)
   const currentBundleController = new AbortController()
-
-  if (devSessionStatus === 'ready') {
-    // Only save the controller if the dev session is ready, otherwise we might end up with a race condition where
-    // the dev session is aborted before being created.
-    bundleControllers.push(currentBundleController)
-  }
+  bundleControllers.push(currentBundleController)
 
   if (currentBundleController.signal.aborted) return {status: 'aborted'}
   outputDebug('Bundling and uploading extensions', options.stdout)
@@ -226,14 +216,14 @@ async function bundleExtensionsAndUpload(options: DevSessionProcessOptions): Pro
   // Create or update the dev session
   if (currentBundleController.signal.aborted) return {status: 'aborted'}
   try {
-    if (devSessionStatus === 'ready') {
+    if (isDevSessionReady) {
       await options.developerPlatformClient.devSessionUpdate(payload)
       return {status: 'updated'}
     } else {
       startTimeout(options)
       await options.developerPlatformClient.devSessionCreate(payload)
       // eslint-disable-next-line require-atomic-updates
-      devSessionStatus = 'ready'
+      isDevSessionReady = true
       return {status: 'created'}
     }
     // eslint-disable-next-line @typescript-eslint/no-explicit-any