Webapp Testing

用 Python Playwright 在本地网页应用复现具体交互,保存脚本和浏览器证据,方便其他开发者重跑。

用 Playwright 复现一处本地界面故障

给出获准的本地页面和一个可观察的预期结果,保留其他开发者能复跑的脚本与证据。

给出本地路由、预期行为与模拟输入。

复制请求,在 Floatboat 新对话中粘贴,并提供所需资料。

下载 Floatboat

带入 Floatboat 的请求

请求可预览和复制,不会从此处自动发送。

参考来源: Webapp Testing
https://github.com/anthropics/skills/blob/main/skills/webapp-testing/SKILL.md

先阅读原始说明并核对当前环境与依赖。需要安装或连接新工具时,先提出方案。

我的任务:
用 Webapp Testing 验证我本地的设置表单。输入会触发必填提示的模拟值,保存 Playwright 断言和实际截图,记录相关浏览器错误。只运行我确认过的本地启动命令。

期望交付:
可重跑的脚本与包含实际结果的简报。

关于 Webapp Testing

Anthropic 的 Webapp Testing Skill 采用 Apache-2.0,指导编程 Agent 编写原生 Python Playwright 脚本。它能检查静态 HTML 或本地应用,也提供启动获准开发服务的辅助脚本。截图记录可见状态,断言用来判断行为是否符合预期。

Webapp Testing 的本地浏览器验证场景

选择有可见预期结果的交互。把截图和控制台线索与一个具体断言放在一起,方便队友按相同条件重新验证。

复现表单校验错误

提供本地地址、模拟表单值和预期错误提示。让 Agent 提交测试数据,记录页面实际状态,并把缺失提示写成可重复的断言。

检查加载结束后的交互

选一个首屏渲染后才返回数据的页面。等待相关状态出现,再查看实际 DOM,并确认目标控件能否按预期使用。

给失效路由保留现场

在测试会话打开有问题的路由,将导航顺序、截图和相关控制台错误放在同一份记录里,方便开发者定位故障。

复核一处静态 HTML 改动

打开获准的本地 HTML 测试文件,验证键盘操作或点击结果。留下包含具体断言的短脚本,便于后续回归检查。

如何复现一次本地网页交互

从一个能观察到的失败开始。Agent 可以复用已启动的测试服务,或运行你已确认的本地启动命令,再保存足以复现问题的证据。

  1. 限定测试范围

    给出本地地址或 HTML 文件、获准使用的测试数据和一个可观察的验收条件。准备好 Python Playwright 和所需浏览器。

  2. 执行指定交互

    使用正在运行的本地应用,或通过辅助脚本运行已审查的启动命令。等页面进入目标状态后查看 DOM,再选择定位方式。

  3. 交接可复现证据

    保存测试脚本、断言结果和必要截图或控制台输出。记下命令与检查的本地路由。

探索更多 Agent Skills

查看其他 Skill 指南,并在使用前核对原始来源。

Webapp Testing 常见问题

这个 Skill 使用什么浏览器工具?
上游使用原生 Python Playwright 脚本,并提供管理本地开发服务器的辅助工具。
能检查静态 HTML 文件吗?
可以。上游有通过本地文件地址执行的示例,应用需要开发服务时再启动。
需要另开一个服务器吗?
已有获准且可用的本地服务器时可直接复用。只有确认了本地启动命令后,才交给辅助脚本执行。
一张截图能证明修复成功吗?
截图记录页面状态。应同时保存可重复执行的断言及其输出,用来核对交互。
Claude Code 的哪个插件包含它?
Anthropic 将 Webapp Testing 放在 example-skills 插件中。浏览器与 Python 依赖仍需另行准备。
能用生产账号当测试数据吗?
这套流程使用获准的测试环境和模拟数据。需要访问生产环境的检查应先确认访问范围。