Playwright CDP

by lars-hagen

16 stars

Not rated

GitHub

About

Integrates Playwright and Chrome DevTools Protocol to enable advanced web automation, testing, and analysis through browser control and interaction.

Details

Author: lars-hagen
Repository: lars-hagen/mcp-playwright-cdp
GitHub stars: 16
License: Other
Categories: Productivity, Design, Developer Tools, AI, Infrastructure, Automation
Tags: #web

- 🔗 Connect to existing Chrome instances via CDP
- 🌐 Full browser automation capabilities
- 📸 Screenshot capture of entire pages or specific elements
- 🖱️ Comprehensive web interactions (navigation, clicking, form filling)
- 📊 Console log monitoring
- 🔧 JavaScript execution in browser context
- 🌍 HTTP API testing support

Setting up with Highlight

This MCP is not yet compatible with Highlight’s one-click setup. However, you can still use it with Highlight by following these steps:

Download and install Highlight from highlightai.com/download
Navigate to the plugins tab and select "Add Custom Plugin"
Configure the plugin with the settings below
Plugin Name Playwright CDP

Command (node, npx, python, etc.) node
Arguments
- Argument 1 /path/to/mcp-playwright/dist/index.js
Please refer to the README for specific instructions on how to obtain API keys or other required environment variables.
Enable "Start Automatically" if you want the plugin to start when Highlight launches

Setting up with Cursor

Open Cursor's settings
Navigate to the MCP section
Click "Add new Global MCP server"
Copy and paste the configuration below based on your operating system

JSON

{
    "mcpServers": {
        "playwright cdp": {
            "cwd": "string (optional)",
            "env": {},
            "args": [
                "/path/to/mcp-playwright/dist/index.js"
            ],
            "shell": false,
            "command": "node"
        }
    }
}

JSON

{
    "mcpServers": {
        "playwright cdp": {
            "cwd": "string (optional)",
            "env": {},
            "args": [
                "/path/to/mcp-playwright/dist/index.js"
            ],
            "shell": false,
            "command": "node"
        }
    }
}

JSON

{
    "mcpServers": {
        "playwright cdp": {
            "cwd": "string (optional)",
            "env": {},
            "args": [
                "/path/to/mcp-playwright/dist/index.js"
            ],
            "shell": false,
            "command": "node"
        }
    }
}

Setting up with Claude Desktop

Open Claude Desktop's settings
Go to the Integrations tab
Click "Add MCP Server"
Use the configuration below based on your operating system

Note: Make sure Claude Desktop is running before attempting to connect.

JSON

{
    "mcpServers": {
        "playwright cdp": {
            "cwd": "string (optional)",
            "env": {},
            "args": [
                "/path/to/mcp-playwright/dist/index.js"
            ],
            "shell": false,
            "command": "node"
        }
    }
}

JSON

{
    "mcpServers": {
        "playwright cdp": {
            "cwd": "string (optional)",
            "env": {},
            "args": [
                "/path/to/mcp-playwright/dist/index.js"
            ],
            "shell": false,
            "command": "node"
        }
    }
}

JSON

{
    "mcpServers": {
        "playwright cdp": {
            "cwd": "string (optional)",
            "env": {},
            "args": [
                "/path/to/mcp-playwright/dist/index.js"
            ],
            "shell": false,
            "command": "node"
        }
    }
}

Setting up with Windsurf

Open Windsurf's preferences
Go to the Integrations section
Click "Add MCP Integration"
Use the configuration below based on your operating system

JSON

{
    "mcpServers": {
        "playwright cdp": {
            "cwd": "string (optional)",
            "env": {},
            "args": [
                "/path/to/mcp-playwright/dist/index.js"
            ],
            "shell": false,
            "command": "node"
        }
    }
}

JSON

{
    "mcpServers": {
        "playwright cdp": {
            "cwd": "string (optional)",
            "env": {},
            "args": [
                "/path/to/mcp-playwright/dist/index.js"
            ],
            "shell": false,
            "command": "node"
        }
    }
}

JSON

{
    "mcpServers": {
        "playwright cdp": {
            "cwd": "string (optional)",
            "env": {},
            "args": [
                "/path/to/mcp-playwright/dist/index.js"
            ],
            "shell": false,
            "command": "node"
        }
    }
}

Setting up with Cline

Open Cline's settings
Navigate to the Integrations section
Click "Add MCP Server"
Copy and paste the configuration below based on your operating system

Note: Make sure to restart Cline after adding the configuration.

JSON

{
    "mcpServers": {
        "playwright cdp": {
            "cwd": "string (optional)",
            "env": {},
            "args": [
                "/path/to/mcp-playwright/dist/index.js"
            ],
            "shell": false,
            "command": "node"
        }
    }
}

JSON

{
    "mcpServers": {
        "playwright cdp": {
            "cwd": "string (optional)",
            "env": {},
            "args": [
                "/path/to/mcp-playwright/dist/index.js"
            ],
            "shell": false,
            "command": "node"
        }
    }
}

JSON

