playwright-mcp-dev
Explains how to add and debug playwright MCP tools and CLI commands.
- Installs
- 313
- Last 24h
- —
- Trending rank
- —
- Security
- Not audited
Install
Works with every agent the skills CLI supports.
npx skills add https://github.com/microsoft/playwright --skill playwright-mcp-dev- 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-mcp-dev 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.
MCP
Adding MCP Tools
- Create a new tool in
packages/playwright/src/mcp/browser/tools/your-tool.ts - Register the tool in
packages/playwright/src/mcp/browser/tools.ts - Add ToolCapability in
packages/playwright/src/mcp/config.d.ts - Place new tests in
tests/mcp/mcp-<category>.spec.ts
Building
- Assume watch is running at all times, run lint to see type errors
Testing
- Run tests as
npm run ctest-mcp <category> - Do not run test --debug
CLI
Adding commands
- CLI commands are based on MCP tools. Implement the corresponding MCP tool as per
Adding MCP Toolssection above, if needed. - Add new CLI category for tool if needed:
- Add Category in
packages/playwright/src/mcp/terminal/command.ts - Update doc generator
packages/playwright/src/mcp/terminal/helpGenerator.ts
- Add Category in
- Register command in
packages/playwright/src/mcp/terminal/commands.ts - Update skill file at
packages/playwright/src/skill/SKILL.mdand references if necessary inpackages/playwright/src/skill/references/ - Place new tests in
tests/mcp/cli-<category>.spec.ts
Adding CLI options or Config options
When you need to add something to config.
packages/playwright/src/mcp/program.ts- add CLI option and doc
packages/playwright/src/mcp/config.d.ts- add and document the option
packages/playwright/src/mcp/config.ts- modify FullConfig if needed
- and CLIOptions if needed
- add it to configFromEnv
Building
- Assume watch is running at all times, run lint to see type errors
Testing
- Run tests as
npm run ctest-mcp cli-<category> - Do not run test --debug
Lint
- run
npm run flintto lint everything before commit
SKILL File
The skill file is located at packages/playwright/src/skill/SKILL.md. It contains documentation for all available CLI commands and MCP tools. Update it whenever you add new commands or tools.
At any point in time you can run "npm run playwright-cli -- --help" to see the latest available commands and use them to update the skill file.
FAQ
What does the playwright-mcp-dev skill do?
Explains how to add and debug playwright MCP tools and CLI commands.
How do I install playwright-mcp-dev?
Run npx skills add https://github.com/microsoft/playwright --skill playwright-mcp-dev 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-mcp-dev/ (personal) or .claude/skills/playwright-mcp-dev/ (project).
Which AI agents can use playwright-mcp-dev?
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-mcp-dev 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-mcp-dev?
It is published by microsoft in microsoft/playwright, and it is an official skill from the maker of the technology it covers. It has 313 recorded installs.
More from microsoft/playwright
playwright-dev
microsoft/playwright
Explains how to develop Playwright - add APIs, MCP tools, CLI commands, and vendor dependencies.
playwright-devops
microsoft/playwright
DevOps workflows for Playwright - CI failure analysis, workflow debugging, and release operations.
playwright-cli
microsoft/playwright
Automate browser interactions, test web pages and work with Playwright tests.
playwright-triage
microsoft/playwright
Open the skill to read its SKILL.md instructions.
playwright-test-results
microsoft/playwright
Open the skill to read its SKILL.md instructions.
playwright-api
microsoft/playwright
Explains how to add playwright API methods.
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