--amend

Author: phyllis-sy-wu

packages/e2e/setup/app.ts

@@ -1,6 +1,6 @@
 /* eslint-disable no-restricted-imports, no-await-in-loop */
 import {authFixture} from './auth.js'
-import {navigateToDashboard} from './browser.js'
+import {navigateToDashboard, refreshIfPageError} from './browser.js'
 import {CLI_TIMEOUT, BROWSER_TIMEOUT} from './constants.js'
 import {updateTomlValues} from '@shopify/toml-patch'
 import * as toml from '@iarna/toml'
@@ -201,7 +201,6 @@ export async function findAppOnDevDashboard(page: Page, appName: string, orgId?:
   await navigateToDashboard({browserPage: page, email, orgId: org})
 
   // Scan current page + pagination for the app
-
   while (true) {
     const allLinks = await page.locator('a[href*="/apps/"]').all()
     for (const link of allLinks) {
@@ -220,6 +219,7 @@ export async function findAppOnDevDashboard(page: Page, appName: string, orgId?:
     const nextUrl = nextHref.startsWith('http') ? nextHref : `https://dev.shopify.com${nextHref}`
     await page.goto(nextUrl, {waitUntil: 'domcontentloaded'})
     await page.waitForTimeout(BROWSER_TIMEOUT.medium)
+    await refreshIfPageError(page)
   }
 
   return null
@@ -230,41 +230,62 @@ export async function deleteAppFromDevDashboard(page: Page, appUrl: string): Pro
   // Step 1: Navigate to settings page
   await page.goto(`${appUrl}/settings`, {waitUntil: 'domcontentloaded'})
   await page.waitForTimeout(BROWSER_TIMEOUT.medium)
+  await refreshIfPageError(page)
 
-  // Step 2: Wait for "Delete app" button to be enabled, then click (retry step 1+2 on failure)
+  // Step 2: Wait for "Delete app" button to be enabled, then click (retry with error check)
   const deleteAppBtn = page.locator('button:has-text("Delete app")').first()
-  for (let attempt = 1; attempt <= 5; attempt++) {
+  for (let attempt = 1; attempt <= 3; attempt++) {
+    if (await refreshIfPageError(page)) continue
     const isDisabled = await deleteAppBtn.getAttribute('disabled').catch(() => 'true')
     if (!isDisabled) break
-    await page.waitForTimeout(BROWSER_TIMEOUT.long)
     await page.reload({waitUntil: 'domcontentloaded'})
     await page.waitForTimeout(BROWSER_TIMEOUT.medium)
   }
 
-  await deleteAppBtn.click({timeout: BROWSER_TIMEOUT.long})
+  // Click the delete button — if it's not found, the page didn't load properly
+  const deleteClicked = await deleteAppBtn
+    .click({timeout: BROWSER_TIMEOUT.long})
+    .then(() => true)
+    .catch(() => false)
+  if (!deleteClicked) return false
   await page.waitForTimeout(BROWSER_TIMEOUT.medium)
 
-  // Step 3: Click confirm "Delete app" in the modal (retry step 2+3 if not visible)
+  // Step 3: Click confirm "Delete" in the modal (retry step 2+3 if not visible)
   // The dev dashboard modal has a submit button with class "critical" inside a form
   const confirmAppBtn = page.locator('button.critical[type="submit"]')
   for (let attempt = 1; attempt <= 3; attempt++) {
     if (await confirmAppBtn.isVisible({timeout: BROWSER_TIMEOUT.medium}).catch(() => false)) break
-    if (attempt === 3) break
+    if (attempt === 3) return false
     // Retry: re-click the delete button to reopen modal
     await page.keyboard.press('Escape')
     await page.waitForTimeout(BROWSER_TIMEOUT.short)
-    await deleteAppBtn.click({timeout: BROWSER_TIMEOUT.long})
+    const retryClicked = await deleteAppBtn
+      .click({timeout: BROWSER_TIMEOUT.long})
+      .then(() => true)
+      .catch(() => false)
+    if (!retryClicked) return false
     await page.waitForTimeout(BROWSER_TIMEOUT.medium)
   }
 
   const urlBefore = page.url()
-  await confirmAppBtn.click({timeout: BROWSER_TIMEOUT.long})
+  const confirmClicked = await confirmAppBtn
+    .click({timeout: BROWSER_TIMEOUT.long})
+    .then(() => true)
+    .catch(() => false)
+  if (!confirmClicked) return false
 
   // Wait for page to navigate away after deletion
   try {
     await page.waitForURL((url) => url.toString() !== urlBefore, {timeout: BROWSER_TIMEOUT.max})
     // eslint-disable-next-line no-catch-all/no-catch-all
   } catch (_err) {
+    // URL didn't change — check if page error occurred during redirect
+    if (await refreshIfPageError(page)) {
+      // After refresh, 404 means the app was deleted (settings page no longer exists)
+      const bodyText = (await page.textContent('body')) ?? ''
+      if (bodyText.includes('404: Not Found')) return true
+      return false
+    }
     await page.waitForTimeout(BROWSER_TIMEOUT.medium)
   }
   return page.url() !== urlBefore

packages/e2e/setup/browser.ts

@@ -48,8 +48,22 @@ export const browserFixture = cliFixture.extend<{}, {browserPage: Page}>({
 })
 
 // ---------------------------------------------------------------------------
-// Browser helpers — generic dashboard navigation
+// Browser helpers
 // ---------------------------------------------------------------------------
+
+/**
+ * Check if the current page shows a server error (500, 502). If so, refresh and return true.
+ * Call this in retry loops when a selector isn't found — the page might be an error page.
+ */
+export async function refreshIfPageError(page: Page): Promise<boolean> {
+  const pageText = (await page.textContent('body')) ?? ''
+  if (!pageText.includes('Internal Server Error') && !pageText.includes('502 Bad Gateway')) return false
+  //if (process.env.DEBUG === '1') process.stdout.write('                   page refreshing...\n')
+  await page.reload({waitUntil: 'domcontentloaded'})
+  await page.waitForTimeout(BROWSER_TIMEOUT.medium)
+  return true
+}
+
 /** Navigate to the dev dashboard for the configured org. */
 export async function navigateToDashboard(
   ctx: BrowserContext & {
@@ -63,6 +77,9 @@ export async function navigateToDashboard(
   await browserPage.goto(dashboardUrl, {waitUntil: 'domcontentloaded'})
   await browserPage.waitForTimeout(BROWSER_TIMEOUT.medium)
 
+  // Retry on server errors
+  await refreshIfPageError(browserPage)
+
   // Handle account picker (skip if email not provided)
   if (ctx.email) {
     const accountButton = browserPage.locator(`text=${ctx.email}`).first()
@@ -71,12 +88,4 @@ export async function navigateToDashboard(
       await browserPage.waitForTimeout(BROWSER_TIMEOUT.medium)
     }
   }
-
-  // Retry on 500 errors
-  for (let attempt = 1; attempt <= 3; attempt++) {
-    const pageText = (await browserPage.textContent('body')) ?? '' // eslint-disable-line no-await-in-loop
-    if (!pageText.includes('500: Internal Server Error') && !pageText.includes('Internal Server Error')) break
-    await browserPage.waitForTimeout(BROWSER_TIMEOUT.medium) // eslint-disable-line no-await-in-loop
-    await browserPage.reload({waitUntil: 'domcontentloaded'}) // eslint-disable-line no-await-in-loop
-  }
 }

packages/e2e/setup/store.ts

@@ -125,26 +125,29 @@ export async function createDevStore(
 // Store admin browser actions — uninstall apps and delete stores
 // ---------------------------------------------------------------------------
 
+/** Dismiss the Dev Console panel if visible on a store admin page. */
+export async function dismissDevConsole(page: Page): Promise<void> {
+  const devConsole = page.locator('h2:has-text("Dev Console")')
+  if (!(await devConsole.isVisible({timeout: BROWSER_TIMEOUT.medium}).catch(() => false))) return
+
+  const hideBtn = page.locator('button[aria-label="hide"]').first()
+  if (await hideBtn.isVisible({timeout: BROWSER_TIMEOUT.short}).catch(() => false)) {
+    await hideBtn.click()
+    await page.waitForTimeout(BROWSER_TIMEOUT.short)
+  }
+}
+
 /**
  * Uninstall an app from a store's admin settings page.
  * Navigates to /settings/apps, finds the app by name, uninstalls it, and verifies removal.
  * Returns true if app is confirmed gone, false if still present.
  */
-export async function uninstallAppFromStoreAdmin(page: Page, storeSlug: string, appName: string): Promise<boolean> {
+export async function uninstallAppFromStore(page: Page, storeSlug: string, appName: string): Promise<boolean> {
   await page.goto(`https://admin.shopify.com/store/${storeSlug}/settings/apps`, {
     waitUntil: 'domcontentloaded',
   })
   await page.waitForTimeout(BROWSER_TIMEOUT.long)
-
-  // Dismiss any Dev Console dialog
-  const cancelBtn = page.locator('button:has-text("Cancel")')
-  if (await cancelBtn.isVisible({timeout: BROWSER_TIMEOUT.medium}).catch(() => false)) {
-    await cancelBtn.click()
-    await page.waitForTimeout(BROWSER_TIMEOUT.short)
-  }
-
-  // Check if already uninstalled
-  if (await isAppsPageEmpty(page)) return true
+  await dismissDevConsole(page)
 
   const appSpan = page.locator(`span:has-text("${appName}"):not([class*="Polaris"])`).first()
   if (!(await appSpan.isVisible({timeout: BROWSER_TIMEOUT.long}).catch(() => false))) return true
@@ -164,23 +167,24 @@ export async function uninstallAppFromStoreAdmin(page: Page, storeSlug: string,
     await page.waitForTimeout(BROWSER_TIMEOUT.medium)
   }
 
-  // Verify: reload and check app is gone
-  await page.reload({waitUntil: 'domcontentloaded'})
-  await page.waitForTimeout(BROWSER_TIMEOUT.long)
+  // Verify: check the specific app is gone
+  const check = async () =>
+    page
+      .locator(`span:has-text("${appName}"):not([class*="Polaris"])`)
+      .first()
+      .isVisible({timeout: BROWSER_TIMEOUT.medium})
+      .catch(() => false)
 
-  if (await isAppsPageEmpty(page)) return true
+  if (!(await check())) return true
 
-  // App name no longer visible = success even if other apps remain
-  const stillVisible = await page
-    .locator(`span:has-text("${appName}"):not([class*="Polaris"])`)
-    .first()
-    .isVisible({timeout: BROWSER_TIMEOUT.medium})
-    .catch(() => false)
-  return !stillVisible
+  // If still visible — reload and check again
+  await page.reload({waitUntil: 'domcontentloaded'})
+  await page.waitForTimeout(BROWSER_TIMEOUT.long)
+  return !(await check())
 }
 
-/** Check if the store apps page shows the empty state (zero apps installed). */
-async function isAppsPageEmpty(page: Page): Promise<boolean> {
+/** Check if the current page shows the empty state (zero apps installed). Caller must navigate first. */
+export async function isStoreAppsEmpty(page: Page): Promise<boolean> {
   // "Add apps to your store" empty state is the definitive zero-apps signal
   const emptyState = page.locator('text=Add apps to your store')
   if (await emptyState.isVisible({timeout: BROWSER_TIMEOUT.medium}).catch(() => false)) return true
@@ -191,29 +195,11 @@ async function isAppsPageEmpty(page: Page): Promise<boolean> {
 }
 
 /**
- * Delete a store from the admin settings plan page.
- * Verifies no apps are installed first — refuses to delete if apps remain.
- * Returns true if deleted, false if skipped.
+ * Delete a store via the admin settings plan page.
+ * Caller must verify no apps are installed before calling.
+ * Returns true if deleted, false if not.
  */
-export async function deleteStoreFromAdmin(page: Page, storeSlug: string): Promise<boolean> {
-  // Verify no apps are installed before deleting
-  await page.goto(`https://admin.shopify.com/store/${storeSlug}/settings/apps`, {
-    waitUntil: 'domcontentloaded',
-  })
-  await page.waitForTimeout(BROWSER_TIMEOUT.long)
-
-  const cancelBtn = page.locator('button:has-text("Cancel")')
-  if (await cancelBtn.isVisible({timeout: BROWSER_TIMEOUT.medium}).catch(() => false)) {
-    await cancelBtn.click()
-    await page.waitForTimeout(BROWSER_TIMEOUT.short)
-  }
-
-  if (!(await isAppsPageEmpty(page))) {
-    // Apps still installed — refuse to delete
-    return false
-  }
-
-  // Delete the store
+export async function deleteStore(page: Page, storeSlug: string): Promise<boolean> {
   // Step 1: Navigate to plan page and click delete button to open modal (retry navigation on failure)
   const planUrl = `https://admin.shopify.com/store/${storeSlug}/settings/plan`
   const deleteButton = page.locator('s-internal-button[tone="critical"]').locator('button')
@@ -222,12 +208,13 @@ export async function deleteStoreFromAdmin(page: Page, storeSlug: string): Promi
     try {
       await page.goto(planUrl, {waitUntil: 'domcontentloaded'})
       await page.waitForTimeout(BROWSER_TIMEOUT.long)
+      // If redirected to access_account, store is already deleted
+      if (page.url().includes('access_account')) return true
       await deleteButton.click({timeout: BROWSER_TIMEOUT.long})
       break
       // eslint-disable-next-line no-catch-all/no-catch-all
     } catch (_err) {
       if (attempt === 3) return false
-      await page.waitForTimeout(BROWSER_TIMEOUT.medium)
     }
   }
   await page.waitForTimeout(BROWSER_TIMEOUT.medium)
@@ -264,15 +251,24 @@ export async function deleteStoreFromAdmin(page: Page, storeSlug: string): Promi
     await page.waitForTimeout(BROWSER_TIMEOUT.short)
   }
 
-  await confirmButton.click({force: true})
-  await page.waitForURL(/access_account/, {timeout: BROWSER_TIMEOUT.max})
-
-  // Verify: "Your plan was canceled" confirms the store is deleted
-  const canceled = page.locator('text=Your plan was canceled')
-  const verified = await canceled.isVisible({timeout: BROWSER_TIMEOUT.long}).catch(() => false)
-  return verified || page.url().includes('access_account')
+  const confirmClicked = await confirmButton
+    .click({force: true})
+    .then(() => true)
+    .catch(() => false)
+  if (!confirmClicked) return false
+
+  // Verify: URL reaching access_account confirms store is deleted
+  try {
+    await page.waitForURL(/access_account/, {timeout: BROWSER_TIMEOUT.max})
+    return true
+    // eslint-disable-next-line no-catch-all/no-catch-all
+  } catch (_err) {
+    return false
+  }
 }
 
+
+
 // ---------------------------------------------------------------------------
 // Fixture — per-test dev store for tests that need `app dev`
 // ---------------------------------------------------------------------------