Chrome Debug MCP Server

local-only server

The server can only run on the client’s local machine because it depends on local resources.

Integrations

  • Uses Puppeteer for Chrome automation, allowing page interaction, tab management, and browser control

Chrome Debug MCP Playwright

A Model Context Protocol (MCP) implementation for browser automation using Playwright, with full Greasemonkey API support.

Features

Core Browser Features

  • Browser launch and management
  • Multi-tab support with create/switch/close capabilities
  • Page navigation and interaction
  • Screenshot capture

Greasemonkey API Support

  • GM_addStyle for CSS injection
  • GM_getValue/GM_setValue for data storage
  • GM_deleteValue for storage cleanup
  • GM_notification for desktop notifications
  • GM_setClipboard for clipboard operations
  • GM_xmlhttpRequest for cross-origin requests

Resource Management

  • Network request interception
  • Request blocking, modification, and logging
  • Resource type filtering

Debug Features

  • Detailed logging system
  • Log file organization
  • Clean interface output

Installation

npm install chrome-debug-mcp-playwright

Quick Start

// Launch browser tool browser launch_browser --url "https://example.com" --browserType "chromium" // Use GM functions tool browser gm_setValue --key "setting" --value "test" tool browser gm_getValue --key "setting" // Intercept requests tool browser intercept_requests --patterns ["*.jpg", "*.css"] --action "block"

Documentation

  • Commands - Detailed command documentation with examples
  • Full command list with usage examples available in COMMANDS.md

Core Features

Browser Management

// Launch browser tool browser launch_browser --url "https://example.com" // Create new tab tool browser create_tab --url "https://example.com" // Switch between tabs tool browser switch_tab --index 1

Greasemonkey API

// Add custom styles tool browser gm_addStyle --css "body { background: #f0f0f0; }" // Store data tool browser gm_setValue --key "setting" --value "test" // Make cross-origin requests tool browser gm_xmlhttpRequest --url "https://api.example.com/data" --method "GET"

Resource Interception

// Block image loading tool browser intercept_requests --patterns ["*.jpg", "*.png"] --action "block" // Log all CSS requests tool browser intercept_requests --patterns ["*.css"] --action "log"

Implementation Details

Logging System

  • All debug output redirected to log files
  • Timestamped entries
  • Organized in logs directory
  • Clean interface output

Error Handling

  • Detailed error logging
  • Proper cleanup on errors
  • Resource management

Dependencies

  • Playwright: Browser automation
  • @modelcontextprotocol/sdk: MCP implementation

Development

Prerequisites

  • Node.js 16 or higher
  • npm 7 or higher

Setup

git clone https://github.com/yourusername/chrome-debug-mcp-playwright.git cd chrome-debug-mcp-playwright npm install

License

MIT License - See LICENSE file for details.

Contributing

We welcome contributions! Please see our Contributing Guide for details.

Acknowledgments

Based on the original chrome-debug-mcp by Robert Headley.

=======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload)

Chrome Debug MCP Server

A Model Context Protocol (MCP) server for controlling Chrome with debugging capabilities, userscript injection, and extension support.

<<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD

=======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload)

<<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload)

Features

Chrome Control

  • Launch Chrome with custom configurations
  • Support for custom Chrome executable paths
  • User profile management (default or custom user data directory)
  • Extension support and management
  • Disable Chrome's "Automation Controlled" banner

<<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD

=======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload)

Page Automation

  • Click, type, and interact with page elements
  • Handle dropdowns and form inputs
  • Hover and wait for elements
  • Take screenshots of full page or elements
  • Navigate between pages
  • Set viewport size and device emulation
  • Extract text and attributes from elements

Tab Management

  • List all open tabs with their IDs and URLs
  • Open new tabs with specified URLs
  • Close tabs by ID
  • Switch between tabs
  • Track and manage multiple tab states

<<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload)

Debugging Capabilities

  • Remote debugging via Chrome DevTools Protocol (CDP)
  • Console log capture and monitoring
  • JavaScript evaluation in page context
  • Real-time console output streaming

Userscript Support

  • Inject userscripts into web pages
  • Greasemonkey-style API support:
    • GM_setValue/GM_getValue for persistent storage
    • GM_addStyle for CSS injection
    • GM_xmlhttpRequest for cross-origin requests
    • GM_openInTab for new tab creation
    • GM_registerMenuCommand for menu commands

Extension Integration

  • Load unpacked extensions
  • Maintain extension states and configurations
  • Support for default Chrome profile extensions
  • Selective extension enabling/disabling

Installation

Prerequisites

