69

我找不到任何有关调试用 Jest 编写的单元测试的信息。

你如何调试 Jest 测试？

4

9 回答 9

130

您不需要JestChrome测试。

我找到的最简单的解决方案是使用VS Code JavaScript Debug Terminal。

它可以与 Typescript 和 Nrvl.Nx 开箱即用的工作空间一起使用。

  1. 打开命令面板并开始Debug: JavaScript Debug Terminal：

在此处输入图像描述

  1. 在该终端中以Watch 模式 npm test --watch运行测试。
  2. 在文件中设置断点。
  3. 对要调试和保存的文件进行任何更改。
  4. watch将对修改后的文件运行 Jest 测试。

当您想缩小 --watch 运行的文件数量时，p在终端中按下并输入一个模式，这只是您要测试的文件名的一部分，然后按 [Enter]

要将其限制为文件中的单个测试 - 用 f 聚焦它，因此将它（...）更改为 fit（...）

于 2020-09-15T20:52:20.297 回答
30

您可以使用 Chrome DevTools 来调试 Jest 测试。

首先，在您的项目中启动 Node 调试器：

node --inspect-brk <path to jest.js> --runInBand <path to your test file>

例子：

  • 如果您在本地安装 Jest（Linux 示例）：

    node --inspect-brk ./node_modules/jest/bin/jest.js --runInBand mymodule/test.js

  • 如果您全局安装 Jest（Windows 示例）：

    node --inspect-brk "C:\\Program Files\\nodejs\\node_modules\\jest\\bin\\jest.js" --runInBand mymodule\\test.js

然后，您可以打开 Google Chrome 浏览器，在地址栏中输入：

chrome://inspect

现在单击“远程目标”下的检查链接以打开 Chrome DevTools。

请注意，您可能需要将源代码文件夹添加到 chrome-devtools 中的工作区，以便能够设置断点。

现在您可以按 F8 开始调试。

[仅供参考]：

  • 我的节点版本：v10.11.0
  • 我的笑话版本：23.6.0
  • 我的谷歌浏览器版本：71.0.3578.98

[更新] 关于在 chrome-devtools 中将源代码文件夹添加到工作区的步骤（根据 Sam 的要求），如下所示：

在此处输入图像描述

然后你可以打开你的脚本文件并设置断点：

在此处输入图像描述

您可以在我的 GitHub 存储库中找到简单的演示项目。

于 2019-01-01T09:15:02.513 回答
7

这是我在 VSCode 中调试 Jest 的基本配置，添加到 settings.json 中的启动配置

"launch" : {
  "configurations": [
    {
      "type": "node",
      "request": "launch",
      "name": "Jest",
      "program": "${workspaceRoot}/node_modules/jest/bin/jest.js",
      "args": [
          "-i"
      ],
       "skipFiles": [
        "<node_internals>/**/*.js", "node_modules",
      ]
    }
  ],
},
于 2019-04-29T12:30:27.853 回答
4

我写了一篇关于在终端中调试 Jest 测试的 7 种方法的博文。这是最快的方法。

您可以安装ndb，这是一种改进的 Node.js 调试体验，由 Chrome DevTools 启用，使用

npm install -g ndb

然后你可以运行：

ndb npm run test

这将为您打开 DevTools 并运行测试。

或者您可以只输入一个命令：

npx ndb npm run test

你可以走了。但是请查看博客文章，其中详细介绍了调试 Jest 测试的不同方法。

于 2021-03-18T21:42:42.157 回答
3

截至 2021 年，请查看Jest 文档中的 VS Code 中的调试。将configurations以下内容添加到您的.vscode/launch.json文件中。

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Debug Jest Tests",
      "type": "node",
      "request": "launch",
      "runtimeArgs": [
        "--inspect-brk",
        "${workspaceRoot}/node_modules/jest/bin/jest.js",
        "--runInBand"
      ],
      "console": "integratedTerminal",
      "internalConsoleOptions": "neverOpen",
      "port": 9229
    }
  ]
}
于 2021-12-26T23:59:03.120 回答
1

对于任何寻求答案的人，您可以使用 node-inspector 调试 jest。然而，这是一个非常缓慢的过程（调试单个测试需要 2-5 分钟），并且在实际使用中并不是很有用。

我还没有找到更好的方法来调试 Jest，但是我看到很多人做额外的工作来让 jasmine 或 mocha 与 react 组件一起工作。因此，在节点检查器实际可用之前，这可能是一个更可行的选择。

于 2015-11-05T20:40:27.383 回答
1

仅当只有一个项目时，添加 jest 配置才有效。但是，如果它自己的文件夹中有多个项目（即 rootfolder/project1、rootfolder/project2），在测试文件或被测文件中运行带有断点的“jest --watchAll --runInBand --coverage”会很好选项

于 2021-12-27T00:52:27.867 回答
0

跑

node --debug-brk node_modules/.bin/jest

在您的项目目录中。它应该启动node进程暂停调试器的侦听（通常在端口 5858）。Visual Studio Code是一个很好的 node.js 图形调试器示例，可用于连接到侦听节点进程。

于 2017-01-19T03:53:36.610 回答
0

@Yuci 的回答对我来说是完美的。

如果您在本地 Docker 容器中使用 jest，我只是对其进行精确化。您需要精确--inspect-brk=0.0.0.0:9229

node --inspect-brk=0.0.0.0:9229 <path to jest.js> --runInBand <path to your test file>
于 2020-12-18T09:57:04.847 回答