Playwright MCP

Last updated Oct 12, 2026 is a Playwright MCP ↗︎ server fork that provides browser automation capabilities using Playwright and Browser Run.

This server enables LLMs to interact with web pages through structured accessibility snapshots, bypassing the need for screenshots or visually-tuned models. Its key features are:

  • Fast and lightweight. Uses Playwright's accessibility tree, not pixel-based input.
  • LLM-friendly. No vision models needed, operates purely on structured data.
  • Deterministic tool application. Avoids ambiguity common with screenshot-based approaches.

Note

The current version of Cloudflare Playwright MCP v1.1.1 ↗︎ is in sync with upstream Playwright MCP v0.0.30 ↗︎.

Quick start

If you are already familiar with Cloudflare Workers and you want to get started with Playwright MCP right away, select this button:

Deploy to Cloudflare

This creates a repository in your GitHub account and deploys the application to Cloudflare Workers. Use this option if you are familiar with Cloudflare Workers, and wish to skip the step-by-step guidance.

Check our GitHub page ↗︎ for more information on how to build and deploy Playwright MCP.

Deploying

Follow these steps to deploy @cloudflare/playwright-mcp:

  1. Install the Playwright MCP npm package ↗︎.

npmyarnpnpmbun

npm i -D @cloudflare/playwright-mcp

yarn add -D @cloudflare/playwright-mcp

pnpm add -D @cloudflare/playwright-mcp

bun add -d @cloudflare/playwright-mcp
  1. Make sure you have the Browser Run and Durable Object bindings and migrations in your Wrangler configuration file.

Note

Your Worker configuration must include the nodejs_compat compatibility flag and a compatibility_date of 2025-09-15 or later.

{
    "$schema": "./node_modules/wrangler/config-schema.json",
    "name": "playwright-mcp-example",
    "main": "src/index.ts",
    "upload_source_maps": true,
    // Set this to today's date
    "compatibility_date": "2026-10-27",
    "compatibility_flags": ["nodejs_compat"],
    "browser": {
        "binding": "BROWSER",
    },
    "migrations": [
        {
            "tag": "v1",
            "new_sqlite_classes": ["PlaywrightMCP"],
        },
    ],
    "durable_objects": {
        "bindings": [
            {
                "name": "MCP_OBJECT",
                "class_name": "PlaywrightMCP",
            },
        ],
    },
}

"$schema" = "./node_modules/wrangler/config-schema.json"
name = "playwright-mcp-example"
main = "src/index.ts"
upload_source_maps = true
# Set this to today's date
compatibility_date = "2026-10-27"
compatibility_flags = [ "nodejs_compat" ]

[browser]
binding = "BROWSER"

[[migrations]]
tag = "v1"
new_sqlite_classes = [ "PlaywrightMCP" ]

[[durable_objects.bindings]]
name = "MCP_OBJECT"
class_name = "PlaywrightMCP"
  1. Edit the code.

src/index.tsts

import { env } from "cloudflare:workers";
import { createMcpAgent } from "@cloudflare/playwright-mcp";

export const PlaywrightMCP = createMcpAgent(env.BROWSER);

export default {
    fetch(request: Request, env: Env, ctx: ExecutionContext) {
        const { pathname } = new URL(request.url);

        switch (pathname) {
            case "/sse":
            case "/sse/message":
                return PlaywrightMCP.serveSSE("/sse").fetch(request, env, ctx);
            case "/mcp":
                return PlaywrightMCP.serve("/mcp").fetch(request, env, ctx);
            default:
                return new Response("Not Found", { status: 404 });
        }
    },
};
  1. Deploy the server.
npx wrangler deploy

The server is now available at https://[my-mcp-url].workers.dev/sse and you can use it with any MCP client.

Using Playwright MCP

Screenshot of the AI Playground

Cloudflare AI Playground ↗︎ is a great way to test MCP servers using LLM models available in Workers AI.

  1. Go to https://playground.ai.cloudflare.com/ ↗︎.
  2. Ensure that the model is set to llama-3.3-70b-instruct-fp8-fast.
  3. In MCP Servers, set URL to https://[my-mcp-url].workers.dev/sse.
  4. Click Connect.
  5. Status should update to Connected and it should list 23 available tools.

You can now start to interact with the model, and it will run necessary the tools to accomplish what was requested.

Note

For best results, give simple instructions consisting of one single action. For example, "Create a new todo entry", "Go to cloudflare site", "Take a screenshot".

Try this sequence of instructions to see Playwright MCP in action:

  1. "Go to demo.playwright.dev/todomvc"
  2. "Create some todo entry"
  3. "Nice. Now create a todo in parrot style"
  4. "And create another todo in Yoda style"
  5. "Take a screenshot"

You can also use other MCP clients like Claude Desktop ↗︎.

Check our GitHub page ↗︎ for more examples and MCP client configuration options, and refer to the developer documentation on how to build Agents on Cloudflare.

Was this helpful?

YesNo

On this page

Playwright MCP - 图3Docs

{"@context":"https://schema.org","@type":"TechArticle","@id":"https://developers.cloudflare.com/browser-run/playwright/playwright-mcp/#page","headline":"Playwright MCP","description":"Deploy a Playwright MCP server that uses Browser Run to provide browser automation capabilities to your agents.","url":"https://developers.cloudflare.com/browser-run/playwright/playwright-mcp/","inLanguage":"en","image":"https://developers.cloudflare.com/browser-run/playwright/playwright-mcp/og.png?v=1c6fd5f2e7e52a18","dateModified":"2026-10-12","publisher":{"@type":"Organization","name":"Cloudflare","description":"One platform for your apps, agents, and workforce. Build, secure, and scale without managing infrastructure","url":"https://www.cloudflare.com/","sameAs":["https://github.com/cloudflare","https://www.linkedin.com/company/cloudflare","https://x.com/cloudflare"],"logo":{"@type":"ImageObject","url":"https://developers.cloudflare.com/logo.svg"},"address":{"@type":"PostalAddress","streetAddress":"101 Townsend St","addressLocality":"San Francisco","addressRegion":"CA","postalCode":"94107","addressCountry":"US"},"contactPoint":[{"@type":"ContactPoint","contactType":"Customer Support","url":"https://support.cloudflare.com/","availableLanguage":["English"]},{"@type":"ContactPoint","contactType":"Sales","url":"https://www.cloudflare.com/contact/","availableLanguage":["English"]}]},"isPartOf":{"@type":"WebSite","@id":"https://developers.cloudflare.com/#website","name":"Cloudflare Docs","url":"https://developers.cloudflare.com/"},"keywords":["MCP"]}

description: Learn how to use Puppeteer with Cloudflare Workers for browser automation. Access Puppeteer API, manage sessions, and optimize Browser Run. title: Puppeteer image: https://developers.cloudflare.com/browser-run/puppeteer/og.png?v=f7742f9cfe173f38

Skip to content

Documentation Index
Fetch the complete documentation index at: https://developers.cloudflare.com/browser-run/llms.txt
Use this file to discover all available pages before exploring further.