Cannot debug Jest in VSCode without npm install --legacy-bundling?

[jbsulli]

• VSCode Version: Code 1.8.1 (ee428b0, 2016-12-19T14:49:23.350Z)
• OS Version: Windows_NT ia32 10.0.14393
• Extensions:

Extension	Author	Version

This was a fun one to track down. I was not able to get Jest to debug properly to work on my primary laptop and, after several hours of mucking with it, I tried my second laptop. It worked! After comparing differences, I noticed npm was way out of date and ultimately I discovered the hack below. I feel this is an issue the Jest team must address (and I'll be submitting a issue with them) but I was hoping your team might have some insight? At the very least, others having this issue might find this useful.

---

Steps to Reproduce:

1. Clone my debug-jest-in-vscode repo. It's simply the getting started example from Jest but with my VSCode launch config.
2. Use npm install, put a breakpoint on __tests__/sum-test.js:2, and run.

What I see is, even though I have the sum-test.js page open, a new tab labeled c:\github\debug-jest-in-vscode\__tests__\sum-test.js is opened (note: I cloned to C:\github\debug-jest-in-vscode). If you hover over the tab, the full path it shows is \1000\c:\github\debug-jest-in-vscode\__tests__\sum-test.js. Also, my code is wrapped with ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,global,jest){ + }});. The breakpoint is still respected and the program stops in the correct spot; however, neither placing new breakpoints nor editing code in the mystery tab seems to work.

Now, to get it to work:

1. Delete the node_modules folder entirely.
2. Use npm install --legacy-bundling, put a breakpoint on __tests__/sum-test.js:2, and run.

Now everything is peachy and runs and behaves as expected. Any thoughts?

[clintjhill]

@jbsulli I've run into this very same issue and I resolved it by setting source maps. Hope this helps.

In my .babelrc:

{
  "presets": ["es2015"],
  "sourceMap" : "inline"
}

And in my launch.json:

{
      "type": "node",
      "request": "launch",
      "name": "Run Tests",
      "program": "${workspaceRoot}/node_modules/jest-cli/bin/jest.js",
      "args": [
        "--runInBand"
      ],
      "runtimeArgs": [
        "--nolazy"
      ],
      "stopOnEntry": false,
      "cwd": "${workspaceRoot}",
      "sourceMaps": true,
      "console": "internalConsole"
    }

And the dev dependencies I have:

"devDependencies": {
    "babel-preset-es2015": "^6.24.1",
    "jest": "^20.0.1"
  }

[jbsulli]

@clintjhill, awesome! I'm excited to check this out when I get back. Thank you!

[veeramarni]

Anyone have a solution when using typescript?

[danielo515]

What If I'm not using babel ? I'm using jest to node backends

[weinand]

@auchenberg I think a "Debugging Jest" recipe would be helpful