All skills
microsoft avatar

/playwright-dev

@08a37f2
by microsoftmicrosoft/playwright97k stars
6,529

Explains how to develop Playwright - add APIs, MCP tools, CLI commands, and vendor dependencies.

Use this Skill: https://skilld.dev/gh/microsoft/playwright/playwright-dev

This session only. Nothing lands on disk.

dashboard.md

≈302 tokens on demand. Your agent reads this file only when SKILL.md points to it.

Developing Dashboard

packages/dashboard contains the sourcecode behind playwright cli show, a dashboard that allow supervising agents while they use playwright cli.

Important code paths:

  • packages/dashboard has the UI
  • dashboardController.ts has the backend
  • show section in cli-client/program.ts

You can use Playwright CLI to look at the dashboard:

# start the dashboard server in the background
npx playwright cli show --port=0

# open it with Playwright CLI
npx playwright cli open --session=dashboard localhost:PORT
npx playwright cli snapshot

# take screenshots to look at UI stuff
npx playwright cli screenshot

# take videos to showcase you work!
npx playwright cli video-start video.webm

# chapters are not everything - look at video-recording.md to learn about overlays, much more powerful! embrace creativity.
npx playwright cli video-chapter "Chapter Title" --description="Details" --duration=2000
npx playwright cli video-stop

# afterwards, use ffmpeg to turn the video into mp4 for sharing.

Full CLI reference: packages/playwright-core/src/tools/skills/playwright-cli/SKILL.md. In this repo, invoke as npx playwright cli instead of playwright-cli.

Source: SKILL.md on GitHub

1 warning16d5 checks · Risk SAFE
  • Gen Agent Trust Hub16d

    This skill provides a detailed set of development guides for the Playwright project, covering API implementation, tool creation, and architectural overview. It includes instructions for standard development tasks such as building, testing, and dependency management. While the skill describes the creation of tools that interact with untrusted agent input, it emphasizes the use of validation schemas to manage these boundaries.

  • Socket16d

    No alerts

  • Snyk16d

    Risk: LOW · No issues

  • Runlayer6mo

    2/5 files flagged

  • ZeroLeaks5mo

    Score: 93/100 · 2 sections analyzed

Signed by skilld at 08a37f2. This ties the file your Agent reads to that commit on GitHub. It does not review the instructions.

Last checked against GitHub yesterday.

Activeupdated 4 months ago
  • Testing
  • CLI
  • MCP
  • playwright
  • browser-automation
  • api-development
  • vendor-dependencies
  • webkit
  • monorepo

README badge

README badge for microsoft/playwright/playwright-dev

Explains how to extend Playwright itself — adding client/server APIs, MCP tools, CLI commands, and vendor dependencies. Targets contributors to the Playwright monorepo, not end users building test suites.

Generated from the current SKILL.md.

What does this skill help me do?
This skill explains how to develop Playwright itself — adding APIs, MCP tools, CLI commands, and managing vendor dependencies. It's for contributors working on the Playwright codebase, not for using Playwright as a testing library.
Does this cover the monorepo structure and build commands?
Yes. It references CLAUDE.md for monorepo structure, build/test/lint commands, and coding conventions.
Can I learn how to add new APIs or MCP tools to Playwright?
Yes. The skill includes detailed guides on adding and modifying APIs, implementing client/server logic, and adding MCP tools and CLI commands.
Does this cover WebView or WebKit backend development?
Yes. It includes guides for WebView (iOS Safari) backend work and updating WebKit Safari versions.
Is this for using Playwright as a test framework, or for developing Playwright itself?
This is for developing Playwright itself. If you want to write tests with Playwright, you need a different resource.

Generated from the current SKILL.md. These answers refresh after source changes.