Fix E2E stress test errors - crone tests, add a dependency health gate eliminated the socket hang

Author: webstackdev

E2E_STESS_TESTS.md

@@ -9,17 +9,7 @@ See the "CONSOLE OUTPUT FROM LAST E2E FULL RUN THAT ERRORED" section for the nex
 
 ## Problems Areas
 
-1. **Dynamic imports to `environmentClient.ts` fail in browser context**
-
-  - **Symptom:** Every package-release/privacy-policy integration test throws `Failed to fetch dynamically imported module: http://localhost:4321/src/components/scripts/utils/environmentClient.ts` when calling `page.evaluate(() => import('/src/components/scripts/utils/environmentClient.ts'))`.
-
-  - **Diagnostics:** Reproduce manually in devtools to see the exact network error (404 vs MIME/CSP). Verify Vite/Astro still exposes that path in dev server. Consider switching tests to import via the published bundle path (e.g., `/@fs/...` or `@components/scripts/utils/environmentClient`) instead of hard-coded `/src/...` to match current Vite behavior.
-
-2. **Cron cleanup endpoint intermittently hangs**
-
-  - **Symptom:** `cron.spec.ts › cleanup-confirmations removes expired and stale rows` fails with `apiRequestContext.get: socket hang up` against `http://localhost:4321/api/cron/cleanup-confirmations` (Chrome only, mock auth header present).
-
-  - **Diagnostics:** Check dev server logs for that request to confirm whether the endpoint crashes or never responds. Re-run the spec with `DEBUG=astro:*` to capture server-side stack traces. Validate the mock Supabase/Upstash containers are healthy before the cron suite runs (missing dependency could keep the endpoint hanging while waiting on Redis/Supabase).
+_No active issues. Add new items here when the next flake appears._
 
 ## LOG OF FIXES APPLIED TO PROBLEMS IDENTIFIED DURING E2E STRESS TESTS
 
@@ -45,4 +35,14 @@ See the "CONSOLE OUTPUT FROM LAST E2E FULL RUN THAT ERRORED" section for the nex
 
 Theme Picker reload diagnostics: Instrumented `setupCleanTestPage` with Playwright-only snapshots and re-ran the WebKit theme picker suite; no policy-check cancellations observed, but logs now capture sufficient context if the flake returns.
 
+### Cron Cleanup Endpoint Hang
+
+- **Symptom:** `cron.spec.ts` intermittently failed on Chrome-based projects with `socket hang up`, and parallel runs across all Playwright projects deleted Supabase seeds before assertions executed.
+
+- **Diagnostics:** Confirmed Supabase/Upstash dependencies occasionally came up late, and the suite executed on every Chromium-flavored project (`Google Chrome`, `Mobile Chrome`, `Microsoft Edge`), causing multiple workers to hit the same fixtures concurrently. Upstash seeds were also left behind between retries.
+
+- **Findings:** Adding a dependency health gate eliminated the socket hang, but the spec still needed to run exactly once and clean up Redis state so retries start from a known baseline.
+
+- **Resolution:** Limited the cron suite to the `chromium` project via `test.info().project.name`, added deterministic Supabase/Upstash cleanup (`ensureCronDependenciesHealthy`, Supabase ID tracking, and Upstash command helpers that restore `__cron_keepalive__` after each test), and re-ran `npx dotenv -e .env.development -- cross-env CI=1 FORCE_COLOR=1 E2E_MOCKS=1 npx playwright test test/e2e/specs/15-cron/cron.spec.ts`. The all-project run now reports 3 chromium passes and 18 skips with consistent Upstash state.
+
 ## CONSOLE OUTPUT FROM LAST E2E FULL RUN THAT ERRORED

test/e2e/helpers/cronHealth.ts

