I’ve been working on different data structures and algorithms in JavaScript recently. Jest is the workforce to write and run my tests and Visual Studio Code is my preferred editor for coding. Here is the most simple way to debug your code using Jest and Visual Studio Code together.

While coding Quicksort tests were broken with no clue. I wish I could be able to put breakpoints and then step through the source with the inputs from my tests. I invested some time searching different blog posts and Stack Overflow questions and found out different approaches on how to do it, but they were old and had deprecated instructions.

Until I read Jest documentation. Yes, I should have RTFM.

Without further chatter, you only have to update your .vscode/launch.json file in Visual Studio Code with the content below, put a breakpoint in the code and press F5 key to start debugging.

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Debug Jest Tests",
      "type": "node",
      "request": "launch",
      "runtimeArgs": [
        "--inspect-brk",
        "${workspaceRoot}/node_modules/.bin/jest",
        "--runInBand"
      ],
      "console": "integratedTerminal",
      "internalConsoleOptions": "neverOpen",
      "port": 9229
    }
  ]
}

I hope this tip can save you precious minutes of your time.