Installing Roo Code Extension

  1. Open Visual Studio Code
  2. Go to Extensions (Ctrl+Shift+X)
  3. Search for "Roo Code"
  4. Click Install

Setting up Chrome Debug MCP Server

  1. Clone this repository:
    git clone https://github.com/yourusername/chrome-debug-mcp.git cd chrome-debug-mcp
  2. Install dependencies:
    npm install
  3. Build the project:
    npm run build
  4. Configure in Roo Code: Add to cline_mcp_settings.json:
    { "mcpServers": { "chrome-debug": { "command": "node", "args": ["path/to/chrome-debug-mcp/build/index.js"], "disabled": false, "alwaysAllow": [] } } }

Usage

<<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD

For a complete reference of all available commands, tools, and functions, see COMMANDS.md.

parent of 64acbb3 (Add files via upload) ======= For a complete reference of all available commands, tools, and functions, see COMMANDS.md.

parent of 64acbb3 (Add files via upload) ======= For a complete reference of all available commands, tools, and functions, see COMMANDS.md.

parent of 64acbb3 (Add files via upload) ======= For a complete reference of all available commands, tools, and functions, see COMMANDS.md.

parent of 64acbb3 (Add files via upload) ======= For a complete reference of all available commands, tools, and functions, see COMMANDS.md.

parent of 64acbb3 (Add files via upload) ======= For a complete reference of all available commands, tools, and functions, see COMMANDS.md.

parent of 64acbb3 (Add files via upload) ======= For a complete reference of all available commands, tools, and functions, see COMMANDS.md.

parent of 64acbb3 (Add files via upload)

Basic Chrome Launch

use_mcp_tool({ server_name: "chrome-debug", tool_name: "launch_chrome", arguments: { executablePath: "C:\\Program Files\\Google\\Chrome\\Application\\chrome.exe", url: "https://example.com" } })

Launch with Custom Profile

use_mcp_tool({ server_name: "chrome-debug", tool_name: "launch_chrome", arguments: { executablePath: "C:\\Program Files\\Google\\Chrome\\Application\\chrome.exe", userDataDir: "path/to/chrome/profile", disableAutomationControlled: true } })

Inject Userscript

use_mcp_tool({ server_name: "chrome-debug", tool_name: "launch_chrome", arguments: { url: "https://example.com", userscriptPath: "path/to/userscript.js" } })

Evaluate JavaScript

use_mcp_tool({ server_name: "chrome-debug", tool_name: "evaluate", arguments: { expression: "document.title" } })

Get Console Logs

use_mcp_tool({ server_name: "chrome-debug", tool_name: "get_console_logs", arguments: { clear: true } })

<<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD

=======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload)

Page Interaction Examples

Click an Element

use_mcp_tool({ server_name: "chrome-debug", tool_name: "click", arguments: { selector: "#submit-button", delay: 500 } })

Type into Input

use_mcp_tool({ server_name: "chrome-debug", tool_name: "type", arguments: { selector: "#search-input", text: "search query", delay: 100 } })

Select from Dropdown

use_mcp_tool({ server_name: "chrome-debug", tool_name: "select", arguments: { selector: "#country-select", value: "US" } })

Wait for Element

use_mcp_tool({ server_name: "chrome-debug", tool_name: "wait_for_selector", arguments: { selector: ".loading-complete", visible: true, timeout: 5000 } })

Take Screenshot

use_mcp_tool({ server_name: "chrome-debug", tool_name: "screenshot", arguments: { path: "screenshot.png", fullPage: true } })

Set Viewport Size

use_mcp_tool({ server_name: "chrome-debug", tool_name: "set_viewport", arguments: { width: 1920, height: 1080, deviceScaleFactor: 1 } })

Tab Management Examples

List All Tabs

use_mcp_tool({ server_name: "chrome-debug", tool_name: "list_tabs", arguments: {} })

Open New Tab

use_mcp_tool({ server_name: "chrome-debug", tool_name: "new_tab", arguments: { url: "https://example.com" } })

Switch to Tab

use_mcp_tool({ server_name: "chrome-debug", tool_name: "switch_tab", arguments: { tabId: "tab-id-from-list-tabs" } })

Close Tab

use_mcp_tool({ server_name: "chrome-debug", tool_name: "close_tab", arguments: { tabId: "tab-id-from-list-tabs" } })

<<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD <<<<<<< HEAD

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload) =======

parent of 64acbb3 (Add files via upload)

Dependencies

This project uses the following open-source packages:

License

This project is licensed under the MIT License - see the LICENSE file for details.

Contributing

See our Contributing Guide for details on making contributions.

Acknowledgments