🧪 Skills
Chrome Devtools Mcp
Chrome DevTools MCP — Google's official browser automation and testing server. Control Chrome via Puppeteer through MCP protocol: click, fill forms, navigate...
v1.0.0
Description
name: chrome-devtools-mcp description: "Chrome DevTools MCP — Google's official browser automation and testing server. Control Chrome via Puppeteer through MCP protocol: click, fill forms, navigate, screenshot, performance traces, network inspection, console debugging. Use for browser testing, web automation, performance analysis, UI testing, form filling, and visual regression." homepage: https://github.com/ChromeDevTools/chrome-devtools-mcp license: Apache-2.0 compatibility: Node.js v20.19+, Chrome/Chromium metadata: {"openclaw": {"emoji": "🌐", "requires": {"env": []}, "homepage": "https://github.com/ChromeDevTools/chrome-devtools-mcp"}}
🌐 Chrome DevTools MCP
Google's official Chrome DevTools MCP server — gives AI agents full control of a live Chrome browser via Puppeteer and the Chrome DevTools Protocol.
Features
- Input automation — click, drag, fill forms, hover, press keys, upload files, handle dialogs
- Navigation — open/close/switch pages, wait for elements/network idle
- Screenshots & snapshots — capture page state visually and as DOM
- Performance traces — record and analyze Chrome performance traces with insights
- Network inspection — list/inspect network requests and responses
- Console debugging — read console messages with source-mapped stack traces
- Device emulation — emulate mobile devices, resize viewport
- Form automation — fill multiple form fields at once
Requirements
- Node.js v20.19+ (already available in OpenClaw)
- Chrome/Chromium browser
Quick Start
Install & verify
npx -y chrome-devtools-mcp@latest --help
Start the MCP server
# Standard (launches Chrome automatically)
npx -y chrome-devtools-mcp@latest
# Headless mode (for servers)
npx -y chrome-devtools-mcp@latest --headless
# Connect to existing Chrome (must be started with --remote-debugging-port=9222)
npx -y chrome-devtools-mcp@latest --browser-url=http://127.0.0.1:9222
# Disable telemetry
npx -y chrome-devtools-mcp@latest --no-usage-statistics --no-performance-crux
OpenClaw MCP Integration
Add to your openclaw.json under MCP servers:
{
"mcp": {
"servers": {
"chrome-devtools": {
"command": "npx",
"args": ["-y", "chrome-devtools-mcp@latest", "--headless", "--no-usage-statistics"]
}
}
}
}
Or use the setup script:
python3 {baseDir}/scripts/setup_chrome_mcp.py setup
python3 {baseDir}/scripts/setup_chrome_mcp.py status
python3 {baseDir}/scripts/setup_chrome_mcp.py test
Tool Reference
Input Automation (8 tools)
| Tool | Description | Key Params |
|---|---|---|
click |
Click an element | uid (required), dblClick |
drag |
Drag element onto another | from_uid, to_uid |
fill |
Type text into input/textarea/select | uid, value |
fill_form |
Fill multiple form elements at once | elements[] |
handle_dialog |
Accept/dismiss browser dialogs | action (accept/dismiss) |
hover |
Hover over element | uid |
press_key |
Press keyboard key | key |
upload_file |
Upload file to input | uid, paths[] |
Navigation (6 tools)
| Tool | Description | Key Params |
|---|---|---|
navigate_page |
Go to URL | url |
new_page |
Open new tab | url |
close_page |
Close current tab | — |
list_pages |
List all open tabs | — |
select_page |
Switch to tab | index |
wait_for |
Wait for element/network | event, uid, timeout |
Debugging (5 tools)
| Tool | Description |
|---|---|
take_screenshot |
Capture page as image |
take_snapshot |
Get DOM/accessibility snapshot |
evaluate_script |
Run JavaScript in page |
list_console_messages |
Get console log entries |
get_console_message |
Get specific console message |
Performance (3 tools)
| Tool | Description |
|---|---|
performance_start_trace |
Begin performance recording |
performance_stop_trace |
Stop and get trace data |
performance_analyze_insight |
AI analysis of trace |
Network (2 tools)
| Tool | Description |
|---|---|
list_network_requests |
List all network requests |
get_network_request |
Get request/response details |
Emulation (2 tools)
| Tool | Description |
|---|---|
emulate |
Emulate device (mobile, tablet) |
resize_page |
Change viewport size |
Common Workflows
Test a webpage
navigate_page→ URLtake_snapshot→ get element UIDsclick/fill→ interact with elementstake_screenshot→ capture result
Performance audit
navigate_page→ URLperformance_start_trace- Interact with page
performance_stop_traceperformance_analyze_insight
Form testing
navigate_page→ form URLtake_snapshot→ identify form fieldsfill_form→ fill all fields at onceclick→ submit buttontake_screenshot→ verify result
Privacy Notes
- Google collects usage statistics by default — disable with
--no-usage-statistics - Performance tools may send trace URLs to Google CrUX API — disable with
--no-performance-crux - Avoid sharing sensitive data in browser sessions
Reviews (0)
Sign in to write a review.
No reviews yet. Be the first to review!
Comments (0)
No comments yet. Be the first to share your thoughts!