Claude Skill MartBrowse skillsQuick linesLearn by videoTerminal guideWhat is a Skill?
 
← Back to list

Playwright Core Testing Guide

Battle-tested Playwright patterns for writing and debugging reliable E2E, API, component, visual, and accessibility tests.

Dev & CodingIntermediate★ 352⑂ 57AI score 9/10Last updated: Jul 2, 2026

What it does

  • Injects 10 golden rules for reliable tests: prefer getByRole(), never page.waitForTimeout(), use auto-retrying web-first assertions, isolate every test, retries 2 in CI, traces on-first-retry.
  • Routes Claude to 46 reference guides covering locators, assertions, fixtures, network mocking, auth flows, visual regression, accessibility, API/GraphQL testing, file operations, WebSockets, Electron, and security testing.
  • Ships framework recipes for Next.js (App + Pages Router), React, Vue 3/Nuxt and Angular, plus an error-message index and a flaky-test triage workflow.
  • TypeScript and JavaScript examples throughout, with an explicit trust boundary: only test apps you own, and treat page/API content as untrusted input.

Who it's for

  • Frontend developers and QA engineers running Playwright suites
  • Teams fighting flaky tests and red CI pipelines
  • Tech leads deciding test architecture (E2E vs component vs API) and how much to mock

Examples

  1. "Write a login test" → generates a storageState-based auth fixture instead of logging in per test.
  2. "This test only fails in CI" → applies the flaky-tests and debugging guides, inspects the trace, and replaces brittle waits with retrying assertions.
  3. "Mock the payment gateway for a checkout test" → uses page.route() following the rule to mock only third-party services, never your own app.

· · · Install guide · · ·

Try it now, no install

Paste this into Claude to use the skill without installing anything.

Read the instructions in this file and follow them to help me:
https://raw.githubusercontent.com/testdino-hq/playwright-skill/HEAD/core/SKILL.md

What I want: (describe your task here)

If Claude can't open the link, open it yourself and paste the contents instead.

↓ If it works for you, download the ZIP below and install it. Then it runs on its own — no pasting each time.

Install in the Claude app (no terminal)
  1. Download the ZIP with the button below.
  2. In Claude, open Settings → Capabilities and turn on 'Code execution and file creation'. (one time)
  3. Go to Customize → Skills → + → 'Upload a skill' and upload the ZIP.
↓ Download ZIP
Install in Claude Code

Let Claude do it — paste this into Claude Code

Install the skill I found on Claude Skill Mart.
Copy the core folder from the GitHub repo testdino-hq/playwright-skill into my ~/.claude/skills/playwright-core/.
When it's done, tell me in one line what this skill can do.

Install with a command instead

git clone https://github.com/testdino-hq/playwright-skill.git && mkdir -p ~/.claude/skills && cp -r playwright-skill/core ~/.claude/skills/playwright-core

⚠ This is a third-party skill. Check the source repository before installing.

  1. Open a terminal in your working directory.
  2. Clone the repo: git clone https://github.com/testdino-hq/playwright-skill.git
  3. Create the skills folder: mkdir -p ~/.claude/skills
  4. Copy the whole folder so the reference guides come along: cp -r playwright-skill/core ~/.claude/skills/playwright-core
  5. Verify ~/.claude/skills/playwright-core/ contains SKILL.md plus files like locators.md and debugging.md.
  6. Restart Claude Code and ask something like "write a Playwright test for the signup form".
  7. If Playwright isn't set up yet, run npm init playwright@latest in your project first.
View source on GitHub ↗License: MIT