自定义调试工具 ​

为何需要自定义调试工具？ ​

DevTools 的局限性

• 针对网页设计：DevTools 是为网页开发设计的，其功能（如 DOM 检查、CSS 调试、网络请求分析等）主要围绕 HTML、CSS 和 JavaScript 展开。对于非网页应用（如自定义语言、桌面应用、嵌入式系统等），这些功能可能不适用。
• 无法直接调试非网页应用：DevTools 依赖于浏览器的运行时环境（如 V8 引擎）和 Chrome DevTools Protocol (CDP)。如果应用不是运行在浏览器中，或者使用了非 JavaScript 语言，DevTools 无法直接调试，比如 Roma 安卓和鸿蒙端在采用的 App 内嵌入 V8 引擎，因此无法直接调试。

自定义调试工具的需求

• 支持自定义语言或框架：如果应用使用了自定义 DSL（领域特定语言）或其他编程语言（如 Python、C++ 等），需要开发专门的调试工具来支持这些语言的语法、运行时和调试功能。
• 特定领域的调试需求：某些应用场景（如物联网设备调试、定制与自身业务结合的开发调试工具等）可能需要特定的调试功能，而这些功能在 DevTools 中并不存在。
• 跨平台支持：可以为不同平台（例如 Android\iOS\Harmony）开发统一的调试工具。

技术挑战 ​

除了 CDP 协议外还需要实现：

• 消息通道：调试工具需要在前端和后端之间建立可靠的消息通道，用于传输调试信息（如断点、变量值、调用栈等）。
• 运行时环境集成：对于非 JavaScript 语言，需要将调试模块集成到运行时环境中（如 V8 引擎、Python 解释器等），以支持断点、单步执行、变量检查等功能。

自定义调试 ​

基于 CDP， 实现自定义调试工具：

1. 建立 WebSocket 通信层: 与 DevTools 调试面板建立通信。
2. 完成浏览器 Discovery 协议：在浏览器中可以显示应用。
3. 完善/转发 CDP 协议：V8 中已自带了 inspector 能力，对于代码的调试协议大多不需要我们处理，对于 inspector 外的协议需要单独处理，例如 Console、Page 等。 其他语言库如未实现 inspector，需要单独实现 inspector 部分，例如 QuickJS。
4. 处理/转发 CDP 协议：例如获取 设置断点、取消断点、发起网络请求。实现每一个 CDP 协议消息的发送与相应，例如 setBreakpointByUrl 协议完成 接收 DevTools 设置断点到 V8 中。
5. Devtools 进行扩展：基于 CDP 定制自己的页面 或 自定义协议命令，比如 Roma Android 调试中可以输入 $Jue 调试当前页面信息，实现 evaluate 协议执行 V8 加载脚本代码。