作者 lackeyjb · lackeyjb/playwright-skill
Claude 可以按需编写和运行自定义 Playwright 脚本——有头浏览器、实际输出——无需记忆预置的测试库。
与其提供固定的辅助函数，这个技能教 Claude 为每个任务编写定制 Playwright 代码，并通过 run.js 执行。浏览器默认以有头模式运行，所以你能看到自动化过程。Playwright API 文档按需加载，这样 Claude 有上下文但不会溢出窗口。
%APPDATA%\Claude\claude_desktop_config.json{
"mcpServers": {
"playwright-skill": {
"command": "git",
"args": [
"clone",
"https://github.com/lackeyjb/playwright-skill",
"~/.claude/skills/playwright-skill"
],
"_inferred": true
}
}
}打开 Claude Desktop → Settings → Developer → Edit Config。保存后重启应用。
{
"mcpServers": {
"playwright-skill": {
"command": "git",
"args": [
"clone",
"https://github.com/lackeyjb/playwright-skill",
"~/.claude/skills/playwright-skill"
],
"_inferred": true
}
}
}Cursor 使用与 Claude Desktop 相同的 mcpServers 格式。项目级配置优先于全局。
{
"mcpServers": {
"playwright-skill": {
"command": "git",
"args": [
"clone",
"https://github.com/lackeyjb/playwright-skill",
"~/.claude/skills/playwright-skill"
],
"_inferred": true
}
}
}点击 Cline 侧栏中的 MCP Servers 图标，然后选 "Edit Configuration"。
{
"mcpServers": {
"playwright-skill": {
"command": "git",
"args": [
"clone",
"https://github.com/lackeyjb/playwright-skill",
"~/.claude/skills/playwright-skill"
],
"_inferred": true
}
}
}格式与 Claude Desktop 相同。重启 Windsurf 生效。
{
"mcpServers": [
{
"name": "playwright-skill",
"command": "git",
"args": [
"clone",
"https://github.com/lackeyjb/playwright-skill",
"~/.claude/skills/playwright-skill"
]
}
]
}Continue 使用服务器对象数组，而非映射。
{
"context_servers": {
"playwright-skill": {
"command": {
"path": "git",
"args": [
"clone",
"https://github.com/lackeyjb/playwright-skill",
"~/.claude/skills/playwright-skill"
]
}
}
}
}加入 context_servers。Zed 保存后热重载。
claude mcp add playwright-skill -- git clone https://github.com/lackeyjb/playwright-skill ~/.claude/skills/playwright-skill一行命令搞定。用 claude mcp list 验证，claude mcp remove 卸载。
何时使用： 你推送了新的注册流程，想知道它端到端是否仍然工作正常。
npx playwright install 安装结果： 一次性烟雾测试，你可以选择将其保存为持久规范。
何时使用： 重组后你怀疑有链接失效。
结果： 一个分类的死链列表供修复。
何时使用： 你改变了头部，想看它在桌面、平板和移动设备上如何渲染。
结果： 三张截图供快速视觉审查。
Web 用 Playwright，原生用 ios-simulator-skill——在跨平台测试会话中同时使用两者
| 工具 | 输入参数 | 何时调用 | 成本 |
|---|---|---|---|
| Custom Playwright script generation | task description | 任何浏览器自动化请求 | 0 |
| run.js executor | script path | 脚本生成后 | 0 |
| Headed/headless toggle | flag | CI 对比本地调试 | 0 |
'browserType.launch: Executable doesn't exist'运行 npx playwright install chromium
npx playwright --version选择器间歇性失败切换到角色/标签选择器；添加 await expect(...).toBeVisible() 等待。
脚本挂起Claude 可能忘记关闭浏览器。告诉它始终用 try/finally 包装并使用 await browser.close()。
| 替代方案 | 何时用它替代 | 权衡 |
|---|---|---|
| playwright MCP | 你想要结构化的 MCP 工具（click、fill、snapshot）而不是代码生成 | MCP 隐藏了代码；这个技能编写可复用的真实脚本 |
| Puppeteer skills / chrome-devtools MCP | 纯 Chrome 工作流、DevTools 协议功能 | 跨浏览器支持较差 |