playwright.config.js

import { defineConfig, devices } from '@playwright/test'

process.env.NODE_ENV ??= 'test'

export default defineConfig({
  testDir: './test-e2e',
  testMatch: /(.+\.)?(test|spec)\.[jt]s/,
  // Run tests in files in parallel
  fullyParallel: process.env.CI == null,
  workers: process.env.CI == null ? undefined : 1,
  // Retry on CI only
  retries: (process.env.CI != null) ? 2 : 0,
  timeout: process.env.CI != null ? 30_000 : undefined,

  // Reporter to use. See https://playwright.dev/docs/test-reporters
  // reporter: 'html', // Uncomment to generate HTML report
  use: {
    // Base URL to use in actions like `await page.goto('/')`.
    baseURL: 'http://localhost:3000',

    // Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer
    trace: 'on-first-retry',

    // 'allow' serviceWorkers is the default, but we want to be explicit
    serviceWorkers: 'allow'
  },

  globalSetup: './test-e2e/fixtures/global-setup.ts',
  globalTeardown: './test-e2e/fixtures/global-teardown.ts',

  projects: [
    {
      name: 'chromium',
      use: {
        ...devices['Desktop Chrome']
      }
    },
    {
      name: 'firefox',
      use: {
        ...devices['Desktop Firefox'],
        launchOptions: {
          firefoxUserPrefs: {
            // if we redirect too quickly, too many times, Firefox deletes all
            // site application data (e.g. the service worker)
            'privacy.bounceTrackingProtection.mode': 0
          }
        }
      }
    },
    {
      // NOTE: github CI isn't running these tests successfully, but they work locally.
      name: 'safari',
      use: {
        ...devices['Desktop Safari']
      }
    },
    /**
     * Test a deployed site such as inbrowser.dev with `BASE_URL="https://inbrowser.dev" npm run test:deployed`
     * or inbrowser.link with `BASE_URL="https://inbrowser.link" npm run test:deployed`
     */
    {
      name: 'deployed',
      use: {
        ...devices['Desktop Chrome'],
        ...devices['Desktop Firefox'],
        baseURL: process.env.BASE_URL
      }
    },
    {
      /**
       * Test the site with service workers disabled
       */
      name: 'no-service-worker',
      testMatch: /test-e2e\/no-service-worker\.test\.ts/,
      use: {
        ...devices['Desktop Firefox'],
        contextOptions: {
          serviceWorkers: 'block'
        },
        launchOptions: {
          firefoxUserPrefs: {
            'dom.serviceWorkers.enabled': false
          }
        },
        /**
         *
         * @param {object} param0
         * @param {import('@playwright/test').Page} param0.page
         */
        beforeEach: async ({ page }) => {
          await page.addInitScript(() => {
            Object.defineProperty(navigator, 'serviceWorker', {
              get: () => undefined
            })
          })
        }
      }
    }
  ]
})