Playwright MCP Server: Setup Guide for AI Coding Agents (2026)

The Playwright MCP server connects your AI coding agent to browser automation. It lets Claude Code, Codex CLI, and other agents write, run, and debug end-to-end tests by interacting with a real browser through the Model Context Protocol.

This guide covers installation, configuration, and practical use cases for the Playwright MCP server.

Quick Answer: The Playwright MCP server allows AI coding agents like Claude Code or Codex CLI to interact with a real browser for writing, running, and debugging end-to-end tests by bridging the gap between code generation and execution.

What the Playwright MCP Server Does

Normally, AI coding agents can write Playwright test code but can't run it or see the results. The MCP server bridges that gap. When connected, your agent can:

• Launch a browser and navigate to URLs
• Interact with page elements (click, type, scroll)
• Take screenshots and analyze them
• Run Playwright test scripts and see results
• Debug failing tests by inspecting the actual page state

This turns your AI agent from a code generator into a testing agent that can write, execute, and fix tests in a loop.

Recommended skills

flaky-test-detector

by Timoranjes

Detect, diagnose, and fix intermittent test failures to stabilize your CI pipeli…

$5

prompt-engineer-pro

by Roy Yuen

Professional prompt engineering, audit, and evaluation system for production-gra…

$8

Bug Reproduction Kit Builder for AI Coding Agents

by Shandra

Turn vague bug reports into structured reproduction kits, diagnostic plans, and…

$9.99

Browse all Playwright skills

Installation

The Playwright MCP server is available as an npm package.

npm install -g @anthropic/mcp-playwright

For Claude Code, add it to your MCP configuration:

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

For Codex CLI, the configuration follows the same MCP standard. Check your tool's documentation for the exact config file location.

Configuration Options

The Playwright MCP server supports several configuration flags:

• --browser: Choose between chromium (default), firefox, or webkit
• --headless: Run in headless mode (default: true)
• --viewport: Set viewport size (default: 1280x720)

Example with options:

{
  "mcpServers": {
    "playwright": {
      "command": "npx",
      "args": [
        "@anthropic/mcp-playwright",
        "--browser", "chromium",
        "--headless", "true",
        "--viewport", "1280x720"
      ]
    }
  }
}

Use Cases

End-to-End Test Generation

The most common use case. Ask your agent to write E2E tests for a feature, and with the Playwright MCP server connected, it can:

1. Navigate to the page
2. Identify interactive elements
3. Write test scripts based on what it sees
4. Run the tests immediately
5. Fix any failures

This is significantly more effective than generating test code blind, because the agent can verify its own work.

Visual Regression Testing

With screenshot capabilities, the agent can capture page states and compare them. This is useful for frontend development: make a CSS change, ask the agent to check if anything looks broken.

Accessibility Auditing

The agent can navigate your application and check for accessibility issues: missing alt text, broken ARIA labels, keyboard navigation problems. Combined with a testing skill from Agensi, this becomes a powerful automated audit tool.

Scraping and Data Collection

Beyond testing, the MCP server lets agents interact with web pages for data collection. Useful for research, competitive analysis, or gathering training data.

Combining with Skills

The Playwright MCP server works best when paired with a testing skill. A SKILL.md that defines your testing standards (naming conventions, assertion patterns, coverage requirements) plus the MCP server's execution capability creates an agent that writes tests the way your team expects.

Browse testing skills on Agensi that pair well with the Playwright MCP server.

Troubleshooting

Browser won't launch: Make sure Playwright's browser binaries are installed. Run npx playwright install chromium.

Timeout errors: Increase the timeout in your MCP configuration. Some pages take longer to load, especially in CI environments.

Element not found: The agent might be looking for elements before the page finishes rendering. Adding wait strategies to your testing skill helps here.

Alternatives

If Playwright isn't your testing framework, similar MCP servers exist for Puppeteer and Selenium. The Playwright server is the most popular because of Playwright's modern API and cross-browser support.