@@ -0,0 +1,124 @@
+import { setTimeout as delay } from 'node:timers/promises'
+
+interface RetryOptions {
+  retries?: number
+  delayMs?: number
+  timeoutMs?: number
+}
+
+const DEFAULT_OPTIONS: Required<RetryOptions> = {
+  retries: 5,
+  delayMs: 1000,
+  timeoutMs: 4000,
+}
+
+const fetchWithTimeout = async (url: string, init: RequestInit, timeoutMs: number) => {
+  const controller = new AbortController()
+  const timer = setTimeout(() => controller.abort(), timeoutMs)
+
+  try {
+    const response = await fetch(url, { ...init, signal: controller.signal })
+    return response
+  } catch (error) {
+    if (error instanceof Error && error.name === 'AbortError') {
+      throw new Error(`Request to ${url} timed out after ${timeoutMs}ms`)
+    }
+    throw error
+  } finally {
+    clearTimeout(timer)
+  }
+}
+
+const withRetries = async (action: () => Promise<void>, label: string, options?: RetryOptions) => {
+  const { retries, delayMs, timeoutMs } = { ...DEFAULT_OPTIONS, ...options }
+  let lastError: unknown
+
+  for (let attempt = 1; attempt <= retries; attempt += 1) {
+    try {
+      await action()
+      return
+    } catch (error) {
+      lastError = error
+      if (attempt === retries) {
+        break
+      }
+      await delay(delayMs)
+    }
+  }
+
+  const message = lastError instanceof Error ? lastError.message : String(lastError)
+  throw new Error(`${label} health check failed after ${retries} attempts (${timeoutMs}ms timeout): ${message}`)
+}
+
+const buildSupabaseHealthUrl = (baseUrl: string) => new URL('/rest/v1/?select=1', baseUrl).toString()
+const buildUpstashCommandUrl = (baseUrl: string) => new URL('/', baseUrl).toString()
+
+const ensureSupabaseReady = async (supabaseUrl: string, serviceRoleKey: string, options?: RetryOptions) => {
+  const healthUrl = buildSupabaseHealthUrl(supabaseUrl)
+  await withRetries(
+    async () => {
+      const response = await fetchWithTimeout(
+        healthUrl,
+        {
+          headers: {
+            apikey: serviceRoleKey,
+            Authorization: `Bearer ${serviceRoleKey}`,
+          },
+        },
+        options?.timeoutMs ?? DEFAULT_OPTIONS.timeoutMs
+      )
+
+      if (!response.ok) {
+        throw new Error(`Supabase responded with status ${response.status}`)
+      }
+    },
+    'Supabase REST API',
+    options
+  )
+}
+
+const ensureUpstashReady = async (upstashUrl: string, upstashToken: string, options?: RetryOptions) => {
+  const commandUrl = buildUpstashCommandUrl(upstashUrl)
+  await withRetries(
+    async () => {
+      const response = await fetchWithTimeout(
+        commandUrl,
+        {
+          method: 'POST',
+          headers: {
+            Authorization: `Bearer ${upstashToken}`,
+            'Content-Type': 'application/json',
+          },
+          body: JSON.stringify(['PING']),
+        },
+        options?.timeoutMs ?? DEFAULT_OPTIONS.timeoutMs
+      )
+
+      if (!response.ok) {
+        throw new Error(`Upstash responded with status ${response.status}`)
+      }
+    },
+    'Upstash REST API',
+    options
+  )
+}
+
+export interface CronDependencyConfig extends RetryOptions {
+  supabaseUrl: string
+  supabaseServiceKey: string
+  upstashUrl: string
+  upstashToken: string
+}
+
+export async function ensureCronDependenciesHealthy({
+  supabaseUrl,
+  supabaseServiceKey,
+  upstashUrl,
+  upstashToken,
+  ...options
+}: CronDependencyConfig): Promise<void> {
+  await Promise.all([
+    ensureSupabaseReady(supabaseUrl, supabaseServiceKey, options),
+    ensureUpstashReady(upstashUrl, upstashToken, options),
+  ])
+}

test/e2e/specs/15-cron/cron.spec.ts

@@ -1,6 +1,7 @@
 import { randomUUID } from 'node:crypto'
 import { createClient, type SupabaseClient } from '@supabase/supabase-js'
 import { expect, mocksEnabled, test } from '@test/e2e/helpers'
