メニュー
Browser automation — navigate, click, fill, snapshot web pages. Use for UI testing, documentation scraping, OAuth flows, web research. Always snapshot first, screenshot never (unless required).
Codex または Claude でインストール この Prompt をコピーして Codex、Claude、または他のアシスタントに貼り付けると、Skill ページを確認してインストールできます。
SOC 職業分類に基づく
| name | playwright |
| description | Browser automation — navigate, click, fill, snapshot web pages. Use for UI testing, documentation scraping, OAuth flows, web research. Always snapshot first, screenshot never (unless required). |
Use when: you need to interact with a web page — test a UI, scrape docs, verify a login flow, research a live API.
Token cost: 🟡 LOW-MEDIUM — accessibility snapshots are structured text (no pixel cost); large pages produce verbose trees.
| Task | Use |
|---|---|
| "Test this login form end-to-end" | playwright |
| "Scrape this documentation page" | playwright |
| "Verify OAuth redirect works" | playwright |
| "Find code about auth" | cocoindex-code |
| "Rename AuthService everywhere" | serena |
browser_navigate(url) — go to URL
browser_snapshot() — accessibility tree (PREFER over screenshot)
browser_click(element, ref) — click by accessibility label
browser_fill(element, ref, val) — fill an input
browser_screenshot() — visual capture (only when structure is insufficient)
browser_evaluate(script) — run JS in page context
browser_wait_for_url(url) — wait for navigation
browser_close() — clean up when done
1. browser_navigate(url)
2. browser_snapshot() ← read the accessibility tree
3. browser_click / browser_fill ← interact by element label or ref
4. browser_snapshot() ← verify the new state
5. browser_close() ← always clean up
Never use browser_screenshot as the first action — accessibility snapshots give the same structural information at a fraction of the token cost.
browser_snapshot returns a structured accessibility tree — use element labels for clicking/fillingbrowser_evaluate for data extraction over reading the full snapshot repeatedlybrowser_close when done — open tabs accumulate context.codex/config.toml[mcp_servers.playwright]
command = "npx"
args = ["@playwright/mcp@latest"]
# Pre-install Chromium (avoids delay on first use)
npx playwright install chromium
# Linux CI — with system dependencies
npx playwright install chromium --with-deps
The MCP server (npx @playwright/mcp@latest) lazy-installs on first invocation — no manual setup required if Chromium is already installed.
Auto-configure AGENTS.md and brain/ knowledge docs for a new project. Use when setting up Brain Bootstrap in a new repository. Discovers the codebase, fills in templates, and writes project-specific configuration.
Use before any new feature, component, or behavioral change — when you need to explore requirements and design before writing code. Hard gate — no code until design is approved.
Build the project and verify it compiles cleanly. Use after making changes to confirm nothing is broken before running tests. Reads the build command from brain/build.md.
Activate safety mode — review every destructive command before running. Use before working on production infrastructure, migration scripts, or any task where a typo could be catastrophic.
Generate a user-facing changelog from git commits — categorize, filter noise, translate to user language. Pass a tag or date as argument (e.g. "$changelog v1.0.0" or "$changelog 2026-01-01").
Save session state before context gets full or before ending. Writes current task state, branch, and loaded docs to brain/tasks/todo.md so the next session can resume cleanly.