# Skill Playwright MCP

> Playwright MCP Skill

- Skill: `undermybelt/skill-playwright-mcp` (Agent Skill, multi-file: 2 files)
- Install (CLI): `npx skillmds@latest add undermybelt/skill-playwright-mcp`
- Raw SKILL.md: https://api.skillmd.com/api/skills/undermybelt/skill-playwright-mcp/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: AI & ML
- Author: undermybelt (https://skillmd.com/u/undermybelt)
- Updated: 2026-09-22
- Page: https://skillmd.com/skills/undermybelt/skill-playwright-mcp

---

# Playwright MCP Skill

> Browser automation via Official Microsoft MCP server

## 功能
通过 MCP 协议控制浏览器（自动化、测试、抓取、UI 验证）。

## 核心能力
- 导航、点击、输入
- 截图、快照
- 元素查找（role/aria）
- 等待、评估
- 表单提交

## 前置要求
- 安装 MCP server: `npm install -g @microsoft/playwright-mcp`
- 启动: `playwright-mcp --port 8931`

## 命令
```
/playwright open <url>              # 打开页面
/playwright click <selector>        # 点击元素
/playwright type <selector> <text>  # 输入文本
/playwright screenshot [path]       # 截图
/playwright snapshot                # 获取页面结构（AI 友好）
/playwright eval <js>               # 执行 JS
```

## 示例
```bash
/playwright open https://google.com
/playwright type input[name="q"] "OpenClaw"
/playwright click input[type="submit"]
/playwright screenshot ~/search-results.png
```

## 配置
```yaml
mcp:
  server: "playwright-mcp"
  port: 8931
  timeout: 30000
browser:
  headless: true
  viewport: { width: 1280, height: 720 }
```

---

*Skill: playwright-mcp*
*Created: 2026-02-11 00:58*
*Inspired by microsoft/playwright-mcp (27k⭐)*