Playwright Browser Automation Skill
Lets coding agents write and run real Playwright scripts on the fly for page testing, screenshots, login flows, and arbitrary browser automation.
Has Claude write and execute browser-automation scripts on the fly (non-headless by default), able to open arbitrary URLs and interact with pages. Scripts are confined to /tmp rather than the project directory, which bounds but doesn't eliminate the fact that this is arbitrary code execution.
- Claude generates and runs browser-automation code on the fly and can visit arbitrary URLs — be aware of what site you're pointing it at
What does this skill do, and when should you use it?
playwright-skill is an Agent Skill for coding agents that writes and executes custom Playwright code per request, rather than relying on prebuilt scripts. It ships a portable executor (run.js), dev-server auto-detection, and a small set of optional helpers, defaulting to a visible browser. A one-time npm run setup installs Playwright and Chromium. It is best suited when the automation script itself is an artifact worth keeping and rerunning.
The skill instructs the agent to: read its SKILL.md workflow; detect running local dev servers via a built-in detectDevServers helper; write one-off scripts to the system temp directory (or persist them via PW_SCRIPT_DIR); execute scripts through run.js for stable module resolution; and report results including screenshots and console output. It supports screenshots, multi-viewport responsive checks, login flows (credentials from environment variables), link checks, cookie-banner handling, attaching to an existing Chrome debugging session over CDP, and configuration of browser engine, headless mode, and extra HTTP headers via environment variables.
- A developer asks the agent to test a local project: the skill auto-detects the localhost dev server and verifies page loads and console output
- A frontend engineer needs mobile vs desktop comparisons: the agent generates full-page screenshots across multiple viewports
- A tester validates signup/login flows: the agent drives the full login using test credentials from environment variables and asserts post-login elements
- A maintainer hunts broken links or missing images: the agent crawls pages running link and resource checks
- Reusing cookies and extensions from an authenticated browser: the agent connects to an existing Chrome session via CDP
What are this skill's strengths and limitations?
- Agent writes bespoke scripts per request — handles loops, assertions, multiple contexts, and other real-program needs, not just prebuilt templates
- Visible browser by default makes automation observable in real time
- Practical helpers: dev-server detection, cookie-banner handling, screenshots
- run.js executor solves module resolution and supports saving and rerunning scripts
- Thorough documentation with a full API reference and progressive disclosure
- Requires Node.js 20+ and a network download of Playwright and Chromium on first use
- Firefox/WebKit need an extra install-all-browsers step
- No test suite or evidence of verification on platforms beyond Claude Code in the source material
- Connecting to an existing Chrome session inherits the user's full access — caution needed with secrets
- Scripts default to the temp directory; persisting them requires manually setting PW_SCRIPT_DIR
How do you install this skill?
Recommended: Vercel's skills CLI — npx skills add lackeyjb/playwright-skill --skill playwright-skill --global --yes (add --agent claude-code cursor to target specific agents). Alternatively, as a Claude Code plugin: /plugin marketplace add lackeyjb/playwright-skill then /plugin install playwright-skill@playwright-skill. Or download from GitHub Releases and copy skills/playwright-skill/ into ~/.claude/skills/playwright-skill or your project's .claude/skills/ directory. In all cases, run npm run setup once inside the skill directory to install Playwright and Chromium (network required on first setup).
How do you use this skill?
After installation, describe a browser task in natural language, e.g. "Test the homepage", "Take screenshots of the dashboard in mobile and desktop", "Fill out the registration form and submit it", or "Check for broken links". The agent writes custom Playwright code, executes it via run.js, and returns console output and screenshots. Run npm run install-all-browsers if you need Firefox or WebKit; tune behavior with PW_BROWSER, PW_HEADLESS, PW_ARTIFACT_DIR, and similar environment variables. Full capabilities (network interception, video, device emulation) are documented in API_REFERENCE.md.
How does this skill compare with similar options?
The README explicitly contrasts two alternatives: Microsoft's official @playwright/cli (for straightforward interactive browsing, installable via playwright-cli install --skills) and playwright-mcp (tool-based browser control with accessibility snapshots). This project positions itself as the code-first option — use it when the automation script itself is the useful artifact.