一句话

用本地浏览器/CDP 环境驱动 web、IDE 或 Electron 界面，拿截图、accessibility 快照、console/网络日志和 profile 当证据。

何时用

• 适合：依赖真实浏览器焦点、键盘、滚动、渲染的 UI bug 复现；视觉或 accessibility 验证；给 ctk-verify-this 出前后截图。
• 不适合：纯终端交互（用 ctk-control-cli）；仓库没有可启动的本地应用时。

怎么用

本地起 dev server，用浏览器自动化验证这个按钮点击后的状态变化并截图

1. 用仓库文档里的 dev 命令起应用，先找已有的 Playwright/Cypress/Storybook harness。
2. web 应用连本地 URL；Electron/Chromium 用 --remote-debugging-port 后 connectOverCDP 连接。
3. 按稳定标记（应用根节点、data-*）选中目标页面，不凭 tab 顺序猜。
4. 交互循环：先截图，一次只做一次结构性动作，再截图验证状态变化，存证据。

产出

• 截图、accessibility 快照、console/网络日志、CPU profile、trace、heap snapshot 等前后对照产物。

要点与坑

• 选择器优先 ARIA role、label、data-*，坐标点击只在刚截完图时用；导航后不用过期元素引用。
• 硬规则：不为了探针给项目加 Playwright 依赖；隐私敏感工作区的截图和 heap 不落盘；不硬编码别的仓库的选择器和端口；用完清理 dev server 和 debug 会话。
• pstack 的 pstack-poteto-mode 把本技能列为依赖之一。

关联

• 同类：ctk-control-cli · 下游：ctk-verify-this
• 所属：00-ctk-概览