技能库智客分类：其他 playwright-mcp OpenClaw

Playwright Mcp

通过Playwright MCP服务器浏览器自动化. 导航网站,点击元素,填表,取出数据,取出截图,并完成完整浏览器自动化工作流程.

官方网址：ClawHub

技能介绍

先看中文介绍；官方 description 原文单独保留，不改写 SKILL.md。

做什么

通过Playwright MCP服务器浏览器自动化. 导航网站,点击元素,填表,取出数据,取出截图,并完成完整浏览器自动化工作流程.

何时用

官方 description 未单独写出 Use when。按规范，代理会在用户任务与这段 description 的关键词匹配时激活本技能。

代理如何加载

按 Agent Skills 渐进披露：启动时只加载 name 与 description（约 100 token）；任务匹配后才读入整份 SKILL.md 正文；scripts/、references/、assets/ 仅在需要时再读。本文件正文结构：Playwright MCP Skill、Installation、Or、Quick Start、Start MCP Server (STDIO mode)、Start with Options。

文件分析

文件分析：这是一份仅含 SKILL.md 的指令型技能，代理激活后整份正文进入上下文。

官方 description（原文）

Browser automation via Playwright MCP server. Navigate websites, click elements, fill forms, extract data, take screenshots, and perform full browser automation workflows.

Playwright MCP SkillInstallationOrQuick StartStart MCP Server (STDIO mode)Start with OptionsHeadless modeSpecific browserWith viewportIgnore HTTPS errorsCommon Use Cases1. Navigate and Extract Data

来源分类：ClawHub Playwright

来源与网址

市场来源：ClawHub

开源榜 Skill 分类

SKILL.md 与 Agent 调用

官方规范 ↗

name: playwright-mcp
description: Browser automation via Playwright MCP server. Navigate websites, click elements, fill forms, extract data, take screenshots, and perform full browser automation workflows.

发现技能客户端向 Agent 提供名称与描述目录。
匹配与调用用户指定或任务匹配后，载入 SKILL.md 指令。
按需加载按步骤读取参考文档、使用脚本与素材。

具体调用语法与可用工具以目标 Agent 客户端为准。查看调用机制说明 ↗

安装这个技能

Skills CLI ↗

先选择目标 Agent 和安装范围，保留技能包的附属文件，安装后检查客户端能否发现该技能。

交给 Agent 安装

复制安装指令给支持 Agent Skills 的代理，确认其中的目标目录与客户端匹配。

把 Agent Skill「playwright-mcp」安装到我的项目：SKILL.md 原文与官方 description 见 https://zicq.com/zh/skills/skl-9b17757e219c1afd-Playwright-Mcp.html
请存为 .cursor/skills/playwright-mcp/SKILL.md 或 .claude/skills/playwright-mcp/SKILL.md，frontmatter 的 name 与 description 保持原样，不要改写。

当前没有明确的 GitHub 技能包地址，请按来源页面的安装器说明操作。

ClawHub ↗

SKILL.md 原文可复制，不会改动源文件

---
name: playwright-mcp
description: Browser automation via Playwright MCP server. Navigate websites, click elements, fill forms, extract data, take screenshots, and perform full browser automation workflows.
metadata: {"openclaw":{"emoji":"🎭","os":["linux","darwin","win32"],"requires":{"bins":["playwright-mcp","npx"]},"install":[{"id":"npm-playwright-mcp","kind":"npm","package":"@playwright/mcp","bins":["playwright-mcp"],"label":"Install Playwright MCP"}]}}
---

# Playwright MCP Skill

Browser automation powered by Playwright MCP server. Control Chrome, Firefox, or WebKit programmatically.

## Installation

```bash
npm install -g @playwright/mcp
# Or
npx @playwright/mcp
```

Install browsers (first time):
```bash
npx playwright install chromium
```

## Quick Start

### Start MCP Server (STDIO mode)
```bash
npx @playwright/mcp
```

### Start with Options
```bash
# Headless mode
npx @playwright/mcp --headless

# Specific browser
npx @playwright/mcp --browser firefox

# With viewport
npx @playwright/mcp --viewport-size 1280x720

# Ignore HTTPS errors
npx @playwright/mcp --ignore-https-errors
```

## Common Use Cases

### 1. Navigate and Extract Data
```python
# MCP tools available:
# - browser_navigate: Open URL
# - browser_click: Click element
# - browser_type: Type text
# - browser_select_option: Select dropdown
# - browser_get_text: Extract text content
# - browser_evaluate: Run JavaScript
# - browser_snapshot: Get page structure
# - browser_close: Close browser
```

### 2. Form Interaction
```
1. browser_navigate to form URL
2. browser_type into input fields
3. browser_click to submit
4. browser_get_text to verify result
```

### 3. Data Extraction
```
1. browser_navigate to page
2. browser_evaluate to run extraction script
3. Parse returned JSON data
```

## MCP Tools Reference

| Tool | Description |
|------|-------------|
| `browser_navigate` | Navigate to URL |
| `browser_click` | Click element by selector |
| `browser_type` | Type text into input |
| `browser_select_option` | Select dropdown option |
| `browser_get_text` | Get text content |
| `browser_evaluate` | Execute JavaScript |
| `browser_snapshot` | Get accessible page snapshot |
| `browser_close` | Close browser context |
| `browser_choose_file` | Upload file |
| `browser_press` | Press keyboard key |

## Configuration Options

