Disable the dev service worker whenever Playwright drives the browser so dynamic navigations hit the real pages instead of the offline fallback.

Author: webstackdev

@types/window.d.ts

@@ -52,6 +52,11 @@ declare global {
      */
     isPlaywrightControlled?: boolean
 
+    /**
+     * Allows Playwright tests to disable PWA service worker registration
+     */
+    __disableServiceWorkerForE2E?: boolean
+
     /**
      * Snapshot of environment-client results for Playwright assertions
      */

src/components/Pwa/ServiceWorker/client/index.ts

@@ -9,6 +9,18 @@ export const registerServiceWorker = () => {
     return
   }
 
+  const disableForE2E = typeof window !== 'undefined' && window.__disableServiceWorkerForE2E === true
+  if (disableForE2E) {
+    console.info('[pwa] skipping service worker registration for e2e tests')
+    void navigator.serviceWorker.getRegistrations().then((registrations) => {
+      registrations.forEach((registration) => {
+        console.info('[pwa] unregistering service worker (e2e disable)', { scope: registration.scope })
+        void registration.unregister()
+      })
+    })
+    return
+  }
+
   const devMode = isDev()
   const allowDevServiceWorker = devMode && isE2eTest()
 

test/e2e/helpers/pageObjectModels/BasePage.ts

@@ -36,6 +36,9 @@ export class BasePage {
   protected static async setupPlaywrightGlobals(page: Page): Promise<void> {
     await page.addInitScript(() => {
       window.isPlaywrightControlled = true
+      if (typeof window.__disableServiceWorkerForE2E === 'undefined') {
+        window.__disableServiceWorkerForE2E = true
+      }
 
       if (typeof window.__astroPageLoadCounter !== 'number') {
         window.__astroPageLoadCounter = 0