+import { ensureCronDependenciesHealthy } from '@test/e2e/helpers/cronHealth'
 /**
  * These env helpers are safe to use in E2E test as they call process.env
  * directly. Must use "npm run dev:env" for this test case to pass.
@@ -44,16 +45,19 @@ const supabaseAdmin: SupabaseClient | null = skipReason
     })
 
 const upstashCommandEndpoint = UPSTASH_URL ? new URL('/', UPSTASH_URL).toString() : null
+const upstashKeepAliveKey = '__cron_keepalive__'
 const cronAuthHeader = CRON_SECRET ? `Bearer ${CRON_SECRET}` : null
 
-const skipUnlessChromium = (browserName: string) => {
-  test.skip(browserName !== 'chromium', 'Cron tests run once via chromium project to avoid duplicates')
+const skipUnlessChromiumProject = () => {
+  const projectName = test.info().project.name
+  test.skip(projectName !== 'chromium', 'Cron tests run once via chromium project to avoid duplicates')
 }
 
 const dayInMs = 24 * 60 * 60 * 1000
 
 const createdConfirmationIds = new Set<string>()
 const createdDsarIds = new Set<string>()
+const upstashSeedsToRestore = new Map<string, string | null>()
 
 const queueCleanup = (bucket: Set<string>, id: string) => {
   bucket.add(id)
@@ -69,6 +73,58 @@ const cleanupRecords = async (table: 'newsletter_confirmations' | 'dsar_requests
   ids.clear()
 }
 
+const sendUpstashCommand = async (command: (string | number)[]) => {
+  if (!upstashCommandEndpoint) {
+    throw new Error('Missing Upstash endpoint')
+  }
+
+  const response = await fetch(upstashCommandEndpoint, {
+    method: 'POST',
+    headers: {
+      Authorization: `Bearer ${UPSTASH_TOKEN!}`,
+      'Content-Type': 'application/json',
+    },
+    body: JSON.stringify(command),
+  })
+
+  if (!response.ok) {
+    const body = await response.text().catch(() => 'Unable to read response body')
+    throw new Error(`Failed to run Upstash command: ${response.status} ${body}`)
+  }
+
+  return response
+}
+
+const readUpstashValue = async (key: string) => {
+  const response = await sendUpstashCommand(['GET', key])
+  try {
+    const payload = (await response.json()) as { result?: string | null }
+    if (!Object.prototype.hasOwnProperty.call(payload, 'result')) {
+      return null
+    }
+    const value = payload.result
+    return typeof value === 'string' ? value : null
+  } catch {
+    return null
+  }
+}
+
+const restoreUpstashSeeds = async () => {
+  if (!upstashCommandEndpoint || upstashSeedsToRestore.size === 0) {
+    return
+  }
+
+  for (const [key, previousValue] of upstashSeedsToRestore.entries()) {
+    if (previousValue === null) {
+      await sendUpstashCommand(['DEL', key])
+    } else {
+      await sendUpstashCommand(['SET', key, previousValue])
+    }
+  }
+
+  upstashSeedsToRestore.clear()
+}
+
 const insertNewsletterConfirmation = async (options: {
   expiresAt: Date
   confirmedAt?: Date | null
@@ -146,38 +202,39 @@ const expectMissingById = async (table: 'newsletter_confirmations' | 'dsar_reque
 }
 
 const setUpstashKeepAlive = async (value: string) => {
-  if (!upstashCommandEndpoint) {
-    throw new Error('Missing Upstash endpoint')
+  if (!upstashSeedsToRestore.has(upstashKeepAliveKey)) {
+    const previousValue = await readUpstashValue(upstashKeepAliveKey)
+    upstashSeedsToRestore.set(upstashKeepAliveKey, previousValue)
   }
-  const response = await fetch(upstashCommandEndpoint, {
-    method: 'POST',
-    headers: {
-      Authorization: `Bearer ${UPSTASH_TOKEN!}`,
-      'Content-Type': 'application/json',
-    },
-    body: JSON.stringify(['SET', '__cron_keepalive__', value]),
-  })
 
-  if (!response.ok) {
-    const body = await response.text().catch(() => 'Unable to read response body')
-    throw new Error(`Failed to seed Upstash: ${response.status} ${body}`)
-  }
+  await sendUpstashCommand(['SET', upstashKeepAliveKey, value])
 }
 
 test.describe('Cron API endpoints @ready', () => {
   test.describe.configure({ mode: 'serial' })
 
   if (skipReason) {
     test.skip(true, skipReason)
+  } else {
+    test.beforeAll(async () => {
+      await ensureCronDependenciesHealthy({
+        supabaseUrl: SUPABASE_URL!,
+        supabaseServiceKey: SUPABASE_SERVICE_ROLE_KEY!,
+        upstashUrl: UPSTASH_URL!,
+        upstashToken: UPSTASH_TOKEN!,
+        timeoutMs: 5000,
+      })
+    })
   }
 
   test.afterEach(async () => {
     await cleanupRecords('newsletter_confirmations', createdConfirmationIds)
     await cleanupRecords('dsar_requests', createdDsarIds)
+    await restoreUpstashSeeds()
   })
 
-  test('@ready cleanup-confirmations removes expired and stale rows', async ({ browserName, request }) => {
-    skipUnlessChromium(browserName)
+  test('@ready cleanup-confirmations removes expired and stale rows', async ({ request }) => {
+    skipUnlessChromiumProject()
 
     const now = Date.now()
     const expiredId = await insertNewsletterConfirmation({
@@ -207,8 +264,8 @@ test.describe('Cron API endpoints @ready', () => {
     await expectMissingById('newsletter_confirmations', staleId)
   })
 
-  test('@ready cleanup-dsar-requests prunes fulfilled and expired items', async ({ browserName, request }) => {
-    skipUnlessChromium(browserName)
+  test('@ready cleanup-dsar-requests prunes fulfilled and expired items', async ({ request }) => {
+    skipUnlessChromiumProject()
 
     const now = Date.now()
     const fulfilledId = await insertDsarRequest({
@@ -238,8 +295,8 @@ test.describe('Cron API endpoints @ready', () => {
     await expectMissingById('dsar_requests', expiredPendingId)
   })
 
-  test('@ready ping-integrations touches Upstash and Supabase', async ({ browserName, request }) => {
-    skipUnlessChromium(browserName)
+  test('@ready ping-integrations touches Upstash and Supabase', async ({ request }) => {
+    skipUnlessChromiumProject()
     const sentinel = `keepalive-${randomUUID()}`
     await setUpstashKeepAlive(sentinel)