Agent skill
browser-tools
Use the browser-tools CLI (Chrome DevTools Protocol via puppeteer-core) to drive Chrome for navigation, eval, screenshots, DOM picking, console logs, cookies, search, and tab inspection.
Install this agent skill to your Project
npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/other/other/browser-tools
SKILL.md
Browser Tools
Overview
Use this skill whenever a task needs Chrome automation via DevTools (navigate, evaluate JS, screenshots, DOM picking, console logs, cookies, search/content extraction, or listing/terminating DevTools-enabled Chrome).
Quick start
- Launch Chrome with DevTools enabled (use the repo's package manager to run
tsx):pnpm tsx skills/browser-tools/scripts/browser-tools.ts start --profile
- Navigate:
pnpm tsx skills/browser-tools/scripts/browser-tools.ts nav https://example.com
- Screenshot:
pnpm tsx skills/browser-tools/scripts/browser-tools.ts screenshot
Common commands
startLaunch Chrome with--remote-debugging-portand optional profile copy.nav <url>Navigate current tab (or--new).eval <code...>Run JS in page context (supports async).screenshotCapture viewport to a temp PNG path.pick <message...>Interactive DOM element picker.consoleStream console logs (filters, follow mode).cookiesDump cookies as JSON.search <query...>Google search in Chrome; optional readable content.content <url>Readability extraction to markdown-like text.inspectList DevTools-enabled Chrome processes + tabs.killTerminate DevTools-enabled Chrome processes.
Notes
- Script path:
skills/browser-tools/scripts/browser-tools.ts(copied from steipete/agent-scripts). - Dependencies:
puppeteer-core,commander,tsx(or Bun). If missing, install in the active repo or run the copy from~/Projects/oss/agent-scripts. - The tool connects to Chrome via
http://localhost:<port>and supports DevTools ports and pipes for inspect/kill.
Resources
scripts/
browser-tools.ts(CLI)
Recommended Agent Skills
Expand your agent's capabilities with these related and highly-rated skills.
agent-ops-spec
Manage specification documents in .agent/specs/. Use when user provides requirements, acceptance criteria, or feature descriptions that need to be tracked and validated against implementation.
agent-ops-state
Maintain .agent state files. Use at session start, after meaningful steps, and before concluding: read/update constitution/memory/focus/issues/baseline consistently.
agent-ops-spec
Manage specification documents in .agent/specs/. Use when user provides requirements, acceptance criteria, or feature descriptions that need to be tracked and validated against implementation.
agent-ops-testing
Test strategy, execution, and coverage analysis. Use when designing tests, running test suites, or analyzing test results beyond baseline checks.
agent-ops-testing
Test strategy, execution, and coverage analysis. Use when designing tests, running test suites, or analyzing test results beyond baseline checks.
agent-ops-state
Maintain .agent state files. Use at session start, after meaningful steps, and before concluding: read/update constitution/memory/focus/issues/baseline consistently.
Didn't find tool you were looking for?