Playwright CLI skill: Microsoft's official Playwright skill for coding agents

Source: microsoft/playwright-cli · Maintainer: Microsoft · License: Apache-2.0 · Checked: 23 October 2026

What is the Playwright CLI skill?

The Playwright CLI skill teaches a coding agent like Claude Code or GitHub Copilot to control a real browser with the playwright-cli command: open a page, read a snapshot of it, click, type, fill forms, mock requests, record traces and video, and turn every step into Playwright test code. It is the official Playwright skill from Microsoft, for developers who want their agent to test a web app or write and fix Playwright tests.

It lives in microsoft/playwright-cli, described as a "CLI for common Playwright actions." The skill's description is short: "Automate browser interactions, test web pages and work with Playwright tests."

As of 23 October 2026, the repo had about 14,500 GitHub stars and was last pushed on 19 October 2026. The skill's skills.sh page listed about 194,000 installs.

What does the Playwright CLI skill do?

It teaches a command set. The SKILL.md is mostly a reference of playwright-cli commands, grouped as core actions, navigation, keyboard, mouse, screenshots and PDFs, tabs, storage (cookies, localStorage, sessionStorage), emulation (dark mode, reduced motion, forced colors), network routing and DevTools (console, requests, tracing, video, recording).

It works from snapshots and refs. After each command the CLI saves a snapshot of the page's accessibility tree, where every element has a short ref like e15. The agent reads the snapshot and acts on refs (playwright-cli click e15), and can fall back to CSS selectors or Playwright locators such as getByRole. playwright-cli find "Sign in" searches a large snapshot instead of reading all of it.

It writes test code as it goes. The test generation reference explains that every action prints the matching Playwright TypeScript, such as await page.getByRole('button', { name: 'Sign In' }).click();, which the agent collects into a test file. The same file lays out a plan, generate and heal workflow for new and failing tests.

It debugs real tests. To fix a failing test, the agent runs npx playwright test --debug=cli in the background, then attaches with playwright-cli attach to the paused page and explores from there.

The frontmatter also sets allowed-tools: Bash(playwright-cli:*) Bash(npx playwright:*) Bash(npx --no-install playwright:*), which in Claude Code pre-approves those commands for the turn that invokes the skill (see Claude Code's skills docs).

What's in the folder:

• SKILL.md: the command reference, snapshot and session rules, and short worked examples.
• references/: ten task guides: running and debugging Playwright tests, request mocking, running Playwright code, session management, storage state, test generation, tracing, video recording, attaching screenshots to pull requests, and inspecting element attributes.

How do you install the Playwright CLI skill?

The skill comes with the CLI, so install that first. From the README and the Playwright docs:

npm install -g @playwright/cli@latest
playwright-cli install --skills

install --skills writes the skill to .claude/skills/playwright-cli/ in the current project. The docs add that -g installs it into your home directory instead (~/.claude/skills), and --skills=agents targets .agents/skills for agents that read that folder:

playwright-cli install --skills -g

Because the skill is generated from your installed version, the CLI warns when a project's copy no longer matches and tells you to run the install command again. Re-run it after upgrading.

With the skills CLI. The skills.sh page also lists this, using the skills CLI:

npx skills add https://github.com/microsoft/playwright-cli --skill playwright-cli

You still need @playwright/cli installed for the commands to work. Codex and Cursor read the same SKILL.md format; see Codex skills and Cursor skills.

Without the skill. The README notes you can skip it and tell the agent to read playwright-cli --help on its own.

How do you use it?

Mention Playwright or the task, and the agent picks the skill up. Example prompts (suggestions; the first is close to the README's demo):

• Use playwright skills to test https://demo.playwright.dev/todomvc/. Take screenshots for all successful and failing scenarios.
• Log in to localhost:3000 with the test account, save the auth state, and check the settings page in dark mode.
• The checkout test in tests/checkout.spec.ts is failing. Debug it with playwright-cli and fix it.
• Explore the signup flow and generate a Playwright test for it with role-based locators.
• Mock /api/orders to return an empty list and screenshot the empty state for the PR.

Requirements. Node.js (the README says 18 or newer; the Playwright docs say 20 or newer) and a coding agent. The CLI runs headless by default; pass --headed to open to watch. playwright-cli show opens a dashboard of every running session, so you can watch the agent and take over.

Playwright CLI vs webapp-testing vs agent-browser

All three are licensed under Apache 2.0. Choose by language: if your tests are Playwright Test in TypeScript, this is the natural pick.

Tips and limits

From the files, not from testing:

• CLI or MCP. The README says coding agents favor CLI plus skills because it is more token-efficient, and keeps Playwright MCP for long, stateful loops. See best MCP servers for the MCP side.
• Sessions are in memory by default. Cookies survive between commands but are lost when the browser closes, unless you pass --persistent. A headless session closes after an hour without commands.
• State files hold secrets. The storage state reference says never to commit auth state files, to add them to .gitignore and to delete them after use.
• It runs code you didn't write. eval and run-code execute JavaScript in the page, and page-provided WebMCP tools are labelled untrusted in the skill itself. Point it at sites you trust and use test accounts.
• Watch the pre-approval. The allowed-tools line means Claude Code won't ask before each playwright-cli command in the turn that invokes the skill.

Security audits. On 23 October 2026, the skill's skills.sh page showed Pass from Gen Agent Trust Hub and Warn from both Socket and Snyk, with no further detail on that page. The skill drives a browser and can run JavaScript, so review the SKILL.md and references before installing.

Save it in your Kipt library

In Kipt, open Skills and paste the skill's GitHub folder link into the import box. Kipt reads the SKILL.md and its reference files; for a repo with many skills it shows a list to pick from. You can also drop the folder or a .zip. Your skills live in your own private GitHub repo and install into Claude Code or Codex with one command:

npx skills add https://github.com/<you>/<repo>.git --all -g

You still install @playwright/cli separately. Kipt is not affiliated with Microsoft.

Similar skills

• Playwright best practices skill: Currents.dev's reference for writing solid tests, a good companion to this one.
• webapp-testing skill: Anthropic's Python approach for local apps.
• agent-browser skill: Vercel Labs' browser CLI for agents.
• Web performance skill: measure speed instead of behaviour.