How do you debug Jest Tests?

Question

I can\'t find any information on debugging my unit tests written with Jest.

How do you debug Jest Tests ?

Answer 1

For anyone seeking an answer, you debug jest with node-inspector. However this is a very slow process (2-5 minutes to debug a single test), and wasn't very useful in actual usage.

I haven't found a better way to debug Jest, however I have seen a lot of people doing the extra work to make jasmine or mocha work with react components. So that may be a more viable option until node-inspector is actually usable.

Answer 2

You can use Chrome DevTools to debug Jest tests.

First, start Node debugger in your project:

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

Examples:

• If you install Jest locally (Linux example):

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

• If you install Jest globally (Windows example):

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

Then, you can open the Google Chrome browser, and type in the address bar:

chrome://inspect

Now click the inspect link under "Remote Target" to open Chrome DevTools.

Note that you probably need to add the source code folder to the workspace in chrome-devtools, so as to be able to set breakpoints.

Now you can press F8 to start debugging.

[FYI]:

• My Node version: v10.11.0
• My Jest version: 23.6.0
• My Google Chrome version: 71.0.3578.98

---

[Update] Regarding the step of adding the source code folder to the workspace in chrome-devtools (as asked by Sam), it looks like below:

And then you can open your script files and set the breakpoints:

You find the simple demo project on my GitHub repo.

Answer 3

You do not need Chrome for Jest tests. This is the whole point of using Jest instead of other test runners.

The simplest solution I found is to use VS Code JavaScript Debug Terminal.

And it works with Typescript and Nrvl.Nx work-spaces out of the box.

1. Open JavaScript Debug Terminal:

2. Run tests in that terminal in a Watch mode npm test --watch.
3. Set a break-point in your file.
4. Make any change in a file you want to debug and save.
5. watch will run Jest tests against modified files.

When you want to narrow down the number of files run by the --watch press p in the terminal and enter a pattern which is just a part of the file name you want to test and hit [Enter]

To limit it to a single test in a file - focus it with f, so change it(...) to fit(...)

Answer 4

This is my basic config for debugging Jest in VSCode, add to your launch configurations within 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",
      ]
    }
  ],
},

Answer 5

Run

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

in your project directory. It should start the node process paused an listening (usually at port 5858) for a debugger. Visual Studio Code is an example of a nice graphical debugger for node.js that can be used to connect to the listening node process.