```bash
# Security
--allowed-hosts example.com,api.example.com
--blocked-origins malicious.com
--ignore-https-errors

# Browser settings
--browser chromium|firefox|webkit
--headless
--viewport-size 1920x1080
--user-agent "Custom Agent"

# Timeouts
--timeout-action 10000      # Action timeout (ms)
--timeout-navigation 30000  # Navigation timeout (ms)

# Output
--output-dir ./playwright-output
--save-trace
--save-video 1280x720
```

## Examples

### Login to Website
```
browser_navigate: { url: "https://example.com/login" }
browser_type: { selector: "#username", text: "user" }
browser_type: { selector: "#password", text: "pass" }
browser_click: { selector: "#submit" }
browser_get_text: { selector: ".welcome-message" }
```

### Extract Table Data
```
browser_navigate: { url: "https://example.com/data" }
browser_evaluate: { 
  script: "() => { return Array.from(document.querySelectorAll('table tr')).map(r => r.textContent); }" 
}
```

### Screenshot
```
browser_navigate: { url: "https://example.com" }
browser_evaluate: { script: "() => { document.body.style.zoom = 1; return true; }" }
# Screenshot saved via --output-dir or returned in response
```

## Security Notes

- By default restricts file system access to workspace root
- Host validation prevents navigation to untrusted domains
- Sandboxing enabled by default (use `--no-sandbox` with caution)
- Service workers blocked by default

## Troubleshooting

```bash
# Update browsers
npx playwright install chromium

# Debug mode
npx @playwright/mcp --headless=false --output-mode=stdout

# Check installation
playwright-mcp --version
```

## Links

- [Playwright Docs](https://playwright.dev)
- [MCP Protocol](https://modelcontextprotocol.io)
- [NPM Package](https://www.npmjs.com/package/@playwright/mcp)

阅读排版

name: playwright-mcp description: Browser automation via Playwright MCP server. Navigate websites, click elements, fill forms, extract data, take screenshots, and perform full browser automation workflows. metadata: {"openclaw":{"emoji":"🎭","os":["linux","darwin","win32"],"requires":{"bins":["playwright-mcp","npx"]},"install":[{"id":"npm-playwright-mcp","kind":"npm","package":"@playwright/mcp","bins":["playwright-mcp"],"label":"Install Playwright MCP"}]}}

Playwright MCP Skill

Browser automation powered by Playwright MCP server. Control Chrome, Firefox, or WebKit programmatically.

Installation

npm install -g @playwright/mcp
# Or
npx @playwright/mcp

Install browsers (first time):

npx playwright install chromium

Quick Start

Start MCP Server (STDIO mode)

npx @playwright/mcp

Start with Options

# Headless mode
npx @playwright/mcp --headless

# Specific browser
npx @playwright/mcp --browser firefox

# With viewport
npx @playwright/mcp --viewport-size 1280x720

# Ignore HTTPS errors
npx @playwright/mcp --ignore-https-errors

Common Use Cases

1. Navigate and Extract Data

# MCP tools available:
# - browser_navigate: Open URL
# - browser_click: Click element
# - browser_type: Type text
# - browser_select_option: Select dropdown
# - browser_get_text: Extract text content
# - browser_evaluate: Run JavaScript
# - browser_snapshot: Get page structure
# - browser_close: Close browser

2. Form Interaction

1. browser_navigate to form URL
2. browser_type into input fields
3. browser_click to submit
4. browser_get_text to verify result

3. Data Extraction

1. browser_navigate to page
2. browser_evaluate to run extraction script
3. Parse returned JSON data

MCP Tools Reference

| Tool | Description | |------|-------------| | browser_navigate | Navigate to URL | | browser_click | Click element by selector | | browser_type | Type text into input | | browser_select_option | Select dropdown option | | browser_get_text | Get text content | | browser_evaluate | Execute JavaScript | | browser_snapshot | Get accessible page snapshot | | browser_close | Close browser context | | browser_choose_file | Upload file | | browser_press | Press keyboard key |

Configuration Options

# Security
--allowed-hosts example.com,api.example.com
--blocked-origins malicious.com
--ignore-https-errors

# Browser settings
--browser chromium|firefox|webkit
--headless
--viewport-size 1920x1080
--user-agent "Custom Agent"

# Timeouts
--timeout-action 10000      # Action timeout (ms)
--timeout-navigation 30000  # Navigation timeout (ms)

# Output
--output-dir ./playwright-output
--save-trace
--save-video 1280x720

Examples

Login to Website

browser_navigate: { url: "https://example.com/login" }
browser_type: { selector: "#username", text: "user" }
browser_type: { selector: "#password", text: "pass" }
browser_click: { selector: "#submit" }
browser_get_text: { selector: ".welcome-message" }

Extract Table Data

browser_navigate: { url: "https://example.com/data" }
browser_evaluate: { 
  script: "() => { return Array.from(document.querySelectorAll('table tr')).map(r => r.textContent); }" 
}

Screenshot

browser_navigate: { url: "https://example.com" }
browser_evaluate: { script: "() => { document.body.style.zoom = 1; return true; }" }
# Screenshot saved via --output-dir or returned in response

Security Notes

By default restricts file system access to workspace root
Host validation prevents navigation to untrusted domains
Sandboxing enabled by default (use --no-sandbox with caution)
Service workers blocked by default

Troubleshooting

# Update browsers
npx playwright install chromium

# Debug mode
npx @playwright/mcp --headless=false --output-mode=stdout

# Check installation
playwright-mcp --version