playwright-dev_skill

Overview

This skill explains how to develop Playwright by adding or modifying APIs, extending MCP tools and CLI commands, and vendoring third-party dependencies. It focuses on practical steps for implementation, testing, and integrating changes into the TypeScript codebase. The guidance assumes a local build/watch workflow and includes linting and testing reminders.

How this skill works

The skill describes how to define API surface and documentation, implement client and server changes in TypeScript, and add unit and integration tests to validate behavior. It shows how to extend MCP tools and CLI commands with new options and configuration, and how to vendor npm packages into playwright-core or the main playwright package. It also covers the development workflow: build/watch, run tests, and lint before committing.

When to use it

• Adding new Playwright APIs or extending existing API signatures
• Implementing client/server protocol changes or new test primitives
• Creating or updating MCP developer tools and CLI commands
• Bundling third-party npm packages into playwright-core or playwright
• Onboarding contributors to the Playwright TypeScript codebase
• Preparing changes that require new tests and documentation

Best practices

• Define clear API docs and TypeScript types before implementation
• Add unit and integration tests that exercise both client and server paths
• Keep MCP and CLI changes backward compatible and document config options
• Vendor only necessary modules and track provenance to ease upgrades
• Use npm run build/watch during development and run npm run flint before committing
• Split changes into small, reviewable commits: API, implementation, tests, docs

Example use cases

• Expose a new browser context option and update corresponding server RPC
• Add a CLI subcommand to automate a common testing workflow for CI
• Vendor a specialized assertion library into playwright-core for offline installs
• Implement a new MCP tool that generates test scaffolding from templates
• Change a protocol message and add cross-process tests to validate compatibility