webapp-testing · Web 应用测试

用 Python Playwright 脚本测试本地 Web 应用的 skill：验证前端功能、调试 UI 行为、截取浏览器截图、抓取浏览器日志。附带黑盒服务器管理脚本 with_server.py（先跑 --help 看用法），支持多服务器生命周期托管。

静态 HTML 直接读文件找 selector；动态应用走"侦察后行动"：等 networkidle 后截图/查 DOM，再用发现的 selector 执行操作。

调用示例：在聊天框中说"测试一下本地 5173 端口的前端，登录按钮能不能点"。

产品详解

定位

webapp-testing 是本地 Web 应用的 Playwright 测试工具包：写原生 Python Playwright 脚本与本地应用交互，验证前端功能、调试 UI、截图与看日志。它测的是本地应用，不做线上巡检。

核心能力

• 原生 Playwright 脚本：同步 API（sync_playwright()），Chromium headless 运行；用描述性 selector（text=/role=/CSS/ID），操作后关闭浏览器。
• 黑盒服务器管理：scripts/with_server.py 托管服务器生命周期，支持多服务器（前后端分离场景）；调用任何脚本前先跑 --help 看用法，不读源码。
• 静态 HTML 直连：直接读 HTML 文件找 selector，写脚本自动化；也支持 file:// URL。
• 动态应用侦察后行动：先 wait_for_load_state('networkidle')，再截图/查 DOM 发现 selector，然后执行操作。
• 示例库：examples/ 提供元素发现、静态页自动化、控制台日志抓取等常用模式。

工作流程

1. 判断应用类型：静态 HTML → 直接读文件找 selector 写脚本；动态应用 → 下一步
2. 动态应用：服务器已运行则直接连；未运行则用 with_server.py 启动
3. 侦察：networkidle 后截图或查 DOM，确定 selector
4. 执行操作并收集结果（截图/日志/断言）
5. 关闭浏览器

输入与输出

输出：Playwright 脚本执行结果（截图文件、控制台日志、操作断言结论）。

适用场景

• 本地开发中的前端功能回归验证
• 复现 UI bug 并抓取控制台日志定位问题
• 上线前对关键页面做截图留档
• 动态 SPA 的交互行为验证

使用前准备

• 无需 API key；需 Python + Playwright（Chromium 以 headless 模式运行）。
• 服务器未运行时由 with_server.py 代管启动；调用前先 --help 看参数。
• 注意：动态应用必须等 networkidle 后再做 DOM 检查，否则 selector 可能不可靠。

webapp-testing 隶属于 Aiglade Skill 库。在 Aiglade 聊天框中用自然语言描述需求即可调用。

← 回到 Skill 大全