VSCode debugger not working in Jest tests - visual-studio-code

Question

I'm struggling to get the Visual Studio Code debugger working in with Jest tests.
Here is my launch.json:
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Jest All",
"program": "${workspaceFolder}/node_modules/jest/bin/jest",
"args": ["--runInBand"],
"console": "integratedTerminal",
"internalConsoleOptions": "neverOpen",
"sourceMaps": true
}
]
}
Here are my Jest tests with a couple of breakpoints:
When I hit the green play button to run the tests with the debugger, the breakpoints are never hit.
Any help would be appreciated

Answer 1

Personnally I use this configuration
{
"name": "Launch e2e test",
"type": "node",
"request": "launch",
"env": {
"NODE_ENV": "test"
},
"args": [
"--colors",
"--config=${workspaceFolder}/jest-e2e.config.js",
"--runInBand",
"--coverage"
],
"runtimeArgs": [
"--nolazy"
],
"windows": {
"program": "${workspaceFolder}/node_modules/jest/bin/jest",
},
"outputCapture": "std",
"internalConsoleOptions": "openOnSessionStart"
}
Change jest-e2e.config.js by your configuration file. And remove or keep coverage
Like Laura Slocum said you will certainly have problem with line number. In my case personnaly think that the problem come from the jest configuration, the transform :
transform: {
"^.+\\.(t|j)s$": "ts-jest"
},

Answer 2

This configuration let's me debug the jest test. Unfortunately hitting a breakpoint in the component does not show the correct line, even though it is stepping through the correct code. I believe this is probably a VSCode error though
{
"name": "Jest", // This is the configuration name you will see in debug sidebar
"type": "node",
"request": "launch",
"port": 5858,
"address": "localhost",
"stopOnEntry": false,
"runtimeExecutable": null,
"env": {
"NODE_ENV": "development"
},
"console": "integratedTerminal",
"preLaunchTask": "compile",
"runtimeArgs": [
"--inspect-brk", // node v8 use debug-brk if older version of node
"${workspaceRoot}/node_modules/.bin/jest",
"--watch",
"--bail",
"--runInBand"
],
"cwd": "${workspaceRoot}"
},

Answer 3

I had the same problem with line numbers being off. In the source file I had almost 30 lines of requires, and the test file that loaded in the debugger added a blank space between each require. So the file that got loaded in vscode was about 60 lines longer.
I found this post that fixed my problem: Debugging Jest Tests in VS Code: Breakpoints Move

Answer 4

The problem for me was the value of the program attribute in launch.json. If your launch.json is as follows:
"program": "${workspaceFolder}/node_modules/jest/bin/jest"
Check if ${workspaceFolder}/node_modules/jest/bin/jest is actually valid. For me, the node_modules did not exist here, but in a subdirectory of workspaceFolder.

Answer 5

The following is the only launch.config that worked for me after trying out everything else :|
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Jest",
"program": "${workspaceRoot}/node_modules/jest/bin/jest.js",
"args": [
"-i"
],
"skipFiles": [
"<node_internals>/**/*.js", "node_modules",
]
}
]
}

Answer 6

If you are using transformers like babel or swc to transform your tests before running the actual tests, the debugger in vscode may not work.
For me I'll just use the debugger.