SuperAPI AI 工具集
合作ENAI 行业资讯收藏
Skill 广场playwright-skill

playwright-skill

测试与质量

查看项目

更新于 10-15 08:33

技能介绍

Playwright-skill 是一个面向浏览器自动化的通用技能，基于 Playwright 实现。它不依赖固定的预置脚本，而是根据用户的具体请求编写自定义 Playwright 代码，并通过统一的执行器运行。

一、用途 该技能用于执行各类浏览器自动化任务，包括测试页面、填写表单、截图、检查页面等。它支持对本地开发服务器进行测试，也可访问外部站点。描述中提到的典型用途包括：测试页面、填写表单、截图、检查链接等。

二、主要能力

  • 自动检测开发服务器：针对 localhost 测试，会先运行 detectDevServers() 检测正在运行的开发服务器；发现 1 个服务器时自动使用并告知用户，发现多个时询问用户选择哪一个，没有发现时询问 URL 或提供启动开发服务器的帮助。
  • 自定义脚本执行：为用户的每个请求编写专属 Playwright 代码，并写入 /tmp/playwright-test-.js（不写入技能目录或用户项目目录），通过 cd $SKILL_DIR && node run.js /tmp/playwright-test-.js 执行。
  • 可见浏览器默认运行：除非用户明确要求 headless（无头）模式，默认使用 headless: false，并可用 slowMo 放慢操作便于观察。
  • URL 参数化：脚本顶部以常量形式设置 TARGET_URL，便于配置检测到的或用户提供的网址。
  • 常见自动化模式：内容涵盖了页面测试（多视口）、登录流程测试、表单填写与提交、断链检查、带错误处理的截图、响应式设计测试（Desktop/Tablet/Mobile）、内联执行简单任务等示例。
  • 辅助函数：lib/helpers.js 提供 detectDevServers()、safeClick()、safeType()、takeScreenshot()、handleCookieBanner()、extractTableData() 等工具。
  • 自定义 HTTP 请求头：可通过 PW_HEADER_NAME/PW_HEADER_VALUE（单个请求头）或 PW_EXTRA_HEADERS（JSON 格式，多个请求头）环境变量为所有请求添加自定义请求头，用于标识自动化流量、获取 LLM 优化响应、全局添加认证令牌等；使用 helpers.createContext() 时自动应用，使用原生 Playwright API 时可通过注入的 getContextOptionsWithHeaders() 应用。
  • 高级参考：API_REFERENCE.md 涵盖选择器与定位器最佳实践、网络拦截与 API 模拟、认证与会话管理、视觉回归测试、移动设备模拟、性能测试、调试技巧、CI/CD 集成等，按需加载。

三、使用方式

  1. 首次设置：在技能目录执行 npm run setup，安装 Playwright 和 Chromium 浏览器，只需一次。
  2. 路径解析：技能可能安装在不同位置（插件系统、手动安装、全局或项目级），执行命令前需根据加载 SKILL.md 的位置确定技能目录，并在命令中以 $SKILL_DIR 替换实际路径。文档给出的常见安装路径包括：插件系统 ~/.claude/plugins/marketplaces/playwright-skill/skills/playwright-skill；手动全局 ~/.claude/skills/playwright-skill；项目级 <project>/.claude/skills/playwright-skill。
  3. 关键工作流：先检测开发服务器，再将脚本写入 /tmp，默认可见浏览器运行，URL 参数化。执行命令形如：cd $SKILL_DIR && node run.js /tmp/playwright-test-*.js。
  4. 内联执行：对快速一次性任务（如截图、检查元素是否存在、获取页面标题），可直接执行内联代码，无需创建文件；复杂测试、响应式检查等可重复运行的任务则使用文件方式。
  5. 自定义请求头示例：PW_HEADER_NAME=X-Automated-By PW_HEADER_VALUE=playwright-skill cd $SKILL_DIR && node run.js /tmp/my-script.js；或 PW_EXTRA_HEADERS='{"X-Automated-By":"playwright-skill","X-Debug":"true"}' cd $SKILL_DIR && node run.js /tmp/my-script.js。

四、适用场景

  • 本地开发服务器的页面测试与验证（含登录跳转、表单提交等流程）。
  • 多视口/响应式设计检查与截图。
  • 截图与错误处理。
  • 断链检查。
  • 需要向被测后端标识自动化流量的场景。
  • 需要自定义认证令牌等请求头的自动化场景。

五、限制与注意事项

  • 首次使用需要运行 npm run setup 安装 Playwright 和 Chromium。
  • 需从技能目录通过 run.js 包装器运行，否则可能出现模块找不到的问题。
  • 浏览器打不开时需检查 headless: false 并确保有显示环境。
  • 元素找不到时需增加等待，如 await page.waitForSelector('.element', { timeout: 10000 })。
  • 测试文件应写入 /tmp，不要写入技能目录或用户项目；测试文件由操作系统自动清理。
  • 建议使用 waitForURL、waitForSelector、waitForLoadState 等等待策略替代固定超时。
  • 每个自动化脚本都是按用户具体请求定制编写，不限于预置脚本。
  • 文档未提供关于收费、价格、平台支持范围、效果保证等信息。