Provides direct CDP access for navigation, DOM queries, screenshots, and network control in browser sessions.
Install
mkdir -p .claude/skills/bdg && curl -L -o skill.zip "https://agentskills.codes/api/skills/download/13173" && unzip -o skill.zip -d .claude/skills/bdg && rm skill.zipInstalls to .claude/skills/bdg
Activation
This is the description your AI agent reads to decide when to run this skill — the better it matches your request, the more reliably it fires.
Use bdg CLI for browser automation via Chrome DevTools Protocol. Provides direct CDP access (60+ domains, 300+ methods) for DOM queries, navigation, screenshots, network control, and JavaScript execution. Use this skill when you need to automate browsers, scrape dynamic content, or interact with web pages programmatically.Key capabilities
- →Start and stop browser sessions
- →Take full-page, viewport, or element screenshots
- →Fill forms and interact with DOM elements
- →Inspect DOM elements and execute JavaScript
- →Access Chrome DevTools Protocol directly
- →Manage session cleanup and troubleshooting
How it works
The skill uses the `bdg` CLI to automate browser interactions via the Chrome DevTools Protocol, allowing for session management, DOM manipulation, screenshots, and direct CDP command execution.
Inputs & outputs
When to use bdg
- →Scrape dynamic content
- →Take full-page screenshots
- →Automate browser interaction
- →Network traffic inspection
About this skill
bdg - Browser Automation CLI
Quick Start
bdg https://example.com # Start session (launches Chrome)
bdg dom screenshot /tmp/page.png # Take screenshot
bdg stop # End session
Session Management
bdg <url> # Start session (1920x1080, headless if no display)
bdg <url> --headless # Force headless mode
bdg <url> --no-headless # Force visible browser window
bdg status # Check session status
bdg peek # Preview collected telemetry
bdg stop # End session (use sparingly)
bdg cleanup --force # Kill stale session
bdg cleanup --aggressive # Kill all Chrome processes
Sessions run indefinitely by default (no timeout). With HMR/hot-reload dev servers, keep the session running:
bdg http://localhost:5173 # Start once
# ... make code changes, HMR updates the page ...
bdg dom screenshot /tmp/s.png # Check anytime
bdg peek # Preview collected data
# No need to stop/restart - Chrome stays on the page
Don't stop sessions prematurely - use bdg peek to inspect data. Only call bdg stop when completely done with browser automation.
Screenshots
Always use bdg dom screenshot (raw CDP is blocked):
bdg dom screenshot /tmp/page.png # Full page
bdg dom screenshot /tmp/viewport.png --no-full-page # Viewport only
bdg dom screenshot /tmp/el.png --selector "#main" # Element only
bdg dom screenshot /tmp/scroll.png --scroll "#target" # Scroll to element first
Form Interaction
# Discover forms
bdg dom form --brief # Quick scan: field names, types, required
# Fill and interact
bdg dom fill "input[name='user']" "myuser" # Fill by selector
bdg dom fill 0 "value" # Fill by index (from query)
bdg dom click "button.submit" # Click element
bdg dom submit "form" --wait-navigation # Submit and wait for page load
bdg dom pressKey "input" Enter # Press Enter key
# Options
--no-wait # Skip network stability wait
--wait-navigation # Wait for page navigation (traditional forms)
--wait-network <ms> # Wait for network idle (SPA forms)
--index <n> # Select nth element when multiple match
DOM Inspection
bdg dom query "selector" # Find elements, returns [0], [1], [2]...
bdg dom get "selector" # Get semantic a11y info (token-efficient)
bdg dom get "selector" --raw # Get full HTML
bdg dom eval "js expression" # Run JavaScript
CDP Access
Direct access to Chrome DevTools Protocol:
# Execute any CDP method
bdg cdp Runtime.evaluate --params '{"expression": "document.title", "returnByValue": true}'
bdg cdp Page.navigate --params '{"url": "https://example.com"}'
bdg cdp Page.reload --params '{"ignoreCache": true}'
# Discovery
bdg cdp --list # List all 53 domains
bdg cdp Network --list # List methods in domain
bdg cdp Network.getCookies --describe # Show method schema
bdg cdp --search cookie # Search methods
Important: Always use returnByValue: true for Runtime.evaluate to get serialized values.
Common Patterns
Login Flow
bdg https://example.com/login
bdg dom form --brief
bdg dom fill "input[name='username']" "$USER"
bdg dom fill "input[name='password']" "$PASS"
bdg dom submit "button[type='submit']" --wait-navigation
bdg dom screenshot /tmp/result.png
bdg stop
Wait for Element
for i in {1..20}; do
EXISTS=$(bdg cdp Runtime.evaluate --params '{
"expression": "document.querySelector(\"#target\") !== null",
"returnByValue": true
}' | jq -r '.result.value')
[ "$EXISTS" = "true" ] && break
sleep 0.5
done
Extract Data
bdg cdp Runtime.evaluate --params '{
"expression": "Array.from(document.querySelectorAll(\"a\")).map(a => ({text: a.textContent, href: a.href}))",
"returnByValue": true
}' | jq '.result.value'
Exit Codes
| Code | Meaning | Action |
|---|---|---|
| 0 | Success | - |
| 1 | Blocked command | Read error message, use suggested alternative |
| 81 | Invalid arguments | Check command syntax |
| 83 | Resource not found | Element/session doesn't exist |
| 101 | CDP connection failure | Run bdg cleanup --aggressive and retry |
| 102 | CDP timeout | Increase timeout or check page load |
Troubleshooting
bdg status --verbose # Full diagnostics
bdg cleanup --force # Kill stale session
bdg cleanup --aggressive # Kill all Chrome processes
Chrome won't launch? Run bdg cleanup --aggressive then retry.
Session stuck? Run bdg cleanup --force to reset.
Custom Chrome Flags
Use --chrome-flags or BDG_CHROME_FLAGS for self-signed certificates, CORS, etc.:
# CLI option
bdg https://localhost:5173 --chrome-flags="--ignore-certificate-errors"
# Environment variable
BDG_CHROME_FLAGS="--ignore-certificate-errors" bdg https://localhost:5173
# Multiple flags
bdg https://example.com --chrome-flags="--ignore-certificate-errors --disable-web-security"
Common flags for development:
--ignore-certificate-errors- Self-signed SSL certs--disable-web-security- CORS issues in development--allow-insecure-localhost- Insecure localhost--disable-features=IsolateOrigins,site-per-process- Cross-origin iframes
Verification Best Practices
Prefer DOM queries over screenshots for verification:
# GOOD: Fast, precise, scriptable
bdg cdp Runtime.evaluate --params '{
"expression": "document.querySelector(\".error-message\")?.textContent",
"returnByValue": true
}'
# GOOD: Check element exists
bdg dom query ".submit-btn"
# GOOD: Check text content
bdg cdp Runtime.evaluate --params '{
"expression": "document.body.innerText.includes(\"Success\")",
"returnByValue": true
}'
# AVOID: Screenshots for simple verification (slow, requires visual inspection)
bdg dom screenshot /tmp/check.png # Only use when you need visual proof
When to use screenshots:
- Visual regression testing
- Capturing proof for user review
- Debugging layout issues
- When DOM structure is unknown
When to use DOM queries:
- Verifying text content appeared
- Checking element exists/visible
- Validating form state
- Counting elements
- Any programmatic assertion
When NOT to Use bdg
- Static HTML - Use
curl+htmlq/pq - API calls - Use
curl+jq - Simple HTTP - Use
wget/curl
Use bdg when you need: JavaScript execution, dynamic content, browser APIs, screenshots, or network manipulation.
When not to use it
- →When scraping static HTML content
- →When making simple API calls
- →When performing basic HTTP requests
Limitations
- →Not suitable for static HTML scraping
- →Not suitable for simple API calls
- →Not suitable for basic HTTP requests
How it compares
This skill provides a command-line interface for direct, programmatic control over a Chrome browser using CDP, enabling automation of dynamic web content and interactions that are not possible with simple HTTP requests or static HTML parser
Compared to similar skills
bdg side by side with the closest alternatives in the catalog.
| Skill | Installs | Updated | Safety | Difficulty |
|---|---|---|---|---|
| bdg (this skill) | 0 | 4mo | Review | Intermediate |
| playwright-mcp | 33 | 6mo | No flags | Intermediate |
| dev-browser | 53 | 4mo | Review | Intermediate |
| chrome-devtools | 41 | 7mo | Review | Intermediate |
Try saying
Example prompts that trigger this skill in your AI assistant.
You might also like
playwright-mcp
sfc-gh-dflippo
Browser testing, web scraping, and UI validation using Playwright MCP. Use this skill when you need to test Streamlit apps, validate web interfaces, test responsive design, check accessibility, or automate browser interactions through MCP tools.
dev-browser
SawyerHood
Browser automation with persistent page state. Use when users ask to navigate websites, fill forms, take screenshots, extract web data, test web apps, or automate browser workflows. Trigger phrases include "go to [url]", "click on", "fill out the form", "take a screenshot", "scrape", "automate", "test the website", "log into", or any browser interaction request.
chrome-devtools
mrgoonie
Browser automation, debugging, and performance analysis using Puppeteer CLI scripts. Use for automating browsers, taking screenshots, analyzing performance, monitoring network traffic, web scraping, form automation, and JavaScript debugging.
agent-browser
vercel-labs
Browser automation CLI for AI agents. Use when the user needs to interact with websites, including navigating pages, filling forms, clicking buttons, taking screenshots, extracting data, testing web apps, or automating any browser task. Triggers include requests to "open a website", "fill out a form", "click a button", "take a screenshot", "scrape data from a page", "test this web app", "login to a site", "automate browser actions", or any task requiring programmatic web interaction.
browser-tools
Whamp
Lightweight Chrome automation toolkit with shared configuration, JSON-first output, and six focused scripts for starting, navigating, inspecting, capturing, evaluating, and cleaning up browser sessions.
browser
cexll
This skill should be used for browser automation tasks using Chrome DevTools Protocol (CDP). Triggers when users need to launch Chrome with remote debugging, navigate pages, execute JavaScript in browser context, capture screenshots, or interactively select DOM elements. No MCP server required.