Browser Tools

Connects to Chrome via DevTools Protocol for programmatic browser automation. You get tools to navigate, evaluate JavaScript, take screenshots, and extract page content as markdown. The browser-pick tool is interesting for letting users click elements directly when you need selectors. The efficiency guide pushes you toward DOM inspection over screenshots and batching interactions in single eval calls, which is the right instinct. Use this when you're testing frontends, dealing with JavaScript-heavy pages, or need to preserve login state by copying the user's browser profile. It's real browser automation, not headless scraping, so you see what actually renders.

skills.sh installs: 475
GitHub stars: 2.7K
last updated: Aug 21, 2026

View on GitHub

Install

$ npx -y skills add badlogic/pi-skills --skill browser-tools --agent claude-code

Installs into .claude/skills of the current project.

Files

Browser Tools

Chrome DevTools Protocol tools for agent-assisted web automation. These tools connect to Chrome running on :9222 with remote debugging enabled.

Setup

Run once before first use:

cd {baseDir}/browser-tools
npm install

Start Chrome

{baseDir}/browser-start.js              # Fresh profile
{baseDir}/browser-start.js --profile    # Copy user's profile (cookies, logins)

Launch Chrome with remote debugging on :9222. Use --profile to preserve user's authentication state.

Navigate

{baseDir}/browser-nav.js https://example.com
{baseDir}/browser-nav.js https://example.com --new

Navigate to URLs. Use --new flag to open in a new tab instead of reusing current tab.

Evaluate JavaScript

{baseDir}/browser-eval.js 'document.title'
{baseDir}/browser-eval.js 'document.querySelectorAll("a").length'

Execute JavaScript in the active tab. Code runs in async context. Use this to extract data, inspect page state, or perform DOM operations programmatically.