playwright-pro
Production-grade Playwright testing toolkit. Use when the user mentions Playwright tests, end-to-end testing, browser automation, fixing flaky tests, test migration, CI/CD testing, or test suites. Generate tests, fix flaky failures, migrate from Cypress/Selenium, sync with TestRail, run on BrowserStack. 55 templates, 3 agents, smart reporting.
- Installs
- 684
- Last 24h
- —
- Trending rank
- —
- Security
- Not audited
Install
Works with every agent the skills CLI supports.
npx skills add https://github.com/alirezarezvani/claude-skills --skill playwright-pro- 01
Install
Run the command in your project. The CLI asks which agents to install for.
- 02
Describe the task
Ask your agent for something this skill covers. It loads playwright-pro automatically when relevant.
- 03
Review the result
The agent follows the SKILL.md steps, scripts and references bundled with the skill.
SKILL.md
The instructions your agent reads when the skill is triggered.
Playwright Pro
Production-grade Playwright testing toolkit for AI coding agents.
Available Commands
When installed as a Claude Code plugin, these are available as /pw: commands:
| Command | What it does |
|---|---|
/pw:pw-init | Set up Playwright — detects framework, generates config, CI, first test |
/pw:generate <spec> | Generate tests from user story, URL, or component |
/pw:pw-review | Review tests for anti-patterns and coverage gaps |
/pw:fix <test> | Diagnose and fix failing or flaky tests |
/pw:migrate | Migrate from Cypress or Selenium to Playwright |
/pw:coverage | Analyze what's tested vs. what's missing |
/pw:testrail | Sync with TestRail — read cases, push results |
/pw:browserstack | Run on BrowserStack, pull cross-browser reports |
/pw:report | Generate test report in your preferred format |
Quick Start Workflow
The recommended sequence for most projects:
1. /pw:pw-init → scaffolds config, CI pipeline, and a first smoke test
2. /pw:generate → generates tests from your spec or URL
3. /pw:pw-review → validates quality and flags anti-patterns ← always run after generate
4. /pw:fix <test> → diagnoses and repairs any failing/flaky tests ← run when CI turns red
Validation checkpoints:
- After
/pw:generate— always run/pw:pw-reviewbefore committing; it catches locator anti-patterns and missing assertions automatically. - After
/pw:fix— re-run the full suite locally (npx playwright test) to confirm the fix doesn't introduce regressions. - After
/pw:migrate— run/pw:coverageto confirm parity with the old suite before decommissioning Cypress/Selenium tests.
Example: Generate → Review → Fix
# 1. Generate tests from a user story
/pw:generate "As a user I can log in with email and password"
# Generated: tests/auth/login.spec.ts
# → Playwright Pro creates the file using the auth template.
# 2. Review the generated tests
/pw:pw-review tests/auth/login.spec.ts
# → Flags: one test used page.locator('input[type=password]') — suggests getByLabel('Password')
# → Fix applied automatically.
# 3. Run locally to confirm
npx playwright test tests/auth/login.spec.ts --headed
# 4. If a test is flaky in CI, diagnose it
/pw:fix tests/auth/login.spec.ts
# → Identifies missing web-first assertion; replaces waitForTimeout(2000) with expect(locator).toBeVisible()
Golden Rules
getByRole()over CSS/XPath — resilient to markup changes- Never
page.waitForTimeout()— use web-first assertions expect(locator)auto-retries;expect(await locator.textContent())does not- Isolate every test — no shared state between tests
baseURLin config — zero hardcoded URLs- Retries:
2in CI,0locally - Traces:
'on-first-retry'— rich debugging without slowdown - Fixtures over globals —
test.extend()for shared state - One behavior per test — multiple related assertions are fine
- Mock external services only — never mock your own app
Locator Priority
1. getByRole() — buttons, links, headings, form elements
2. getByLabel() — form fields with labels
3. getByText() — non-interactive text
4. getByPlaceholder() — inputs with placeholder
5. getByTestId() — when no semantic option exists
6. page.locator() — CSS/XPath as last resort
What's Included
- 9 skills with detailed step-by-step instructions
- 3 specialized agents: test-architect, test-debugger, migration-planner
- 55 test templates: auth, CRUD, checkout, search, forms, dashboard, settings, onboarding, notifications, API, accessibility
- 2 MCP servers (TypeScript): TestRail and BrowserStack integrations (optional — not auto-registered; see Integration Setup)
- Smart hooks: auto-validate test quality, auto-detect Playwright projects
- 6 reference docs: golden rules, locators, assertions, fixtures, pitfalls, flaky tests
- Migration guides: Cypress and Selenium mapping tables
Integration Setup
Not auto-registered (issue #978). The TestRail and BrowserStack MCP servers are no longer declared in the plugin's
.mcp.json(they failed to connect for every user — no bundlednode_modules). Exporting the env vars below is not enough:/pw:testrail//pw:browserstackfail with "tool not found" until you enable the server manually (cd integrations/<name>-mcp && npm install, then register it in your own user/project MCP config). SeeCLAUDE.md→ Integrations.
TestRail (Optional)
export TESTRAIL_URL="https://your-instance.testrail.io"
export TESTRAIL_USER="your@email.com"
export TESTRAIL_API_KEY="your-api-key"
BrowserStack (Optional)
export BROWSERSTACK_USERNAME="your-username"
export BROWSERSTACK_ACCESS_KEY="your-access-key"
Quick Reference
See reference/ directory for:
golden-rules.md— The 10 non-negotiable ruleslocators.md— Complete locator priority with cheat sheetassertions.md— Web-first assertions referencefixtures.md— Custom fixtures and storageState patternscommon-pitfalls.md— Top 10 mistakes and fixesflaky-tests.md— Diagnosis commands and quick fixes
See templates/README.md for the full template index.
FAQ
What does the playwright-pro skill do?
Production-grade Playwright testing toolkit. Use when the user mentions Playwright tests, end-to-end testing, browser automation, fixing flaky tests, test migration, CI/CD testing, or test suites. Generate tests, fix flaky failures, migrate from Cypress/Selenium, sync with TestRail, run on BrowserStack. 55 templates, 3 agents, smart reporting.
How do I install playwright-pro?
Run npx skills add https://github.com/alirezarezvani/claude-skills --skill playwright-pro in your project. The skills CLI detects the agents you use and copies the skill into the right folder. For Claude Code you can also place the skill folder at ~/.claude/skills/playwright-pro/ (personal) or .claude/skills/playwright-pro/ (project).
Which AI agents can use playwright-pro?
Any agent that supports the open Agent Skills format (a folder with a SKILL.md file), including Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, Windsurf, Cline, OpenCode and more.
Is playwright-pro safe to install?
No partner security audit is available yet. Skills can run commands and scripts, so read the SKILL.md and any bundled files before installing.
Who maintains playwright-pro?
It is published by alirezarezvani in alirezarezvani/claude-skills. It has 684 recorded installs.
More from alirezarezvani/claude-skills
engineering-skills
alirezarezvani/claude-skills
Index of the engineering-team skills bundle for Claude Code, Codex, Gemini CLI, Cursor, OpenClaw, and 6 more tools. Architecture, frontend, backend, QA, DevOps, security, AI/ML, data engineering, Playwright, Stripe, AWS, MS365 (stdlib-only Python tools). Use when browsing or choosing among engineering-team role skills — load only the one specialist SKILL.md you need, never bulk-load the bundle.
finance-skills
alirezarezvani/claude-skills
Router/index for the finance skills bundled in this plugin: financial-analyst (ratio analysis, DCF valuation, budget variance, rolling forecasts), saas-metrics-coach (ARR/MRR, churn, CAC/LTV, NRR, quick ratio) and month-end-close (close calendar, reconciliations, flux review). Use when a finance request doesn't obviously match one skill and you need to pick the right one (e.g., 'analyze these financials', 'how healthy are my SaaS metrics').
marketing-skills
alirezarezvani/claude-skills
Directory and router for the marketing skills library. Use when you need to find the right marketing skill for a task, see what marketing capabilities exist, or get oriented in this plugin. 44 specialist skills across 8 pods (content, SEO + AEO, CRO, channels, growth, intelligence, sales enablement, ops), 59 stdlib Python tools. Routes to one skill — it does not execute marketing work itself.
business-growth-skills
alirezarezvani/claude-skills
Router/index for the 4 business & growth skills bundled in this plugin: customer-success-manager (health scoring, churn risk, expansion), sales-engineer (RFP analysis, competitive matrices, PoC planning), revenue-operations (pipeline, forecast accuracy, GTM efficiency), and contract-and-proposal-writer. Use when a growth/revenue request doesn't obviously match one skill and you need to pick the right one (e.g., 'which accounts are at risk', 'should we bid on this RFP').
engineering-advanced-skills
alirezarezvani/claude-skills
Index of 37 advanced engineering agent skills for Claude Code, Codex, Gemini CLI, Cursor, OpenClaw. Use when browsing or choosing among the POWERFUL-tier engineering skills: agent design, RAG, MCP servers, CI/CD, database design, observability, security auditing, changelog/release automation, reliability (SLO/chaos/flags/operators), platform ops.
product-skills
alirezarezvani/claude-skills
Use when coordinating product work across the 12 bundled product sub-skills (RICE, OKRs, UX research, design tokens, competitive teardown, analytics, experiments, discovery, roadmaps, spec-to-repo, landing pages, SaaS scaffolding) or the 4 standalone product-team plugins (user stories, Apple HIG, code-to-PRD, research summarizer). Triggers on 'help me prioritize', 'plan a product experiment', 'we ship features nobody uses', 'run the discovery loop', 'is our OST sound'. Forks context to route to one sub-skill via a deterministic signal router and returns a digest; can also drive a continuous-discovery loop (Torres cadence tracker + OST linter as machine gates) or a full goal→plan→execute→verify→close run through the repo-wide agent-harness. Distinct from project-management (how to deliver vs what to build), marketing/landing (from-scratch pages), and engineering/agent-harness (the generic loop engine this orchestrator plugs into).
Popular testing & qa skills
tdd
mattpocock/skills
Test-driven development. Use when the user wants to build features or fix bugs test-first, mentions "red-green-refactor", or wants integration tests.
grilling
mattpocock/skills
Grill the user relentlessly about a plan, decision, or idea. Use when the user wants to stress-test their thinking, or uses any 'grill' trigger phrases.
migrate-to-shoehorn
mattpocock/skills
Migrate test files from as type assertions to @total-typescript/shoehorn. Use when user mentions shoehorn, wants to replace as in tests, or needs partial test data.
run-train
lllllllama/rigorpilot-skills
Rigor Train skill for deep learning research repositories. Use when a documented or selected training command should be run conservatively for startup verification, short-run verification, full kickoff, or resume, with command, config, seed, log, checkpoint, status, and metric evidence written to standardized trainoutputs/. Do not use for environment setup, exploratory sweeps, speculative idea implementation, or end-to-end orchestration.
test-driven-development
obra/superpowers
Use when implementing any feature or bugfix, before writing implementation code
finishing-a-development-branch
obra/superpowers
Use when implementation is complete, all tests pass, and you need to decide how to integrate the work