Control UI 用于通过本地浏览器自动化,为 UI 行为验证提供证据。它优先复用仓库已有的 Playwright、浏览器或 Electron 测试装置;若不存在,则围绕应用的开发服务器或 Chromium 调试端口临时搭建本地装置。
用途:复现依赖真实浏览器焦点、键盘输入、滚动、缩放或渲染的 UI 缺陷;用截图和快照验证视觉或无障碍改动;在发布前检查本地 Web、IDE 或 Electron 行为;采集控制台日志、网络日志、CPU 剖析、trace 或堆快照;为 verify-this 生成前后对比证据。
使用方式:先用仓库文档中的开发命令在本地启动应用;查找已有装置(Playwright 测试、Cypress 规格、Storybook、浏览器脚本、Electron 启动脚本或快照工具);Web 应用用现有浏览器工具连接本地 URL;Electron/Chromium 在支持时启用远程调试端口;按稳定的应用标记而非标签顺序选择页面;优先使用无障碍角色、标签和稳定的 data-* 选择器而非坐标。
交互循环:操作前先截图或快照,从最新页面结构选择目标,每次只执行一个结构性动作(点击、输入、按键、拖拽、滚动、导航或缩放),再重新截图并验证预期状态变化,需要时保存前后对比产物。
CDP 能力:仅在高层浏览器 API 不足时使用原始 CDP,包括性能(CPU 剖析、trace、绘制闪烁、FPS、布局偏移)、内存(堆快照、强制 GC)、网络(请求拦截、限速、禁用缓存、请求响应日志)、渲染(视口变更、配色方案模拟、减少动效、无障碍检查)和调试(控制台流、异常捕获、DOM 快照)。
限制与注意:导航或结构变化后不要依赖过期元素引用;除非点击前刚截图,否则避免坐标点击;测试数据保持本地且可丢弃;未经用户明确同意,不要保存隐私敏感工作区的截图或堆快照;不要硬编码其他仓库的选择器、端口或脚本路径;完成后清理开发服务器、调试会话和临时配置。