메뉴
Browser automation via Playwright CLI — UI testing, form filling, screenshots, scraping. Token-efficient alternative to MCP. Use when user asks to test UI, automate browser, take screenshots, fill forms, or scrape web pages.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
| name | playwright-cli |
| description | Browser automation via Playwright CLI — UI testing, form filling, screenshots, scraping. Token-efficient alternative to MCP. Use when user asks to test UI, automate browser, take screenshots, fill forms, or scrape web pages. |
playwright-cli is a token-efficient CLI tool for browser automation. It saves the accessibility tree to disk and only passes a summary to the agent — ~90K tokens cheaper than MCP per task.
Run via: npx @playwright/cli <command> (installed globally would be just playwright-cli <command>)
1. npx @playwright/cli open [url] — launch browser (headless by default)
2. npx @playwright/cli snapshot — get accessibility tree, identify element refs
3. npx @playwright/cli click <ref> — interact using refs from snapshot
4. npx @playwright/cli screenshot — capture result
5. npx @playwright/cli close — cleanup
For headed (visible) browser: npx @playwright/cli open --headed [url]
open [url] — launch browser (add --headed to see it)goto <url> — navigate to URLgo-back / go-forward — browser historyclose — close browser sessionsnapshot)click <ref> — click elementdblclick <ref> — double clickfill <ref> <text> — fill input fieldtype <text> — type text into focused elementselect <ref> <value> — select dropdown optioncheck <ref> / uncheck <ref> — checkboxeshover <ref> — hover over elementdrag <startRef> <endRef> — drag and dropupload <file> — file uploadsnapshot — capture page accessibility tree, get element refsscreenshot — take screenshot (saved to disk)pdf — export page as PDFpress <key> — press key (Enter, Tab, etc.)keydown <key> / keyup <key> — key press/releasemousemove <x> <y> / mousedown / mouseup / mousewheelcookie-list / cookie-get <name> / cookie-set / cookie-deletelocalstorage-list / localstorage-get / localstorage-set / localstorage-deletesessionstorage-list / sessionstorage-get / sessionstorage-setroute <pattern> — mock network requestsroute-list — list active mocksunroute [pattern] — remove mocksnetwork — list all network requestsconsole [min-level] — list console messageseval <func> [ref] — evaluate JS on page or elementrun-code <code> — run Playwright code snippettracing-start / tracing-stop — trace recordingvideo-start / video-stop — video recordinglist — list browser sessionsclose-all — close all sessionskill-all — force kill stale sessions-s=<session> flag to work with named sessions (parallel testing)--browser=firefox to use different browserFor parallel sub-agent testing (recommended for form/UI validation):
Prompt to Claude Code:
"Use playwright-cli to test [feature]. Run 3 parallel sub-agents:
1. Happy path — valid inputs, expected flow
2. Edge cases — empty fields, special characters, very long input
3. Validation — invalid email, missing required fields, XSS attempts
Use headed browsers so I can see. Take screenshots of results."
Each sub-agent gets its own session via -s=<name> flag.
--headed to open command to see the browsersnapshot first — to get element refs before interacting-s=agent1, -s=agent2 etc. for parallel agentsclose or close-all when doneDeep research on any topic using parallel agents, web search, and cross-referencing. Use when user asks to research, investigate, or deeply analyze a topic, technology, library, or concept. Triggers on keywords like "research", "investigate", "deep dive", "find out everything about". Supports `--angle` presets for common specializations (competitors, design-refs).
Gateway router for web animation work. Picks between /scroll-animation, /motion-design, or /ai-animation via one AskUserQuestion call, then hands off. Does NOT implement animation — the downstream skills remain the source of truth for their respective domains.
Use when running multi-skill pipelines — new-feature, marketing-launch, design-to-code, web-creation, full-audit, rag-setup workflows
Meta-orchestrator — converts a free-text task description into the right artefact(s) (agent, skill, hook, rule, or block) by composing existing KeiSeiKit primitives. Pure-click decision chain except the single intake field. Enriches `_blocks/` over time via Phase 6 block-augmentation — the kit gets smarter with every invocation.
Deprecated alias for /research with the design-refs angle preset. Routes to /research focused on design patterns, visual archetype references, and award-winning site teardowns.
Continuous parallel quality gate during development — 3 backend agents (security/perf/structure) check every significant code change in real-time. Run after writing code, before committing.