Testing

Playwright tests for E2E, API, mobile, and visual regression. Config in playwright.config.ts.

Running tests

All tests: yarn test
E2E: yarn test:e2e
API: yarn test:api
Visual regression: yarn test:visual
Single file: npx playwright test tests/e2e/filename.spec.ts
Single test: npx playwright test -g "test name"
After code changes, run only affected spec files — not the full suite.

BrowserSync workaround

BrowserSync keeps a WebSocket open permanently, preventing networkidle and load from resolving. All fixture files override page.goto() and page.reload() to use waitUntil: "domcontentloaded" by default. Always use domcontentloaded for navigation waits.

Fixtures & helpers

e2e/fixtures.ts — Shared fixtures (authedPage, testUser) and helpers (waitForSpaReady, navigateToRoute, clickSpaLink).
e2e-visual/fixtures.ts — Visual test helpers (waitForVisualReady, hideDynamicContent, prepareForScreenshot, expectScreenshot, getDynamicMasks).
e2e-mobile/fixtures.ts — Mobile helpers (openHamburgerMenu, isMobileViewport, isTabletViewport, isBelowLg).
api/fixtures.ts — API fixtures (api, authedApi, accessToken).
api/helpers/ — API test utilities (test-user.ts, admin-api.ts, maildev.ts).
fixtures/test-constants.ts — Central constants (TEST_USER, ADMIN_TOKEN, API_BASE).

Visual regression

Tests in e2e-visual/ with separate Playwright projects (visual-desktop, visual-iphonese, visual-ipad).
Run: yarn test:visual. Update baselines: yarn test:visual:update.
Screenshots in e2e-visual/__screenshots__/{projectName}/ — MUST be committed.
Tolerance: maxDiffPixelRatio: 0.02 (2%) for cross-OS/hardware rendering differences.
Always call prepareForScreenshot(page) before expectScreenshot().
Use waitForVisualReady(page) instead of waitForSpaReady() — it additionally waits for skeleton loaders and CSS settling.
Dynamic content: hideDynamicContent(page) disables BrowserSync overlay and animations; getDynamicMasks(page) returns locators for non-deterministic elements.
For AI review of screenshots, run ./scripts/export-visual-screenshots.sh.

Coordination

Always coordinate test adjustments with the user: do not fix broken tests to match buggy frontend or vice versa.
When tests fail, first clarify whether the test or the code is wrong.

2.4 KiB Raw Blame History