AI导哈

JavaScript调试工具

一个基于Chrome DevTools Protocol的JavaScript和TypeScript调试工具，支持断点设置、代码步进、变量检查和源映射等功能。

  • by johngrimes
  • TypeScript
  • 本地部署
  • 2 星标
  • 更新于
在 GitHub 查看 johngrimes/mcp-js-debugger

使用说明

MCP JS调试器

一个MCP（模型上下文协议）服务器，它公开 Chrome DevTools协议 调试功能，使AI助手能够调试JavaScript和 TypeScript应用程序。

特性

  • 连接到任何兼容CDP的调试器（Node.js、Chrome、Edge）
  • 设置、列出和删除断点
  • 遍历代码（over、into、out）
  • 使用源代码映射支持检查调用堆栈
  • 计算任何堆栈帧中的表达式
  • 查看和修改变量
  • 在出现异常时暂停
  • 完全支持源代码映射，用于调试转换后的代码

安装

npm install
npm run build

Claude代码集成

添加到您的Claude代码配置中：

claude mcp add mcp-js-debugger -- npx mcp-js-debugger

或添加到 .mcp.json:

{
  "mcpServers": {
    "mcp-js-debugger": {
      "command": "npx",
      "args": ["mcp-js-debugger"]
    }
  }
}

用法

启动调试目标

使用检查器启动Node.js应用程序：

# Pause on first line (recommended for setting initial breakpoints)
node --inspect-brk=9229 your-script.js

# Or start without pausing
node --inspect=9229 your-script.js

可用工具

工具 说明
connect_debugger 通过WebSocket URL连接到CDP端点
disconnect_debugger 断开与调试会话的连接
set_breakpoint 按URL和行号设置断点
remove_breakpoint 按ID删除断点
list_breakpoints 列出会话中的所有断点
resume_execution 暂停后恢复执行
step_over 跳过当前声明
step_into 进入函数调用
step_out 退出当前功能
pause_execution 暂停运行执行
get_call_stack 获取包含源位置的当前调用堆栈
evaluate_expression 计算JavaScript表达式
get_scope_variables 获取作用域中的变量
set_variable_value 修改变量的值
set_pause_on_exceptions 配置异常处理
get_original_location 生成到原始源位置的地图
get_script_source 获取脚本源代码
list_scripts 列出加载的脚本

工作流程示例

  1. 开始您的应用程序 --inspect-brk:

    node --inspect-brk=9229 app.js

  2. 获取WebSocket URL：

    curl http://localhost:9229/json

  3. 连接调试器：

    connect_debugger(websocket_url: "ws://localhost:9229/<id>")

  4. 设置断点：

    set_breakpoint(session_id: "...", url: "file:///path/to/app.js", line_number: 10)

  5. 继续执行以到达断点：

    resume_execution(session_id: "...")

  6. 暂停时检查状态：

    get_call_stack(session_id: "...")
get_scope_variables(session_id: "...", call_frame_id: "...", scope_index: 0)
evaluate_expression(session_id: "...", expression: "myVariable")

  7. 继续调试：

    step_over(session_id: "...")
resume_execution(session_id: "...")

源地图支持

服务器自动加载转译代码的源映射（TypeScript， 捆绑的JavaScript等）。当源映射可用时：

  • 调用堆栈显示原始源位置
  • 可以在原始源文件上设置断点
  • get_original_location 将生成的位置映射到原始源
  • get_script_source 可以返回原始源内容

发展

# Build
npm run build

# Run tests
npm test

# Run tests with coverage
npm run test:coverage

# Watch mode for development
npm run dev

建筑

  • cdp-client.ts -低级Chrome DevTools协议客户端包装器
  • 会话管理器 -管理多个调试会话
  • 源地图管理器 -处理源地图加载和位置映射
  • server.ts -使用工具处理程序实现MCP服务器
  • types.ts -TypeScript类型定义

需求

  • Node.js 18.0.0或更高版本
  • CDP兼容的调试目标（Node.js、Chrome、Edge等）

许可证

阿帕奇-2.0

相关 MCP