← Back to Skills Marketplace
qinthqod

Fox Chrome Devtools Mcp

by GarfieldQin · GitHub ↗ · v1.0.0 · MIT-0
cross-platform ⚠ suspicious
97
Downloads
0
Stars
2
Active Installs
1
Versions
Install in OpenClaw
/install fox-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...
README (SKILL.md)

🌐 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

  1. navigate_page → URL
  2. take_snapshot → get element UIDs
  3. click/fill → interact with elements
  4. take_screenshot → capture result

Performance audit

  1. navigate_page → URL
  2. performance_start_trace
  3. Interact with page
  4. performance_stop_trace
  5. performance_analyze_insight

Form testing

  1. navigate_page → form URL
  2. take_snapshot → identify form fields
  3. fill_form → fill all fields at once
  4. click → submit button
  5. take_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
Usage Guidance
This skill appears to be what it claims: an integration for controlling Chrome via the chrome-devtools-mcp npm package. Before installing, consider: (1) npx -y chrome-devtools-mcp@latest will fetch and run code from the npm registry — pin a specific, audited version instead of relying on 'latest' to reduce supply-chain risk; (2) run the MCP server in a sandboxed environment (container/VM) if you'll be browsing untrusted sites or handling sensitive data, since browser sessions can expose form data and credentials; (3) disable telemetry/performance CrUX flags as shown if you don't want traces or usage stats sent externally; and (4) review your openclaw.json after adding the MCP entry. No unexplained credential or file access was found in the provided files.
Capability Analysis
Type: OpenClaw Skill Name: fox-chrome-devtools-mcp Version: 1.0.0 The skill bundle provides browser automation via the official Google Chrome DevTools MCP server. It is classified as suspicious due to risky implementation patterns in 'scripts/setup_chrome_mcp.py', specifically the use of 'subprocess.run(shell=True)' and the practice of fetching the latest version of an external package ('chrome-devtools-mcp@latest') via 'npx' without version pinning. These represent shell injection and supply chain risks, although they appear to be unintentional vulnerabilities rather than intentional malware. The tool also grants the agent high-privilege browser control, including arbitrary JavaScript execution ('evaluate_script'), which is aligned with its stated purpose but remains a high-risk capability.
Capability Assessment
✓ Purpose & Capability
Name/description (MCP control of Chrome) match the instructions and included script: Node/npm usage, optional Chrome/Chromium, and an OpenClaw MCP server config. No unrelated credentials, binaries, or config paths are requested.
✓ Instruction Scope
SKILL.md only instructs installing/running the chrome-devtools-mcp npm package via npx and adding an MCP entry to openclaw.json. The supplied Python script performs expected checks (node, npx, Chrome paths, openclaw.json) and offers a test start; it does not read or transmit unrelated secrets or contact unknown endpoints beyond npm/npx/Chrome (expected for this tool).
ℹ Install Mechanism
There is no formal install spec in the package; instructions use npx -y chrome-devtools-mcp@latest which will fetch and execute code from the npm registry at runtime. That is expected for this kind of integration but represents the usual supply-chain risk of running code fetched from npm and of using the unpinned "latest" tag.
✓ Credentials
The skill declares no required environment variables, no credentials, and checks only reasonable local paths (Chrome and a Playwright cache path). It does read ~/.openclaw/openclaw.json to look for existing config, which is relevant to its purpose.
✓ Persistence & Privilege
The skill does not request always:true, does not modify other skills, and only suggests adding an MCP server entry to the agent config (it prints the config but does not write to global settings). Autonomous invocation is allowed (platform default) but is not combined with other high-risk factors here.
How to Use
  1. Make sure OpenClaw is installed (local or Docker)
  2. Run the install command in chat: /install fox-chrome-devtools-mcp
  3. After installation, invoke the skill by name or use /fox-chrome-devtools-mcp
  4. Provide required inputs per the skill's parameter spec and get structured output
Version History
v1.0.0
Initial release of Chrome DevTools MCP integration for browser automation and testing. - Control Chrome via Puppeteer using the MCP protocol for input, navigation, debugging, network, and performance tasks. - Includes 25+ tools for clicking, form filling, navigation, screenshot, performance tracing, network inspection, console debugging, and device emulation. - Supports Node.js v20.19+ and Chrome/Chromium. - Integration instructions for OpenClaw and standalone setup provided. - Usage statistics and CrUX reporting are enabled by default but can be disabled for privacy.
Metadata
Slug fox-chrome-devtools-mcp
Version 1.0.0
License MIT-0
All-time Installs 2
Active Installs 2
Total Versions 1
Frequently Asked Questions

What is Fox 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... It is an AI Agent Skill for Claude Code / OpenClaw, with 97 downloads so far.

How do I install Fox Chrome Devtools Mcp?

Run "/install fox-chrome-devtools-mcp" in the OpenClaw or Claude Code chat to install it in one step — no extra setup required.

Is Fox Chrome Devtools Mcp free?

Yes, Fox Chrome Devtools Mcp is completely free, licensed under MIT-0. You can download, install and use it at no cost.

Which platforms does Fox Chrome Devtools Mcp support?

Fox Chrome Devtools Mcp is cross-platform and runs anywhere OpenClaw / Claude Code is available (cross-platform).

Who created Fox Chrome Devtools Mcp?

It is built and maintained by GarfieldQin (@qinthqod); the current version is v1.0.0.

More Skills
self-improving agent
Captures learnings, errors, and corrections to enable continuous improvement. Use when: (1) A command or operation fails unexpectedly, (2) User corrects Clau...
⬇ 463283 · by pskoett
Skill Vetter
Security-first skill vetting for AI agents. Use before installing any skill from ClawdHub, GitHub, or other sources. Checks for red flags, permission scope, and suspicious patterns.
⬇ 259410 · by spclaudehome
Polymarket
Query Polymarket prediction markets. Check odds, find trending markets, search events, track price movements.
⬇ 232503 · by joelchance
Self-Improving + Proactive Agent
Self-reflection + Self-criticism + Self-learning + Self-organizing memory. Agent evaluates its own work, catches mistakes, and improves permanently. Use when...
⬇ 200423 · by ivangdavila
Github
Interact with GitHub using the `gh` CLI. Use `gh issue`, `gh pr`, `gh run`, and `gh api` for issues, PRs, CI runs, and advanced queries.
⬇ 191115 · by steipete
ontology
Typed knowledge graph for structured agent memory and composable skills. Use when creating/querying entities (Person, Project, Task, Event, Document), linkin...
⬇ 190156 · by oswalpalash

💬 Comments