Chrome Browser Control

🚀 Chrome MCP Server

A Model Context Protocol (MCP) server that provides fine-grained control over Chrome browser instances, implemented via the Chrome DevTools Protocol (CDP).

🚀 Quick Start

Prerequisites

• Bun (recommended) or Node.js (v14 or higher)
• Chrome browser with remote debugging enabled

📦 Installation

Install Bun

1. Install Bun (if not already installed):

# macOS, Linux, or WSL
curl -fsSL https://bun.sh/install | bash

# Windows (using PowerShell)
powershell -c "irm bun.sh/install.ps1 | iex"

# Or use npm
npm install -g bun

2. Start the Chrome browser and enable remote debugging:

# macOS
/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --remote-debugging-port=9222

# Windows
start chrome --remote-debugging-port=9222

# Linux
google-chrome --remote-debugging-port=9222

3. Install dependencies:

bun install

4. Start the server:

bun start

For development with hot reloading:

bun dev

The server will start on port 3000 by default. You can change the port by setting the PORT environment variable.

Configure Roo Code to Use This MCP Server

To use this Chrome MCP server in Roo Code:

1. Open Roo Code settings.
2. Navigate to the location of the MCP settings configuration file:
   • macOS: ~/Library/Application Support/Code/User/globalStorage/rooveterinaryinc.roo-cline/settings/cline_mcp_settings.json
   • Windows: %APPDATA%\Code\User\globalStorage\rooveterinaryinc.roo-cline\settings\cline_mcp_settings.json
   • Linux: ~/.config/Code/User/globalStorage/rooveterinaryinc.roo-cline/settings/cline_mcp_settings.json
3. Add the following configuration to the mcpServers object:

{
  "mcpServers": {
    "chrome-control": {
      "url": "http://localhost:3000/sse",
      "disabled": false,
      "alwaysAllow": []
    }
  }
}

4. Save the file and restart Roo Code to apply the changes.
5. You can now use the Chrome MCP tools in Roo Code to control the browser.

✨ Features

The server provides the following tools for browser control:

navigate

Navigate to a specific URL.

• Parameters:
  • url (string): The URL to navigate to.

click

Click at the specified coordinates.

• Parameters:
  • x (number): The X-axis coordinate.
  • y (number): The Y-axis coordinate.

type

Type text into the currently focused input.

• Parameters:
  • text (string): The text to type.

clickElement

Click an element in the page information by its index.

• Parameters:
  • selector (string): The element index (e.g., "0" for the first element).

getText

Get the text content of an element using a CSS selector.

• Parameters:
  • selector (string): The CSS selector used to find the element.

getPageInfo

Get the semantic information of the page, including interactive elements and text nodes.

getPageState

Get the current page state, including the URL, title, and whether it has finished loading.

🔧 Technical Details

To start the development mode using Bun:

bun dev

This command enables the hot reloading feature, allowing you to update the code in real-time during development.