SuperAPI AI 工具集

web-debug

测试与质量

查看项目

更新于 10-16 05:54

技能介绍

用途:web-debug 用于调试或验证前端行为。它强调使用真实无头浏览器,直接观察运行时状态(localStorage、SPA 实际发送的 Authorization 头、控制台错误),而不是读源码、猜测假设再让用户在 devtools 中确认。

主要能力:提供 browser_* 工具集,可导航页面、填写表单、点击元素、读取控制台与网络请求、执行页面内脚本读取运行时状态。状态(cookies、localStorage、IndexedDB)在多次 browser_* 调用、跨轮次乃至 pi 重启后保持,因此调试过程中不要中途 browser_close。

使用方式:核心循环为 browser_goto 打开相关 URL;用 browser_fill、browser_click 复现问题;用 browser_console、browser_network(常配合 verbose: true 与 urlFilter)收集观察;用 browser_eval 读取控制台和网络看不到的运行时状态;形成假设、修改代码、重跑循环验证。资料按用户描述匹配不同 playbook(如登录失败、401/403/CORS、会话不持久、JWT 异常、表单无响应、白屏、生产环境复现、验证修复),每个 playbook 位于 pages/ 下独立文件,只读对应文件。

限制与注意:fetch() 不消费响应体会在 browser_network 中显示 net::ERR_ABORTED,即使 JS 侧看到 200;DOM 节点不能 JSON 序列化,应返回 .outerHTML、.textContent、.value、.checked 等原始属性;button[type=submit] 是属性选择器,对无 type 属性的按钮不匹配,可用 text=Submit 或 role=button[name=Submit];browser_console/browser_network 默认清空整个缓冲区,需保留时传 clear: false;browser_eval 中顶层 return 与多语句体不是表达式,需包成 (() => { ... })()。若只需读取公开 URL 的静态内容,web_fetch 更快;纯源码问题应读源码;大规模多 URL 验证应写脚本用 bash 运行,浏览器工具适合交互式调试而非批量爬取。