playwright-testing

Install @playwright/test, configure playwright.config.ts with projects for each browser, and write tests using role-based locators like page.getByRole. Organize tests with the Page Object Model so selectors and actions live in reusable page classes.

Use role-based locators such as getByRole and getByLabel first, since they mirror how users interact with the page and resist UI changes. Use getByTestId for stable explicit hooks, and avoid CSS selectors and XPath, which are brittle.

Create a setup project that logs in once and saves the browser state with storageState to a file. Other projects declare a dependency on the setup project and reuse the stored state, so each test starts already authenticated.

Yes. A workflow installs dependencies, runs npx playwright install --with-deps, then executes npx playwright test with environment secrets for base URL and credentials. Upload the playwright-report artifact on failure for debugging.

Flakiness usually comes from hardcoded waits like waitForTimeout, shared state between tests, or brittle CSS selectors. Replace manual waits with auto-waiting web-first assertions, isolate each test, and use role-based locators.

Collect all anchor href attributes on each page, request each URL with the APIRequestContext, and assert every response returns an OK status. A crawler variant can follow internal links to check the entire site, and a scheduled CI workflow runs it weekly.