# Playwright MCP — Browser Automation for AI Agents

> Official Playwright MCP server that gives AI agents full browser control — navigate pages, fill forms, click buttons, take screenshots, and run end-to-end tests. 3,000+ stars.

## Install

Merge the JSON below into your `.mcp.json`:

## Quick Use

Add to your `.mcp.json`:

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

Restart Claude Code. Ask: "Open https://example.com, take a screenshot, and describe what you see."

---

## Intro

Playwright MCP is the official Model Context Protocol server for Playwright browser automation, giving AI agents like Claude Code full control over web browsers with 3,000+ GitHub stars. Navigate pages, fill forms, click buttons, extract content, take screenshots, and run end-to-end tests — all through natural language commands. The agent sees the page structure and can interact with any element. Best for developers who need AI-assisted web testing, scraping, or workflow automation. Works with: Claude Code, Cursor, any MCP client. Setup time: under 1 minute.

---

## Available Tools

### Navigation
```
"Open https://github.com/trending"
"Go back to the previous page"
"Wait for the login form to appear"
```

### Interaction
```
"Click the Sign In button"
"Fill the email field with test@example.com"
"Select 'Monthly' from the billing dropdown"
"Press Enter to submit the form"
```

### Content Extraction
```
"Extract all product names and prices from this page"
"Get the text content of the main article"
"List all links on this page"
```

### Screenshots & Visual
```
"Take a screenshot of the current page"
"Take a screenshot of just the navigation bar"
"Compare this page with the expected design"
```

### Testing
```
"Verify the login flow works: go to /login, enter credentials, check dashboard loads"
"Test that the search returns results for 'AI tools'"
"Check all navigation links return 200 status"
```

## Use Cases

### E2E Test Generation
```
"Write Playwright tests for the checkout flow on our staging site"
→ Agent navigates the flow, records interactions, generates test code
```

### Web Scraping
```
"Scrape the top 10 Hacker News stories with their scores and links"
→ Agent navigates HN, extracts structured data
```

### Form Automation
```
"Fill out the registration form on staging with test data and submit"
→ Agent fills fields, handles validation, submits
```

### Key Stats
- 3,000+ GitHub stars
- Full Playwright browser control
- Chromium, Firefox, WebKit support
- Screenshots and visual testing
- Natural language interaction

### FAQ

**Q: What is Playwright MCP?**
A: Playwright MCP is an MCP server that gives AI agents full browser control through Playwright, enabling web navigation, form filling, testing, and scraping via natural language commands.

**Q: Is Playwright MCP free?**
A: Yes, open-source. Playwright itself is free and maintained by Microsoft.

**Q: Does it run a visible browser?**
A: By default it runs headless (invisible). Set headless mode to false for debugging.

---

## Source & Thanks

> Built on [Playwright](https://github.com/microsoft/playwright) by Microsoft. Licensed under Apache 2.0.
>
> [playwright](https://github.com/microsoft/playwright) — ⭐ 70,000+

Thanks to Microsoft and the MCP community for bridging AI agents and browsers.

---

<!-- ZH -->

## 快速使用

将以下配置添加到 `.mcp.json`:

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

---

## 简介

Playwright MCP 是 Playwright 浏览器自动化的官方 MCP 服务器，GitHub 3,000+ stars。让 Claude Code 等 AI Agent 完全控制浏览器 — 导航页面、填写表单、点击按钮、截图和端到端测试。适合需要 AI 辅助 Web 测试、抓取或工作流自动化的开发者。

---

## 来源与感谢

> Built on [Playwright](https://github.com/microsoft/playwright) by Microsoft. Licensed under Apache 2.0.
>
> [playwright](https://github.com/microsoft/playwright) — ⭐ 70,000+

---
Source: https://tokrepo.com/en/workflows/c07ce036-3fd5-48ae-8a2d-9c0b02201c50
Author: MCP Hub