使用Visual Studio Code的Mocha断点

时间：2015-05-04 06:20:29

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

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

通常在调试代码时需要配置launch.json，将program属性设置为要执行的javascript文件。我不知道如何为Mocha做这个。

20 个答案:

答案 0 :(得分：66)

如果您不想使用--debug-brk +附加或声明全局mocha安装的绝对路径（如果您将launch.json保留在版本控制下并且在不同的计算机上有多个开发人员，则会生效） ，将mocha安装为dev依赖项并将其添加到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支持颜色。

答案 1 :(得分：65)

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

这对我来说非常好。包括在断点处停车。 （我也有一个先前的，现在过时的，不再出于各种与设置相关的原因。）

enter image description here

从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-brk is deprectated（对于任何节点＆gt; =至少版本8的人）。

答案 2 :(得分：42)

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

建议更深入的解释（来自André）

要做到这一点：

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

mocha --debug-brk

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

答案 3 :(得分：23)

我在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"}
        }
    ]
}

它也可以作为要点here。

您需要更改的关键值是program，_mocha应该设置为args可执行文件，而<configuration> <MailList> <MailID id="test-uk@mysite.com" Value="UK" /> <MailID id="test-us@mysite.com" Value="US" /> <MailID id="test-ca@mysite.com" Value="CA" /> </databases> </configuration> 应该是您的测试文件数组。

答案 4 :(得分：10)

我在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模块目录中。

答案 5 :(得分：7)

  1. 转到Debug > Add Configuration...菜单
  2. 选择Node.js环境
  3. 从显示的下拉列表中选择Mocha Tests选项
  4. 键入测试文件的路径作为args属性
    5. 的最后一项
  5. 添加breakpoint
  6. 点击Debug图标
  7. 选择Mocha Tests作为配置
  8. 按Start debugging按钮
  9. ： - ）

答案 6 :(得分：6)

我已经想出了一种方法，我将其归类为解决方法。我希望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

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

答案 7 :(得分：2)

如果你在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"
        }

答案 8 :(得分：2)

很抱歉再添加一个答案，但是从VS Code 1.8.1和其中包含的标准Node调试器开始，以前的所有答案都不适用于我。这是我解决它的方式（在此处和官方VS Code Node.js Debugging文档的前面答案的指导下）所以有一次点击/按键调试：

  • 确保mocha安装为devDependency中的packages.json："devDependencies": { "mocha": "^3.2", ... }
  • 在npm install的目录中运行package.json以确保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适用于测试的位置。适当改变。

只要您在args和port属性中进行更改即可随意更改端口。

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

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

提示：package.json可以包含scripts标记，该标记也会使用类似"test": "./node_modules/.bin/mocha"的内容启动mocha，但VS代码不使用它，而是在{{1}时使用在命令行运行。这个让我困惑了一下。注意这里，以防其他人也感到困惑。

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

答案 9 :(得分：2)

在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"
    },

答案 10 :(得分：1)

对于那些使用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');};

答案 11 :(得分：1)

使用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以包含您可能想要添加断点的所有内容。在monorepo和多个依赖项目中，这可能会更加繁琐。

答案 12 :(得分：1)

在VSCode版本1.13.0（macOS）中，它们内置于配置下 - ＆gt; Mocha Tests。

答案 13 :(得分：1)

这对我来说是在Windows 7机器上工作的。我确实在全局安装了mocha，但是这个配置指向项目安装以避免需要用户配置文件路径（顺便说一句，我尝试使用％USERPROFILE％变量但没有成功）。我现在可以在我的摩卡测试中设置断点。耶！

{
        "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 :(得分：1)

对于使用Windows的任何人。如果你已经全局安装了mocha，那么将程序设置为以下路径适合我（用你的用户名交换）。

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

答案 15 :(得分：0)

以下是Microsoft的launch configuration (launch.json)示例，该示例适用于Mocha并允许使用调试程序。

此外，还有description如何使用--debug-brk选项。

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

答案 16 :(得分：0)

使用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"
    ]
}

这里需要注意的重要事项是生成源映射，并将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设为true且outDir设为build

调试

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

答案 17 :(得分：0)

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

答案 18 :(得分：0)

如果您在测试中有某种依赖性，那么附加它也很容易。

例如，我正在使用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中的args分别放在launch.json中。

答案 19 :(得分：0)

最简单的解决方案

将以下代码添加到.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"
            ],
        }
相关问题
最新问题