skills.rest
raulisai
raulisaiCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

playwright-best-practices

Guides writing, debugging, and maintaining Playwright tests in TypeScript across E2E, API, and component testing.

Updated Jun 8, 2026
Search Tags:#typescript#ci/cd#test automation#accessibility#flaky tests#playwright#e2e testing
One-click install
npx skills add https://github.com/raulisai/eva02 --skill playwright-best-practices-raulisai
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: playwright-best-practices
Source: https://github.com/raulisai/eva02/tree/main/.agents/skills/playwright-best-practices
Command: npx skills add https://github.com/raulisai/eva02 --skill playwright-best-practices-raulisai

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve? Writing and maintaining Playwright test suites involves many decisions—locator strategy, waiting behavior, fixtures, CI configuration, mocking, and flakiness diagnosis—and inconsistent choices lead to brittle, slow, unreliable tests. This Skill routes the AI to the right reference document for the task at hand so tests follow proven patterns. ## Core Features & Use Cases - Activity-based reference routing: Maps your current task (writing E2E tests, fixing flaky tests, setting up CI/CD, mocking APIs) to one of 57 focused reference documents across 8 categories. - Broad coverage: E2E, component, API, visual regression, accessibility (axe-core), security, performance, mobile, i18n, Electron, browser extensions, WebSockets, service workers, and framework-specific guidance for React, Angular, Vue, and Next.js. - Debugging and infrastructure support: Trace viewer workflows, flaky test diagnosis, sharding, parallel execution, Docker, GitHub Actions, GitLab CI, and test coverage. - Use Case: You ask the AI to fix a flaky login test; the Skill directs it to the flaky-tests and assertions-waiting references so the fix uses auto-retrying assertions instead of arbitrary timeouts. ## Quick Start Ask the AI to write or fix a Playwright test, such as fixing a flaky login test or adding accessibility checks, and it will apply the relevant best practices automatically.

Frequently Asked Questions about playwright-best-practices

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I fix flaky Playwright tests?▼

Flaky Playwright tests are usually caused by race conditions, explicit waits, or shared state between tests. Replace waitForTimeout with auto-retrying assertions like expect(locator).toBeVisible(), ensure test isolation through fixtures, and use the trace viewer to diagnose timing issues.

How do I write E2E tests with Playwright in TypeScript?▼

Structure tests with role-based locators like getByRole and getByLabel, use web-first assertions for auto-waiting, and organize shared setup with fixtures or Page Object Model. Configure projects and baseURL in playwright.config.ts.

Should I use Page Object Model or fixtures in Playwright?▼

Both patterns are valid and can be combined. POM encapsulates page interactions in classes for readability, while fixtures handle setup, teardown, and dependency injection. The Skill includes a dedicated reference comparing the two approaches.

Does Playwright support accessibility testing with axe-core?▼

Yes, Playwright integrates with @axe-core/playwright to run accessibility scans inside tests. You can analyze full pages or scoped regions, filter by WCAG tags, disable specific rules, and assert that the violations array is empty.

Can Playwright test Electron apps and browser extensions?▼

Yes, Playwright supports Electron desktop apps via the _electron launcher and browser extensions by loading unpacked extensions in a persistent Chromium context. The Skill includes dedicated references for both scenarios.

How do I run Playwright tests in CI with sharding?▼

Playwright supports parallel execution and sharding natively via the --shard flag, splitting tests across CI machines. The Skill covers GitHub Actions, GitLab CI, Docker containers, and blob report merging for sharded runs.

Related Skills

Explore More Software Engineering Skills→
ducthang-hubducthang-hub

playwright-setup-ai-kit

Configure Playwright MCP tooling and generate test configuration files.

Community
Intermediate
petrkindlmannpetrkindlmann
64

ci-cd-integration

Generate GitHub Actions and GitLab CI templates for automated testing and deployment.

Community
Advanced
tkoguttkogut
1

om-synthetic-users

Generates evidence-grounded persona panels that interview and walk product flows as synthetic users.

Community
Advanced
mtsatryanmtsatryan
1

e2e-test-specialist

Automate end-to-end testing workflows across browsers, APIs, and mobile platforms.

Community
Advanced