test(e2e): run a safe subset against a deployed URL (ENG-165)

README.md

@@ -43,6 +43,7 @@ pnpm exec playwright install chromium webkit
 pnpm test:e2e
 pnpm test:e2e -- --project=mobile
 pnpm test:e2e -- --project=webkit
+PLAYWRIGHT_BASE_URL=https://danieldcs.com pnpm test:e2e
 ```
 
 `pnpm test:e2e` builds and starts the app (`pnpm build && pnpm start`) via Playwright's `webServer`.

e2e/feed.spec.ts

@@ -1,4 +1,5 @@
-import { expect, test } from '@playwright/test'
+import { expect } from '@playwright/test'
+import { test } from './helpers/block-posthog'
 import { xmlTextContents } from './helpers/xml'
 
 function canonicalHref(html: string) {

e2e/helpers/block-posthog.ts

@@ -0,0 +1,18 @@
+import { test as base } from '@playwright/test'
+
+const postHogHosts = new Set(['us.i.posthog.com', 'us-assets.i.posthog.com'])
+
+export const test = base.extend<{ blockPostHog: undefined }>({
+  blockPostHog: [
+    async ({ page }, use, testInfo) => {
+      if (testInfo.project.name === 'deployed') {
+        await page.route(
+          (url) => postHogHosts.has(url.hostname),
+          (route) => route.abort(),
+        )
+      }
+      await use(undefined)
+    },
+    { auto: true },
+  ],
+})

e2e/not-found.spec.ts

@@ -1,4 +1,5 @@
-import { expect, test } from '@playwright/test'
+import { expect } from '@playwright/test'
+import { test } from './helpers/block-posthog'
 
 const unmatchedPaths = [
   '/qualquer',

e2e/seo-consistency.spec.ts

@@ -1,9 +1,5 @@
-import {
-  type APIRequestContext,
-  expect,
-  type Page,
-  test,
-} from '@playwright/test'
+import { type APIRequestContext, expect, type Page } from '@playwright/test'
+import { test } from './helpers/block-posthog'
 import { getNewestBlogPost } from './helpers/posts'
 import { xmlTextContents } from './helpers/xml'
 

e2e/smoke.spec.ts

@@ -1,4 +1,5 @@
-import { expect, test } from '@playwright/test'
+import { expect } from '@playwright/test'
+import { test } from './helpers/block-posthog'
 
 const lightBackground = 'rgb(242, 235, 235)'
 const darkBackground = 'rgb(16, 13, 13)'

playwright.config.ts

@@ -1,37 +1,67 @@
 import { defineConfig, devices } from '@playwright/test'
 
-const baseURL = 'http://127.0.0.1:3000'
+const deployedBaseURL = process.env.PLAYWRIGHT_BASE_URL
 
-export default defineConfig({
-  testDir: './e2e',
-  fullyParallel: true,
-  forbidOnly: !!process.env.CI,
-  retries: process.env.CI ? 2 : 0,
-  reporter: 'list',
-  use: {
-    baseURL,
-    trace: 'on-first-retry',
-  },
-  projects: [
-    {
-      name: 'chromium',
-      use: { ...devices['Desktop Chrome'] },
-      grepInvert: /@mobile|@smoke/,
-    },
-    {
-      name: 'mobile',
-      use: { ...devices['Pixel 7'] },
-      grep: /@mobile/,
-    },
-    {
-      name: 'webkit',
-      use: { ...devices['Desktop Safari'] },
-      grep: /@smoke/,
-    },
-  ],
-  webServer: {
-    command: 'pnpm build && pnpm start',
-    url: baseURL,
-    reuseExistingServer: !process.env.CI,
-  },
-})
+const deployedTestMatch = [
+  'redirects.spec.ts',
+  'metadata.spec.ts',
+  'seo-consistency.spec.ts',
+  'feed.spec.ts',
+  'not-found.spec.ts',
+  'smoke.spec.ts',
+]
+
+export default defineConfig(
+  deployedBaseURL
+    ? {
+        testDir: './e2e',
+        fullyParallel: true,
+        forbidOnly: !!process.env.CI,
+        retries: process.env.CI ? 2 : 0,
+        reporter: 'list',
+        use: {
+          baseURL: deployedBaseURL,
+          trace: 'on-first-retry',
+        },
+        projects: [
+          {
+            name: 'deployed',
+            use: { ...devices['Desktop Chrome'] },
+            testMatch: deployedTestMatch,
+          },
+        ],
+      }
+    : {
+        testDir: './e2e',
+        fullyParallel: true,
+        forbidOnly: !!process.env.CI,
+        retries: process.env.CI ? 2 : 0,
+        reporter: 'list',
+        use: {
+          baseURL: 'http://127.0.0.1:3000',
+          trace: 'on-first-retry',
+        },
+        projects: [
+          {
+            name: 'chromium',
+            use: { ...devices['Desktop Chrome'] },
+            grepInvert: /@mobile|@smoke/,
+          },
+          {
+            name: 'mobile',
+            use: { ...devices['Pixel 7'] },
+            grep: /@mobile/,
+          },
+          {
+            name: 'webkit',
+            use: { ...devices['Desktop Safari'] },
+            grep: /@smoke/,
+          },
+        ],
+        webServer: {
+          command: 'pnpm build && pnpm start',
+          url: 'http://127.0.0.1:3000',
+          reuseExistingServer: !process.env.CI,
+        },
+      },
+)