d3k

1. 📌 Skill 基础信息

Skill 名称：d3k

简称：d3k

来源：社区第三方 (hashintel)

运行宿主：专为 Codex Agent 环境设计，依赖其命令行接口运行

核心定位：为 Web 应用提供一体化调试能力，通过统一日志收集和浏览器自动化操作，简化前端和后端的错误诊断流程。

2. 🧩 内部核心组成

d3k 通过多个子命令和浏览器代理工具构建完整调试体系：

核心命令集

命令名	功能简述
d3k errors	显示浏览器和服务器合并的错误日志
d3k logs	查看综合日志，可按类型过滤
d3k fix	深度分析应用错误，支持聚焦特定类型
d3k crawl	自动发现应用URL，支持全深度爬取

浏览器交互工具

d3k agent-browser 提供完整的浏览器自动化能力：

命令名	功能简述
open	打开指定URL
snapshot	获取页面元素引用
click	点击特定元素
fill	填充表单字段
screenshot	截取页面截图
get title	获取页面标题

工作流组件

• 统一日志系统：合并浏览器console和服务器日志
• CDP连接：通过Chrome DevTools Protocol连接浏览器
• 配置文件管理：支持独立浏览器profile启动

3. 🛠 安装与启用方式

安装命令：

skills install --user hashintel/brunch

前置依赖：

• Node.js 运行环境
• Chrome/Chromium 浏览器（支持CDP协议）
• 目标Web应用开发服务器

启动要求：

• 应用运行在本地开发服务器（如3000端口）
• 浏览器需允许CDP连接

4. 📋 标准工作流

典型调试流程

1. 错误发现：使用 d3k errors --context 查看错误及其触发上下文
2. 代码修复：基于错误信息修改源代码
3. 行为复现：通过 d3k agent-browser 命令序列重现用户操作
4. 验证修复：再次运行 d3k errors 确认问题解决

完整工作流示例

# 1. 启动开发服务器
d3k --no-agent --no-skills --servers-only --command "npm run dev" --port 3000

# 2. 浏览器自动化测试
d3k agent-browser open http://localhost:3000
d3k agent-browser click @button-element
d3k agent-browser screenshot /tmp/test.png

# 3. 错误监控
d3k errors --context

5. ⚠️ 关键限制、缺陷、注意事项

平台限制：

• 仅支持基于Chromium的浏览器
• 依赖CDP协议，不支持Safari或Firefox
• 需要在本地开发环境运行

Token消耗：中等，浏览器自动化操作会产生额外开销

适用项目类型：

• ✅ 前端Web应用调试
• ✅ 全栈应用错误追踪
• ✅ 视觉回归测试

不适用场景：

• ❌ 生产环境监控（仅限开发阶段）
• ❌ 移动端应用调试
• ❌ 无头浏览器批量测试

已知坑点：

• localhost 可能产生IPv4/IPv6解析问题，推荐使用 127.0.0.1
• 沙箱环境可能阻断本地网络访问
• 需要手动关闭陈旧的agent-browser进程

生产环境适用性：不推荐，专为开发调试设计

6. ✅ 适用场景 & ❌ 不适合场景

✅ 适用场景

• 前端开发者：需要快速定位和修复Web应用错误
• 全栈工程师：需要统一查看前后端日志
• QA工程师：需要自动化回归测试和截图对比
• 开源项目维护：需要为PR提供视觉变更证明

❌ 不适合场景

• 生产环境监控：无生产级部署能力
• 性能测试：缺乏性能指标收集功能
• 跨浏览器测试：仅支持Chromium内核
• 大规模爬虫：爬取功能有限，仅支持应用内URL发现

skills install --user hashintel/brunch