Home/Testing & QA/playwright-mcp-dev
P

playwright-mcp-dev

by @microsoftv
4.1(46)

Guides on adding new tools in Playwright MCP, including creating tool files, registering tools, and adding tool capabilities to extend the functionality of the automation testing framework.

playwrightend-to-end-testingbrowser-automationweb-testingci/cdGitHub
Installation
npx skills add https://github.com/microsoft/playwright --skill playwright-mcp-dev
compare_arrows

Before / After Comparison

1 组
Before

Manually writing tests for MCP tools in Playwright is a cumbersome and error-prone process, making it difficult to ensure test quality.

After

Follow Playwright MCP development guidelines to efficiently create and test MCP tools, ensuring their functionality and stability.

SKILL.md

playwright-mcp-dev

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 Tools section 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

  • Register command in packages/playwright/src/mcp/terminal/commands.ts

  • Update skill file at packages/playwright/src/skill/SKILL.md and references if necessary in packages/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 flint to 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. Weekly Installs313Repositorymicrosoft/playwrightGitHub Stars84.4KFirst SeenFeb 2, 2026Security AuditsGen Agent Trust HubPassSocketPassSnykPassInstalled onopencode266codex241gemini-cli231claude-code217github-copilot209cursor147

User Reviews (0)

Write a Review

Effect
Usability
Docs
Compatibility

No reviews yet

Statistics

Installs327
Rating4.1 / 5.0
Version
Updated2026年8月17日
Comparisons1

User Rating

4.1(46)
5
41%
4
48%
3
11%
2
0%
1
0%

Rate this Skill

0.0

Compatible Platforms

🔧Claude Code
🔧OpenClaw
🔧OpenCode
🔧Codex
🔧Gemini CLI
🔧GitHub Copilot
🔧Amp
🔧Kimi CLI

Timeline

Created2026年3月17日
Last Updated2026年8月17日
🎁 Agent Knowledge Cards
Survey