{
    "mcpServers": {
        "playwright cdp": {
            "cwd": "string (optional)",
            "env": {},
            "args": [
                "/path/to/mcp-playwright/dist/index.js"
            ],
            "shell": false,
            "command": "node"
        }
    }
}

Setting up with Goose

Open Goose's preferences
Go to the Integrations tab
Select "MCP Servers"
Click "Add New Server"
Use the configuration below based on your operating system

JSON

{
    "mcpServers": {
        "playwright cdp": {
            "cwd": "string (optional)",
            "env": {},
            "args": [
                "/path/to/mcp-playwright/dist/index.js"
            ],
            "shell": false,
            "command": "node"
        }
    }
}

JSON

{
    "mcpServers": {
        "playwright cdp": {
            "cwd": "string (optional)",
            "env": {},
            "args": [
                "/path/to/mcp-playwright/dist/index.js"
            ],
            "shell": false,
            "command": "node"
        }
    }
}

JSON

{
    "mcpServers": {
        "playwright cdp": {
            "cwd": "string (optional)",
            "env": {},
            "args": [
                "/path/to/mcp-playwright/dist/index.js"
            ],
            "shell": false,
            "command": "node"
        }
    }
}

From the repository

Add this to your Claude Desktop configuration file:

{
  "mcpServers": {
    "playwright": {
      "command": "node",
      "args": ["/path/to/mcp-playwright/dist/index.js"]
    }
  }
}

Replace /path/to/mcp-playwright with your actual path to the repository.

To install MCP Playwright CDP for Claude Desktop automatically via Smithery:

npx -y @smithery/cli install @lars-hagen/mcp-playwright-cdp --client claude

Clone the repository, then build it with Node.js 20 or 22:

npm ci

npm run build

Use npm install only when updating dependencies.

Claude Desktop / Cursor

Paste into your MCP client config file to install this server.

{
    "mcpServers": {
        "playwright cdp": {
            "cwd": "string (optional)",
            "env": {},
            "args": [
                "/path/to/mcp-playwright/dist/index.js"
            ],
            "shell": false,
            "command": "node"
        }
    }
}

Linux

{
    "cwd": "string (optional)",
    "env": [],
    "args": [
        "/path/to/mcp-playwright/dist/index.js"
    ],
    "shell": false,
    "command": "node"
}

Macos

{
    "cwd": "string (optional)",
    "env": [],
    "args": [
        "/path/to/mcp-playwright/dist/index.js"
    ],
    "shell": false,
    "command": "node"
}

Windows

{
    "cwd": "string (optional)",
    "env": [],
    "args": [
        "/path/to/mcp-playwright/dist/index.js"
    ],
    "shell": false,
    "command": "node"
}

MCP Playwright CDP

A Model Context Protocol server that provides browser automation capabilities using Playwright with Chrome DevTools Protocol (CDP) support. This server enables LLMs to interact with web pages, take screenshots, and execute JavaScript in a real browser environment, with the ability to connect to existing Chrome instances via CDP.

Maintenance status

This project is in maintenance mode. Focused fixes for security, compatibility, and documentation are welcome. It is not currently published to the npm registry. The latest source release is the v0.2.10 Git tag from February 2025.

> This is a fork of executeautomation/mcp-playwright v0.2.7, enhanced with CDP support for connecting to running Chrome instances.

Key Features

Installation

You can install the package using either npm or Smithery:

Installing via Smithery

To install MCP Playwright CDP for Claude Desktop automatically via Smithery:

npx -y @smithery/cli install @lars-hagen/mcp-playwright-cdp --client claude

Manual Installation

Clone the repository, then build it with Node.js 20 or 22:

npm ci
npm run build

Use npm install only when updating dependencies.

Configuration

Add this to your Claude Desktop configuration file:

{
  "mcpServers": {
    "playwright": {
      "command": "node",
      "args": ["/path/to/mcp-playwright/dist/index.js"]
    }
  }
}

Replace /path/to/mcp-playwright with your actual path to the repository.

CDP Connection

This fork adds the ability to connect to an existing Chrome instance via CDP. To use this feature:

1. Launch Chrome with remote debugging enabled:

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

2. The server will automatically attempt to connect to the running Chrome instance first, before launching a new browser.

Security

The playwright_evaluate tool intentionally executes JavaScript in the current browser page. It is not a sandbox. Use this server only with trusted MCP clients and pages. See SECURITY.md for vulnerability reporting.

Credits

This project is a fork of executeautomation/mcp-playwright, enhanced with CDP support for connecting to running Chrome instances.

License

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

No reviews yet — be the first

Use Google, GitHub, or an email account so ratings stay tied to real people.

Email sign in

No reviews posted yet.

About

Details

Jump to

Setting up with Highlight

From the repository

Claude Desktop / Cursor

Linux

Macos

Windows

MCP Playwright CDP

Maintenance status

Key Features

Installation

Installing via Smithery

Manual Installation

Configuration

CDP Connection

Security

Credits

License

Install

More like this

Time

Sentry

Github

Git

GitLab

Context 7