Cloudflare Playwright

You deploy and run a Model Control Protocol (MCP) server that lets AI assistants control a browser through Playwright. This setup enables web automation tasks such as navigation, typing, clicking, and taking screenshots by exposing a remote MCP endpoint that clients can connect to and issue browser actions against.

How to use

To use this MCP server, connect your MCP client (such as an AI platform or editor plugin) to the server’s HTTP endpoint and start issuing browser actions. Common tasks include navigating to web pages, interacting with page elements (clicks and typing), and capturing screenshots. The system exposes a set of tools that the assistant can invoke to perform these actions. Start with simple one-action prompts to build confidence, then combine actions as needed to achieve your automation goals.

How to install

Prerequisites: Node.js and npm must be available on your system.

Install dependencies for the project and prepare for deployment.

Deploy the MCP server to Cloudflare Workers.

Additional configuration and usage notes

Use the server with Cloudflare AI Playground or Claude Desktop by connecting to the public MCP URL. The standard MCP URL format for this server is a SSE endpoint that you expose after deployment.

Configure in Claude Desktop

{
  "mcpServers": {
    "cloudflare-playwright-mcp": {
      "command": "npx",
      "args": [
        "mcp-remote",
        "https://[my-mcp-url].workers.dev/sse"
      ]
    }
  }
}

Configure in VS Code

Install the Playwright MCP server integration in VS Code to connect your editor workflows to the MCP server.

# For VS Code
code --add-mcp '{"name":"cloudflare-playwright","type":"sse","url":"https://[my-mcp-url].workers.dev/sse"}'

# For VS Code Insiders
code-insiders --add-mcp '{"name":"cloudflare-playwright","type":"sse","url":"https://[my-mcp-url].workers.dev/sse"}'