playwright

Reliable Playwright E2E tests prioritize resilient locators using getByRole, getByLabel, and test-id strategies instead of brittle CSS or XPath selectors. This approach ensures tests remain stable during UI styling changes and structural refactors while maintaining accurate element targeting.

Flaky Playwright tests caused by waitForTimeout can be fixed by relying on Playwright's built-in auto-waits and web-first assertion retries, such as expect(...).toBeVisible(). These mechanisms automatically wait for elements to reach actionable states, eliminating arbitrary timeouts and timing-related test failures.

Playwright reuses authentication state across tests using storageState fixtures within the @playwright/test framework. This approach logs in once, saves the authenticated browser state, and injects it into subsequent tests, avoiding repetitive login flows and significantly reducing test execution time.

Playwright supports cross-browser E2E testing in parallel CI pipelines through configurable browser projects and sharded execution. This enables distributing test suites across multiple CI machines and browser engines like Chromium, Firefox, and WebKit for faster, production-grade feedback.

The best way to mock network requests in Playwright is using the route API and HAR file replay for network mocking. This intercepts and fulfills network requests with predefined responses, allowing tests to run deterministically against complex API behaviors without relying on live backend services.

Failing Playwright tests in CI can be debugged using Playwright's trace viewer and trace debugging capabilities. By enabling tracing in your configuration, you capture a detailed post-mortem timeline of test execution, including DOM snapshots, network logs, and console output for remote analysis.