e2e-test

Playwright tests use the test and expect functions to navigate pages, fill forms, and assert outcomes with auto-waiting built in. Organize tests around critical user flows like login and checkout, and use page objects to keep selectors reusable.

Playwright supports Chromium, Firefox, and WebKit with fast parallel execution and real device emulation, making it better for flexibility. Cypress offers a simpler developer experience but limited browser support, so it suits teams prioritizing ease of use.

Replace explicit sleeps with auto-waiting and network idle states, use stable data-testid selectors, and isolate tests by clearing cookies and storage. Configure 2 retries in CI and keep the flake rate under 5% by fixing or disabling unstable tests.

Add a workflow that checks out the repo, installs Node dependencies, runs npx playwright install --with-deps, then executes npx playwright test. Upload the playwright-report artifact so screenshots, videos, and traces are available for failed runs.

Perform login once in a setup test and save the browser state with storageState to an auth.json file. Configure Playwright to reuse that state so subsequent tests start already authenticated without repeating the login flow.

E2E tests should cover only critical user flows, typically 10 to 20 tests rather than hundreds. They are slow and expensive to maintain, so push broader coverage down to integration and unit tests.