Agent Skills
返回列表
💻

Playwright 会话录制器

开发编程 更新于 2026.08.29

将以下提示词粘贴到你的 AI 对话框中:

请根据 https://skillhub.cn/install/skillhub.md 的指引,将规范名 @user_3c6cb52e/playwright-session-recorder-2 对应的技能安装到你的 AI 助手中。

技能介绍

这个技能解决什么问题

当你手动测试 Web 应用时,一次点击、一次输入、一次页面跳转都会产生大量难以复现的细节。事后想把这次交互变成自动化测试用例时,要么重新回忆操作步骤,要么盯着屏幕录屏回放。Playwright 会话录制器就是为这个场景准备的:它会在你操作浏览器的同时,把每一步动作记录下来,并生成可以直接运行的 Playwright 测试脚本。

核心能力与工作方式

录制器的工作依赖 Playwright 自带的 codegen 能力,大致分为三个环节:

  • 动作捕获:你在浏览器里点击、输入、滚动,codegen 在后台监听 DOM 事件,并记录每个元素对应的选择器。
  • 脚本生成:录制结束后,工具会把操作序列转换为结构化的 Playwright 测试代码,包含页面导航、元素定位和断言等步骤。
  • 上下文归档:除了测试脚本,录制器还会一并导出 .har 网络请求日志和 DOM 快照。这意味着即使页面后续重构导致选择器失效,你仍然可以对照 HAR 和快照排查当时的请求与结构。

适用边界与注意点

这个技能适合从手工探索中快速沉淀回归用例,但它不是万能的:

  • 录制结果对页面稳定性有要求。如果元素定位依赖动态生成的 class 或随机 ID,导出的脚本可能需要人工调整为更稳定的 data-testid 或角色选择器。
  • 它捕获的是用户可见的交互层。涉及服务端渲染条件、iframe 内部通信或跨标签页的状态同步时,单次录制可能覆盖不全。
  • Playwright 本身支持 Python、.NET 和 Java 等多种运行时,但当前技能面向的是 Node.js 环境下的 codegen 流程。如果你主力使用其他语言,需要自行评估脚本迁移成本。

使用场景

  • 手工测试电商结算流程后,需要将点击和输入步骤转化为可重复运行的 Playwright 回归脚本。
  • 页面改版导致旧用例失效,通过回放录制的 HAR 和 DOM 快照来排查当时的请求与元素结构。
  • 为新上线的后台表单编写自动化用例,希望直接录制管理员的真实填写过程并生成测试代码。

适合人员

  • 前端开发工程师,在交付新功能后需要快速生成基础的端到端测试脚本以覆盖核心交互路径。
  • QA 测试人员,面对频繁迭代的页面,希望通过录制手工操作来沉淀可复用的自动化回归用例。
  • 自动化测试架构师,在排查偶发性前端报错时,需要结合网络 HAR 记录与 DOM 快照还原真实现场。