百度前端团队用浏览器调试和对抗式QA验证交付

百度前端团队以「Web 界面正确性是运行时组合结果、代码只是参考」为原则，让 Agent 通过 CDP（Chrome 加 --remote-debugging-port=9222 启动，Agent 经 http://localhost:9222/json 取 Tab）打开真实浏览器，从路径、内容、视觉、交互、控制台、网络六个维度验证前端产物。 所有断言必须来自 CDP 取到的 computed style 或 getBoundingClientRect() 实际尺寸，而非源码声明值。关键约束：一个 Agent 对话独占一个 Tab，chrome-cdp Skill 用 --tab 参数强制指定、未指定即报错，避免多会话争抢与竞态。能力层封装 navigate/click/fill/wait/screenshot/eval/get-text/get-html/console-check 等统一接受 --tab、--cdp 参数的脚本，另用 annotate-screenshot 在截图上标注红框与测量值、用 VET 覆盖层做结构对比、用 eval.mjs 批量构建页面结构快照。 用例以 JSON Checkpoint 分阶段构建（先探索页面→写第一批 Checkpoint→按结果补充），先跑 contract-lint 静态校验再跑 dom-assert 在真实浏览器执行，通过结果写入 contract.md，并把可靠 selector、失败 selector 与状态转换时机写入 task-notes.md / visual-notes.md。 实跑两种方案：方案 1 重 QA 由独立 browser-ui-test-inspector Subagent 以「假设实现有问题」立场对抗式测试，每轮产出含 PASS/FAIL/BLOCKED 裁决、截图证据与复现步骤的 report.md，主 Agent 修复后重跑。以「评论区快捷短语面板」真实任务为例共跑三轮——第一轮发现面板被父级 overflow: hidden 裁剪掉一半（搜索栏与分类 Tab 完全不可见）、添加短语后 Modal 不关闭导致重复提交，第二轮确认裁剪已修复（改用 createPortal 渲染到 document.body）、Modal 关闭仍有问题，第三轮全部通过，全程消耗约 300 RMB（Sonnet 4.6），主要成本来自每轮大量截图理解与 DOM 探索中的重复失败尝试。 方案 2 快测试把验证嵌入编码过程，每完成关键改动即写轻量 Checkpoint 用 dom-assert 跑一遍，过了记入 contract.md、没过当场修，成本远低于方案 1，适合日常迭代。另一真实会话中，Agent 首次用 .comment-operation .reply 查询报 Element not found，取实际 HTML 后发现真实类名为 .comment-reply 并记入笔记。 点击后首次查询面板 hasPanel: false，二次检查发现 Popover 异步渲染约 200ms 延迟，结论「点击后等 500ms 再查询」写入笔记。控制台 3 秒监听期 0 error、0 warning。