在VS Code中调试Jest单元测试

随着React的流行，jest也成很多项目广泛使用的测试框架。由于jest默认是并发执行测试，在日常的工作中发现很多同学对于如何调试jest单元测试犯难。这些小细节有时真是“会者不难，难者不会“。这里给大家介绍如何在code中调试jest测试的小技巧。

注意： 这里需要Node> v8.4. 之前的版本V8有bug,导致Jest测试中的断点根本断不到。

添加调试任务

我们需要在Code中添加一个调试任务。 内容如下：

{
    "type": "node",
    "request": "launch",
    "protocol": "inspector",
    "name": "Jest Debug",
    "program": "${workspaceRoot}/node_modules/jest/bin/jest",
    "stopOnEntry": false,
    "args": ["--runInBand", "--env=jsdom", "${fileBasename}"],
    "runtimeArgs": [
        "--inspect-brk"
     ],
     "cwd": "${workspaceRoot}",
     "sourceMaps": true,
     "console": "integratedTerminal"
}

这里有一个jest的运行时参数：--runInBand 或者简写为 -i不知道大家注意到没有？就是这个参数控制jest串行执行所有测试。

其他参数和设置我就不赘述了，大家自己查看code的帮助学习。

设置断点开始调试

好了，现在你可以在code中打开一个你需要调试的测试文件并设置好断点。然后，狠狠的按下F5。接下来…… 同学，该你了！