Playwright MCP Server

README.md

Heroku MCP Server - Playwright Web Browser

A Model Context Protocol (MCP) server that provides browser automation capabilities using Playwright. This server enables AI models to interact with web pages through structured accessibility snapshots, bypassing the need for screenshots or visually-tuned models.

This implementation is fully compatible with Heroku Inference and can be used as a web browsing tool for your AI models.

Key Features

• 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.

Requirements

• Node.js 18 or newer
• VS Code, Cursor, Windsurf, Claude Desktop, Goose or any other MCP client

Heroku Deployment

Option 1: One-Click Deploy (Recommended)

Click the "Deploy to Heroku" button at the top of this page to create a new Heroku app with this server pre-configured.

Option 2: Manual Deployment

# Clone this repository
git clone https://github.com/dsouza-anush/playwright-mcp-heroku.git
cd playwright-mcp-heroku

# Create a Heroku app
heroku create your-app-name

# Deploy to Heroku
git push heroku main

Once deployed, your Playwright MCP server will be available at:

• Streamable HTTP endpoint: https://your-app-name.herokuapp.com/mcp
• SSE endpoint: https://your-app-name.herokuapp.com/sse

Using your Heroku-deployed server with MCP clients

Add the following to your MCP client configuration:

{
  "mcpServers": {
    "playwright": {
      "url": "https://your-app-name.herokuapp.com/mcp"
    }
  }
}

For Claude Code CLI:

claude mcp add playwright --url https://your-app-name.herokuapp.com/mcp

For more details, see README-HEROKU.md.

Getting started with Local Setup

First, install the Playwright MCP server with your client.

Standard config works in most of the tools:

{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": [
        "@playwright/mcp@latest"
      ]
    }
  }
}

Claude Code

Use the Claude Code CLI to add the Playwright MCP server: ```bash claude mcp add playwright npx @playwright/mcp@latest ```

Claude Desktop

Follow the MCP install guide, use the standard config above.

Cursor

#### Click the button to install:  #### Or install manually: Go to `Cursor Settings` -> `MCP` -> `Add new MCP Server`. Name to your liking, use `command` type with the command `npx @playwright/mcp`. You can also verify config or add command like arguments via clicking `Edit`.

Gemini CLI

Follow the MCP install guide, use the standard config above.

Goose

#### Click the button to install:  #### Or install manually: Go to `Advanced settings` -> `Extensions` -> `Add custom extension`. Name to your liking, use type `STDIO`, and set the `command` to `npx @playwright/mcp`. Click "Add Extension".

<summa...