playwright-writing

Enforce Playwright best practices in TypeScript end-to-end tests.

Updated Aug 27, 2026
One-click install
npx skills add https://github.com/meriley/claude-code-skills --skill playwright-writing
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: playwright-writing
Source: https://github.com/meriley/claude-code-skills/tree/main/skills/playwright-writing
Command: npx skills add https://github.com/meriley/claude-code-skills --skill playwright-writing

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill ensures the creation of robust, maintainable, and user-centric end-to-end tests for web applications using Playwright, preventing common pitfalls that lead to flaky tests.

Core Features & Use Cases

  • Best Practice Enforcement: Guides users to follow Playwright's official recommendations for locators, assertions, and test structure.
  • Forbidden Pattern Avoidance: Explicitly prohibits anti-patterns like mocking application data, using explicit waits, and relying on CSS class selectors.
  • Use Case: When writing new end-to-end tests for a critical user flow, use this Skill to ensure the tests are reliable, easy to understand, and resistant to minor UI changes.

Quick Start

Use the playwright-writing skill to review and refactor the attached Playwright test file.

Frequently Asked Questions about playwright-writing

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

FAQPage Schema
How do I write reliable Playwright E2E tests that avoid flakiness?

To write reliable Playwright E2E tests, use user-facing locators, web-first assertions, and maintain test isolation while strictly avoiding explicit waits and mocked application data.

What are the best practices for using locators in Playwright test development?

Best practices for Playwright locators involve prioritizing user-facing attributes to ensure tests are easy to understand and resistant to minor UI changes, strictly avoiding CSS class selectors.

Why does my Playwright test fail when using explicit waits and mocked data?

Playwright tests fail because explicit waits and mocked application data are prohibited anti-patterns that cause flakiness; you should use web-first assertions and real data instead.

Can I use this approach to review and refactor existing Playwright TypeScript tests?

Yes, you can use this approach to review and refactor existing Playwright TypeScript tests by enforcing best practices and eliminating anti-patterns during test debugging.

Does Playwright test development require web-first assertions over explicit waits?

Yes, Playwright test development requires web-first assertions to handle asynchronous operations reliably, explicitly forbidding manual wait mechanisms to prevent flaky tests.

What is the best way to ensure test isolation in Playwright E2E testing?

The best way to ensure test isolation in Playwright E2E testing is to follow official recommendations for test structure and avoid mocking application data, keeping tests independent.