메뉴
Interacts with local browser via Chrome DevTools Protocol (only triggered after user explicitly requests to inspect, debug, or interact with pages open in Chrome)
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
Maintain package-level `agentmap.md` files as outline-level maps of the real file tree and core responsibilities. Use when package structure or responsibility boundaries change and the corresponding `agentmap.md` must be created or updated.
Review uncommitted code changes to find unreasonable design, unfinished requirements, potential bugs, missed reuse opportunities, and optimization opportunities. Use when the user asks for a review of pending, uncommitted, or unpublished code changes and expects both findings and concrete improvements.
Guides the generation, reading, and updating of agentmap.md files. This skill ensures a consistent and up-to-date codebase map for AI Agents.
Guides styling implementation using TailwindCSS + CSS Modules. Triggered when handling component styles, layout design, or CSS patterns.
Specialized for translating document files and their content into English. Triggered when localization, translation, or converting Chinese documents to English is requested.
Guides using eRPC (electron-tRPC) for inter-process communication (IPC) between Electron main and renderer processes. Triggered when handling Electron IPC or tRPC-based systems.
| name | chrome-cdp |
| description | Interacts with local browser via Chrome DevTools Protocol (only triggered after user explicitly requests to inspect, debug, or interact with pages open in Chrome) |
Lightweight Chrome DevTools Protocol CLI. Direct connection via WebSocket, no Puppeteer required, supports 100+ tabs, instant connection.
chrome://inspect/#remote-debugging and turn on the switchDevToolsActivePort is in a non-standard location, set CDP_PORT_FILE to its full pathAll commands use scripts/cdp.mjs. <target> is the unique targetId prefix from list output; copy the full prefix shown (e.g., 6BE827FA). CLI rejects ambiguous prefixes.
scripts/cdp.mjs list
scripts/cdp.mjs shot <target> [file] # Default: screenshot-<target>.png in runtime directory
Only captures the viewport. If content outside the viewport is needed, use eval to scroll first. Output includes page DPR and coordinate transformation hints (see Coordinates section below).
scripts/cdp.mjs snap <target>
scripts/cdp.mjs eval <target> <expr>
Note: Avoid using index-based selections (
querySelectorAll(...)[i]) across multipleevalcalls, as DOM may change between calls (e.g., after ignoring clicks, indices shift). Collect all data in oneevalor use stable selectors.
scripts/cdp.mjs html <target> [selector] # Full page or element HTML
scripts/cdp.mjs nav <target> <url> # Navigate and wait for load complete
scripts/cdp.mjs net <target> # Resource timing entries
scripts/cdp.mjs click <target> <selector> # Click element via CSS selector
scripts/cdp.mjs clickxy <target> <x> <y> # Click at CSS pixel coordinates
scripts/cdp.mjs type <target> <text> # Type text at current focus; works in cross-origin iframes
scripts/cdp.mjs loadall <target> <selector> [ms] # Repeatedly click "load more" until it disappears (default 1500ms interval)
scripts/cdp.mjs evalraw <target> <method> [json] # Raw CDP command passthrough
scripts/cdp.mjs open [url] # Open new tab (allows prompt per trigger)
scripts/cdp.mjs stop [target> # Stop daemon
shot saves images at native resolution: image pixels = CSS pixels × DPR. CDP Input events (clickxy etc.) use CSS pixels.
CSS px = Screenshot pixels / DPR
shot prints DPR for the current page. Typical Retina (DPR=2): divide screenshot coordinates by 2.
snap --compact over html for viewing page structure.type (not eval) — first focus with click/clickxy, then type.