playwright-mcp-dev
Installation
Summary
Developer guide for extending Playwright MCP tools and CLI commands.
- Add new MCP tools in
packages/playwright/src/mcp/browser/tools/, register intools.ts, and define capabilities inconfig.d.ts - CLI commands map to MCP tools; register new commands in
packages/playwright/src/mcp/terminal/commands.tsand update help generator if adding a category - Config options require updates across
program.ts(CLI option),config.d.ts(definition), andconfig.ts(implementation and environment mapping) - Run
npm run ctest-mcp <category>for testing andnpm run flintbefore commit; always keep watch mode running and use lint to catch type errors
SKILL.md
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.
Related skills
More from microsoft/playwright
playwright-dev
Explains how to develop Playwright - add APIs, MCP tools, CLI commands, and vendor dependencies.
1.7Kplaywright-cli
Automate browser interactions, test web pages and work with Playwright tests.
438playwright-devops
DevOps workflows for Playwright - CI failure analysis, workflow debugging, and release operations.
110playwright-api
Explains how to add playwright API methods.
85playwright-trace
Inspect Playwright trace files from the command line — list actions, view requests, console, errors, snapshots and screenshots.
3