【发布时间】:2015-07-13 11:04:21
【问题描述】:
是否可以使用 Visual Studio Code 向 Mocha 测试添加断点?
一般在调试代码时,需要配置launch.json,将程序属性设置为Javascript文件执行。不过,我不确定如何为 Mocha 执行此操作。
【问题讨论】:
标签: node.js visual-studio-code mocha.js tdd
是否可以使用 Visual Studio Code 向 Mocha 测试添加断点?
一般在调试代码时,需要配置launch.json,将程序属性设置为Javascript文件执行。不过,我不确定如何为 Mocha 执行此操作。
【问题讨论】:
标签: node.js visual-studio-code mocha.js tdd
您知道吗,您只需进入启动配置,将光标放在其他配置之后或之间,然后按 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",
Ctrl+Space 自动生成的 Mocha 测试配置没有 debug-brk。尽管使用断点进行调试工作得很好。
ctrl + space 才能工作。
如果您不想使用--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 支持颜色。
【讨论】:
sourceMaps: true。谢谢十亿!
npm_config_myparam 之类的内容添加到 env 块中。在 CLI 上,它可能看起来像 npm --myparam=myvalue test。
另一种方法是使用 mocha 的 --debug-brk 命令行选项和 Visual Studio Code 调试器的默认 Attach 启动设置。
建议更深入的解释(来自安德烈)
为此:
使用以下命令从命令行运行 mocha:
mocha --debug-brk
现在在 VS Code 中单击“调试”图标,然后从开始按钮旁边的选项中选择 Attach。在 VS Code 中添加断点,然后点击开始。
【讨论】:
"request": "attach"添加到它——否则它会抱怨你必须指定一个程序或其他一些错误。
VS Code 特定的。在普通 VS 2015 中不起作用
--debug-brk 是nowadays deprecated,这就是为什么我建议auto-creating a fresh debug config in vscode,是的,也专门用于摩卡。
我已经在 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,应为测试文件的数组。
【讨论】:
OpenDebug process has terminated unexpectedly
"runtimeExecutable" 设置为"C:/Program Files/nodejs/node.exe" 或安装Node 的任何位置吗?
Debug > Add Configuration... 菜单Node.js环境Mocha Tests选项args 属性的最后一项breakpoint
Debug图标Mocha Tests作为配置Start debugging按钮【讨论】:
我让它在 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 目录下。
【讨论】:
我想出了一种方法来做到这一点,我将其归类为解决方法。我希望 Visual Studio Code 团队为此提供一个更明确的解决方案,但同时这也是我所做的:
./settings/mocha.js 文件,它以编程方式运行mocha,将参数作为要运行的文件列表传递。可以查看完整文件here;我创建了一个启动配置,它将./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": { }
}
所以这相当于mocha test/unit/*.js test/unit/**/*.js,现在我们可以在 mocha 测试中使用断点。
【讨论】:
'sourceMaps': true, 'outDir': './build' 添加到我的启动配置中。
如果您在 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"
}
【讨论】:
很抱歉添加了另一个答案,但从 VS Code 1.8.1 和其中包含的标准节点调试器开始,之前的答案都没有对我有用。这是我解决它的方法(这里有以前的答案和官方VS Code Node.js Debugging docs的指导)所以只需单击/按键调试:
devDependency 在 packages.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 模式适用于您放置测试的位置。酌情更改。
随意更改端口,只要您在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 Code 不使用它——而是在命令行中运行 npm test 时使用它.这让我有点困惑。在这里注明一下,以防其他人也感到困惑。
编辑:VS Code 1.9.0 在调试配置下拉列表中添加了“添加配置”选项,您可以选择“Node.js Mocha 测试”,这有助于简化上述大部分内容。您仍然需要确保 mocha 在您的 node_modules 中,并且可能需要更新 cwd 和最后一个 runtimeArgs(这是查找测试的模式)以指向适当的路径。但是一旦你设置了这两个属性,它应该可以从那里开始工作。
【讨论】:
在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"
},
【讨论】:
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
【讨论】:
适用于任何使用 Windows 的人。如果您已全局安装 mocha,则将程序设置为以下路径对我有用(交换您的用户名)。
"program": "C:\\Users\\myname\\AppData\\Roaming\\npm\\node_modules\\mocha\\bin\\_mocha"
【讨论】:
这适用于我在 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"
}
【讨论】:
对于那些使用 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');};
【讨论】:
在 VSCode 版本 1.13.0 (macOS) 中,他们在配置下内置了它 -> Mocha Tests。
【讨论】:
使用 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 以包含您可能想要添加断点的所有内容。在单一存储库和多个依赖项目中,这可能会更加乏味。
【讨论】:
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"
]
}
]
}
【讨论】:
使用 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 设置为true,outDir 设置为build
调试
index.ts 任何其他导入的打字稿文件中粘贴断点mocha --debug-brk ./build/test/appTests.js
【讨论】:
这是来自 Microsoft 的 launch configuration (launch.json) 示例,它与 Mocha 配合使用并允许使用调试器。
另外,还有一个description 说明如何使用 --debug-brk 选项。
最后,这是一个alternative version of how to debug code with Mocha tests 使用 VS Code 和 Gulp 任务运行器的 tasks.json 文件。
【讨论】:
如果你在测试中有一些依赖,也很容易附加它。
例如,我使用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中。
【讨论】:
最简单的解决方案
将以下代码添加到 .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"
],
}
【讨论】: