【问题标题】:Mocha breakpoints using Visual Studio Code使用 Visual Studio Code 的 Mocha 断点
【发布时间】:2015-07-13 11:04:21
【问题描述】:

是否可以使用 Visual Studio Code 向 Mocha 测试添加断点?

一般在调试代码时,需要配置launch.json,将程序属性设置为Javascript文件执行。不过,我不确定如何为 Mocha 执行此操作。

【问题讨论】:

    标签: node.js visual-studio-code mocha.js tdd


    【解决方案1】:

    您知道吗,您只需进入启动配置,将光标放在其他配置之后或之间,然后按 ctrl-space 即可获得自动生成当前有效的 mocha 配置?

    这对我来说非常好。包括在断点处停止。 (我也有一个以前的,现在已经过时了,由于各种与设置相关的原因,它不再适用了。)

    从 VSCode 1.21.1(2018 年 3 月)开始,这会产生:

    {
      "version": "0.2.0",
      "configurations": [
        {
          "name": "Mocha (Test single file)",
          "type": "node",
          "request": "launch",
          "runtimeArgs": [
            "${workspaceRoot}/node_modules/.bin/mocha",
            "--inspect-brk",
            "${relativeFile}",
          ],
          "console": "integratedTerminal",
          "internalConsoleOptions": "neverOpen",
          "port": 9229
        }
    }
    

    附注:debug-brkis deprectated(至少适用于 Node >= 版本 8 的任何人)。

    【讨论】:

    • 我需要一些自定义代码来初始化文档并禁用热模块更换。在 "args" 块中传递此参数:"--require", "${workspaceFolder}/tools/testSetup.js",
    • VS Code 1.29.1:Ctrl+Space 自动生成的 Mocha 测试配置没有 debug-brk。尽管使用断点进行调试工作得很好。
    • 我必须在我的(唯一的)其他配置的右括号后插入一个逗号,ctrl + space 才能工作。
    • 有关 Mocha 正确配置的最新示例,请参阅:github.com/Microsoft/vscode-recipes/tree/master/…
    • 仅供参考,接受的答案 @stackoverflow.com/a/55883516/684271 揭示了截至 2020 年 11 月必须删除的内容。
    【解决方案2】:

    如果您不想使用--debug-brk+附加或声明全局 mocha 安装的绝对路径(如果您将 launch.json 置于版本控制之下并且在不同的机器上有多个开发人员,这将会崩溃),安装mocha 作为开发依赖项并将其添加到您的launch.json:

    {
      "name": "mocha",
      "type": "node",
      "request": "launch",
      "program": "${workspaceRoot}/node_modules/mocha/bin/_mocha",
      "stopOnEntry": false,
      "args": ["--no-timeouts", "--colors"], //you can specify paths to specific tests here
      "cwd": "${workspaceRoot}",
      "runtimeExecutable": null,
      "env": {
        "NODE_ENV": "testing"
      }
    }
    

    只需按 F5 即可在您的测试中提供全面的调试支持。

    --no-timeouts 确保您的测试不会因为您在断点处停止而超时,--colors 确保 Mocha 输出颜色,即使它没有检测到 VS Code 支持颜色。

    【讨论】:

    • 对于其他有问题的人。注意 _mocha 而不是 mocha。仅使用 mocha 它将在 VS 代码中运行测试,但不会命中断点
    • 对于那些使用 TypeScript 的人来说,这是一个合适的答案,只要您设置 sourceMaps: true。谢谢十亿!
    • 要添加与 npm 兼容的自定义测试参数,请将 npm_config_myparam 之类的内容添加到 env 块中。在 CLI 上,它可能看起来像 npm --myparam=myvalue test
    【解决方案3】:

    另一种方法是使用 mocha 的 --debug-brk 命令行选项和 Visual Studio Code 调试器的默认 Attach 启动设置。


    建议更深入的解释(来自安德烈)

    为此:

    使用以下命令从命令行运行 mocha:

    mocha --debug-brk
    

    现在在 VS Code 中单击“调试”图标,然后从开始按钮旁边的选项中选择 Attach。在 VS Code 中添加断点,然后点击开始。

    【讨论】:

    • 这种方式简单多了,几乎不需要配置
    • 如果launch.json不存在,你必须将"request": "attach"添加到它——否则它会抱怨你必须指定一个程序或其他一些错误。
    • 这似乎是 VS Code 特定的。在普通 VS 2015 中不起作用
    • 很好的建议谢谢:)
    • 请注意,--debug-brknowadays deprecated,这就是为什么我建议auto-creating a fresh debug config in vscode,是的,也专门用于摩卡。
    【解决方案4】:

    我已经在 OS X 10.10 上的 VSCode 上完成了这项工作。只需将您的 ./settings/launch.json 文件替换为此文件即可。

    {
        "version": "0.1.0",
        "configurations": [
            {
                "name": "Run app.js",
                "type": "node",
                "program": "app.js", // Assuming this is your main app file.
                "stopOnEntry": false,
                "args": [],
                "cwd": ".",
                "runtimeExecutable": null,
                "env": { "NODE_ENV": "production"}
            },
            {
                "name": "Run mocha",
                "type": "node",
                "program": "/Users/myname/myfolder/node_modules/mocha/bin/_mocha",
                "stopOnEntry": false,
                "args": ["test/unit.js"],
                "cwd": ".",
                "runtimeExecutable": null,
                "env": { "NODE_ENV": "production"}
            }
        ]
    }
    

    它也可以作为 gist here.

    您需要更改的键值是program,应设置为_mocha 可执行文件,以及args,应为测试文件的数组。

    【讨论】:

    • 对我不起作用(在 Windows 上) - 但如果它有效,这似乎是一个很好的解决方案 :)
    • 是的。对不起OpenDebug process has terminated unexpectedly
    • 您可以尝试将"runtimeExecutable" 设置为"C:/Program Files/nodejs/node.exe" 或安装Node 的任何位置吗?
    • 肯定 - 但没有变化。
    • 我不使用 Windows,所以我无能为力。但是,请留意 this - 他们正在谈论这个 OpenDebug 问题。
    【解决方案5】:
    1. 转到Debug > Add Configuration... 菜单
    2. 选择Node.js环境
    3. 从出现的下拉列表中选择Mocha Tests选项
    4. 键入测试文件的路径作为args 属性的最后一项
    5. 添加breakpoint
    6. 点击Debug图标
    7. 选择Mocha Tests作为配置
    8. Start debugging按钮
    9. :-)

    【讨论】:

      【解决方案6】:

      我让它在 Mac OS X 上使用 VS Code (1.8.2) 的方式是:

      {
          "name": "Mocha",
          "type": "node",
          "request": "launch",
          "program": "${workspaceRoot}/node_modules/mocha/bin/_mocha",
          "stopOnEntry": false,
          "args": ["--recursive"], //you can specify paths to specific tests here
          "cwd": "${workspaceRoot}",
          "runtimeExecutable": null,
          "env": {
              "NODE_ENV": "testing"
          }
      }
      

      Mocha 需要安装在 npm modules 目录下。

      【讨论】:

      • 这让我困了很久。我错误地使用了来自“which mocha”而不是 node_modules 的路径。谢谢!
      【解决方案7】:

      我想出了一种方法来做到这一点,我将其归类为解决方法。我希望 Visual Studio Code 团队为此提供一个更明确的解决方案,但同时这也是我所做的:

      1. 我创建了一个./settings/mocha.js 文件,它以编程方式运行mocha,将参数作为要运行的文件列表传递。可以查看完整文件here
      2. 我创建了一个启动配置,它将./settings/mocha.js 作为program 运行,并将我们需要测试的文件/文件模式作为参数传递:

        {
            "name": "Unit tests",
            "type": "node",
            "program": ".settings/mocha.js",
            "stopOnEntry": true,
            "args": ["test/unit/*.js", "test/unit/**/*.js"],
            "cwd": ".",
            "runtimeExecutable": null,
            "env": { }
        }
        

        Full launch.json example

      所以这相当于mocha test/unit/*.js test/unit/**/*.js,现在我们可以在 mocha 测试中使用断点。

      【讨论】:

      • 对我不起作用,它找不到测试文件,路径是正确的我也尝试使用完整路径。
      • 这对我也适用 vscode 0.10.6。使用 .ts 文件中的断点和源映射,我确实将 'sourceMaps': true, 'outDir': './build' 添加到我的启动配置中。
      【解决方案8】:

      如果您在 args 列表的末尾添加 ${file} 变量,您可以直接从您打开的文件开始调试:

              {
                  "type": "node",
                  "request": "launch",
                  "name": "Mocha Tests",
                  "program": "${workspaceFolder}/node_modules/mocha/bin/_mocha",
                  "args": [
                      "-u",
                      "tdd",
                      "--timeout",
                      "999999",
                      "--colors",
                      "${file}"
                  ],
                  "internalConsoleOptions": "openOnSessionStart"
              }
      

      【讨论】:

        【解决方案9】:

        很抱歉添加了另一个答案,但从 VS Code 1.8.1 和其中包含的标准节点调试器开始,之前的答案都没有对我有用。这是我解决它的方法(这里有以前的答案和官方VS Code Node.js Debugging docs的指导)所以只需单击/按键调试:

        • 确保 mocha 安装为 devDependencypackages.json: "devDependencies": { "mocha": "^3.2", ... }
        • package.json 的目录中运行npm install 以确保mocha 现在已安装在node_modules/
        • 打开.vscode/launch.json(或在VS Code中,按F1,开始输入“launch”,然后选择“Debug: Open launch.json”)
        • 单击右下角蓝色的“添加配置”按钮(或复制并粘贴您的其他配置之一);此步骤是可选的...我的意思是,您可以重新使用现有配置。但我建议添加一个以减少混乱。
        • 在您的launch.json 中更改以下内容,然后在 VS Code 的调试窗口中选择新的配置名称,然后单击绿色箭头开始调试您的节点 + mocha 测试!

        launch.json:的新配置中

        "configurations": [{
            "name": "whatever name you want to show in the VS Code debug list",
            "type": "node",
            "cwd": "${workspaceRoot}",
            "program": "${workspaceRoot}/node_modules/mocha/bin/mocha",
            "args": ["--debug-brk=5858", "--no-timeouts", "--colors", "test/**/*.js"],
            "address": "localhost",
            "port": 5858,
            // the other default properties that are created for you are fine as-is
        }, ...]
        

        这假设test/**/*.js 模式适用于您放置测试的位置。酌情更改。

        随意更改端口,只要您在argsport 属性中更改它以匹配。

        对我而言,主要区别在于确保 mocha 位于 node_modules 中,使用 program 指向可执行文件,而 args 需要 debug-brk=x 指向 port 中指定的端口。上面的其余部分只是让事情变得更漂亮和更容易。

        是否将.vscode/launch.json 放入存储库取决于您和您的团队。这是一个仅限 IDE 的文件,但您的整个团队都可以像这样使用它,没问题,因为所有路径和安装都是相对且明确的。

        提示:package.json 可以包含一个scripts 标签,该标签也可以使用"test": "./node_modules/.bin/mocha" 之类的内容启动 mocha,但 VS Code 不使用它——而是在命令行中运行 npm test 时使用它.这让我有点困惑。在这里注明一下,以防其他人也感到困惑。

        编辑:VS Code 1.9.0 在调试配置下拉列表中添加了“添加配置”选项,您可以选择“Node.js Mocha 测试”,这有助于简化上述大部分内容。您仍然需要确保 mocha 在您的 node_modules 中,并且可能需要更新 cwd 和最后一个 runtimeArgs(这是查找测试的模式)以指向适当的路径。但是一旦你设置了这两个属性,它应该可以从那里开始工作。

        【讨论】:

          【解决方案10】:

          在launch.json中,下面再添加1个配置

          {
                "type": "node",
                "request": "launch",
                "name": "Mocha Tests",
                "program": "${workspaceRoot}/node_modules/mocha/bin/_mocha",
                "args": [
                  "--timeout",
                  "10000",
                  "${workspaceRoot}/services/*.spec.js",
                  "${workspaceRoot}/*.spec.js"
                ],
                "internalConsoleOptions": "openOnSessionStart"
              },
          

          如果需要配置节点版本,只需像这样添加runtimeExecutable字段

          {
                "type": "node",
                "request": "launch",
                "name": "Mocha Tests",
                "program": "${workspaceRoot}/node_modules/mocha/bin/_mocha",
                "args": [
                  "--timeout",
                  "10000",
                  "${workspaceRoot}/services/*.spec.js",
                  "${workspaceRoot}/*.spec.js"
                ],
                "internalConsoleOptions": "openOnSessionStart",
                "runtimeExecutable": "${env:HOME}/.nvm/versions/node/v8.2.1/bin/node"
              },
          

          【讨论】:

            【解决方案11】:

            1) 转到

            .vscode

            然后

            launch.json

            文件

            2) 在launch.json中添加如下配置-

            {
                "version": "0.2.0",
                "configurations": [
                    {
                        "type": "node",
                        "request": "launch",
                        "name": "Mocha Test",
                        "cwd": "${workspaceRoot}",
                        "runtimeExecutable": "${workspaceRoot}/*folder_path_containing_test*/node_modules/.bin/mocha",
                        "windows": {
                            "runtimeExecutable": "${workspaceRoot}/*folder_path_containing_test*/node_modules/.bin/mocha.cmd"
                        },
                        "runtimeArgs": [
                            "--colors",
                            "--recursive",
                            "${workspaceRoot}/*folder_path_till_test*/tests"
                        ],
                        "internalConsoleOptions": "openOnSessionStart"
                    },
                    {
                        "type": "node",
                        "request": "launch",
                        "name": "Launch Program",
                        "program": "${workspaceRoot}/*folder_path_to_test*/app.js"
                    }
                ]
            }
            

            3) 在测试文件中设置断点,然后按F5

            【讨论】:

              【解决方案12】:

              适用于任何使用 Windows 的人。如果您已全局安装 mocha,则将程序设置为以下路径对我有用(交换您的用户名)。

              "program": "C:\\Users\\myname\\AppData\\Roaming\\npm\\node_modules\\mocha\\bin\\_mocha"
              

              【讨论】:

                【解决方案13】:

                这适用于我在 Windows 7 机器上。我确实全局安装了 mocha,但是此配置指向项目安装以避免需要用户配置文件路径(顺便说一句,我尝试使用 %USERPROFILE% 变量但没有成功)。我现在可以在我的 mocha 测试中设置断点。耶!

                {
                        "name": "Mocha Tests",
                        "type": "node",
                        "request": "launch",
                        "stopOnEntry": false,
                        "program": "${workspaceRoot}/node_modules/mocha/bin/_mocha",
                        "cwd": "${workspaceRoot}",
                        "args": ["./test/**/*.js"],
                        "runtimeExecutable": null,
                        "envFile": "${workspaceRoot}/.env"
                    }
                

                【讨论】:

                  【解决方案14】:

                  对于那些使用 grunt 或 gulp 的人来说,配置非常简单。

                  Launch.json

                  {
                  "version": "0.2.0",
                  "configurations": [
                  
                      {
                          "name": "Run mocha by grunt",
                          "type": "node",
                          "program": "${workspaceRoot}/node_modules/grunt/bin/grunt",
                          "stopOnEntry": false,
                          "args": ["mochaTest"],
                          "cwd": "${workspaceRoot}",
                          "runtimeExecutable": null
                      }
                  ]}
                  

                  Gruntfile.js

                  module.exports = function (grunt) {
                  
                  grunt.initConfig({
                      mochaTest: {
                          test: {
                              options: {
                                  reporter: 'spec'
                              },
                              src: ['test/**/*test.js']
                          }
                      }
                  });
                  
                  grunt.loadNpmTasks('grunt-mocha-test');
                  
                  grunt.registerTask('default', 'mochaTest');};
                  

                  【讨论】:

                    【解决方案15】:

                    在 VSCode 版本 1.13.0 (macOS) 中,他们在配置下内置了它 -> Mocha Tests

                    【讨论】:

                    • 在 Windows 中相同。
                    【解决方案16】:

                    使用 Babel 或生成 javascript 文件但在源代码中放置断点时 - 您必须确保启用 sourceMaps 并定义 outFiles。这是一个对我有用的示例配置。

                        {
                            "name": "Mocha Test",
                            "type": "node",
                            "request": "launch",
                            "program": "${workspaceRoot}/packages/api/node_modules/mocha/bin/_mocha",
                            "cwd": "${workspaceRoot}/packages/api",
                            "args": ["--colors", "--no-timeouts", "out/test"],
                            "outFiles": ["${workspaceRoot}/packages/api/out/*"],
                            "sourceMaps": true,
                        },
                    

                    注意 - 您需要修改 outFiles 以包含您可能想要添加断点的所有内容。在单一存储库和多个依赖项目中,这可能会更加乏味。

                    【讨论】:

                      【解决方案17】:

                      Github 官方microsoft/vscode-recipes 有这个launch.json 用于调试mocha 测试(更多mocha 测试配置进入链接):

                      {
                        "version": "0.2.0",
                        "configurations": [
                          {
                              "type": "node",
                              "request": "launch",
                              "name": "Mocha All",
                              "program": "${workspaceFolder}/node_modules/mocha/bin/_mocha",
                              "args": [
                                  "--timeout",
                                  "999999",
                                  "--colors",
                                  "${workspaceFolder}/test"
                              ],
                              "console": "integratedTerminal",
                              "internalConsoleOptions": "neverOpen",
                              "skipFiles": [
                                  "<node_internals>/**/*.js"
                              ]
                          },
                          {
                              "type": "node",
                              "request": "launch",
                              "name": "Mocha Current File",
                              "program": "${workspaceFolder}/node_modules/mocha/bin/_mocha",
                              "args": [
                                  "--timeout",
                                  "999999",
                                  "--colors",
                                  "${file}"
                              ],
                              "console": "integratedTerminal",
                              "internalConsoleOptions": "neverOpen",
                              "skipFiles": [
                                  "<node_internals>/**/*.js"
                              ]
                          }
                        ]
                      }
                      

                      【讨论】:

                        【解决方案18】:

                        使用 TypeScript 时,以下配置适用于我在 Visual Studio Code 0.8.0 (tsc 1.5.3) 中

                        tsconfig.json

                        {
                            "compilerOptions": {
                                "module": "commonjs",
                                "target": "es5",
                                "noImplicitAny": false,
                                "removeComments": true,
                                "preserveConstEnums": true,
                                "sourceMap": true,
                                "outDir": "build",
                                "declaration": false
                            },
                            "files": [
                                "./src/index.ts",
                                "./src/test/appTests.ts"
                            ]
                        }
                        

                        这里要注意的重要一点是生成了source maps,并且js的输出目录设置为build

                        launch.json

                            {
                                "name": "Attach",
                                "type": "node",
                                // TCP/IP address. Default is "localhost".
                                "address": "localhost",
                                // Port to attach to.
                                "port": 5858,
                                "sourceMaps": true,
                                "outDir": "build"
                            }
                        

                        请注意sourceMaps 设置为trueoutDir 设置为build

                        调试

                        1. index.ts 任何其他导入的打字稿文件中粘贴断点
                        2. 打开终端并运行:mocha --debug-brk ./build/test/appTests.js
                        3. 从 VSC 运行“附加”启动配置

                        【讨论】:

                          【解决方案19】:

                          这是来自 Microsoft 的 launch configuration (launch.json) 示例,它与 Mocha 配合使用并允许使用调试器。

                          另外,还有一个description 说明如何使用 --debug-brk 选项。

                          最后,这是一个alternative version of how to debug code with Mocha tests 使用 VS Code 和 Gulp 任务运行器的 tasks.json 文件。

                          【讨论】:

                            【解决方案20】:

                            如果你在测试中有一些依赖,也很容易附加它。

                            例如,我使用mongo-unit-helper 也将单元测试与数据库集成。

                            package.json 脚本为:mocha --recursive --require ./test/mongo-unit-helper.js --exit"

                            我的launch.json 看起来像:

                              "configurations": [
                              {
                              "type": "node",
                              "request": "launch",
                              "name": "Mocha Tests",
                              "program": "${workspaceFolder}/node_modules/mocha/bin/_mocha",
                              "args": [
                                "-u",
                                "tdd",
                                "--timeout",
                                "999999",
                                "--colors",
                                "--recursive",
                                "--require",
                                "${workspaceFolder}/test/mongo-unit-helper.js",
                                "${workspaceFolder}/test/**/*.js",
                              ],
                              "internalConsoleOptions": "openOnSessionStart"
                             }
                            ]
                            

                            解决方法是将--require单独放在argslaunch.json中。

                            【讨论】:

                              【解决方案21】:

                              最简单的解决方案

                              将以下代码添加到 .vscode 文件夹内的 launch.json 中:

                              {
                                          "name": "Unit tests",
                                          "type": "node",
                                          "request": "launch",
                                          "program": "${workspaceRoot}/node_modules/mocha/bin/_mocha",
                                          "args": [
                                          ],
                                      }
                              

                              您可能还想添加一个超时参数:

                               {
                                          "name": "Unit tests",
                                          "type": "node",
                                          "request": "launch",
                                          "program": "${workspaceRoot}/node_modules/mocha/bin/_mocha",
                                          "args": [
                                              "--timeout",
                                              "999999"
                                          ],
                                      }
                              

                              【讨论】:

                                猜你喜欢
                                • 1970-01-01
                                • 1970-01-01
                                • 1970-01-01
                                • 1970-01-01
                                • 2016-12-19
                                • 1970-01-01
                                • 1970-01-01
                                • 2017-02-15
                                • 2020-12-22
                                相关资源
                                最近更新 更多