VSCode Newbie: Remote Jest/Node debugging through Docker

Question

I've recently switched from Vim to VSCode, and I'm trying to set up VSCode debugging for jest tests run through docker.

The debugging works...sort of. If I want to run jest tests and have breakpoints activate, I need to:

1. Insert the breakpoints
2. Start running the relevant jest test(s) via the vscode-jest-tests launch.json task below
3. Quickly execute Docker: Attach To Node before the test suite hits breakpoints

Obviously not ideal - I'd love to ensure VSCode automatically attaches to the debugger upon running vscode-jest-tests. In short: is there an easy way to attach the VSCode debugger when running Jest tests through Docker?

Here are my current launch.json and package.json files. Any help very appreciated:

launch.json

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "node",
      "request": "attach",
      "name": "Docker: Attach to Node",
      "port": 9229,
      "address": "localhost",
      "localRoot": "${workspaceFolder}",
      "remoteRoot": "/www",
      "protocol": "inspector"
    },
    {
      "type": "node",
      "request": "launch",
      "name": "vscode-jest-tests",
      "runtimeExecutable": "npm",
      "runtimeArgs": [ "run", "test:debug" ],
      "address": "127.0.0.1",
      "port": 9229,
      "breakOnLoad": true,
      "restart": true,
      "timeout": 10000,
      "localRoot": "${workspaceFolder}",
      "remoteRoot": "/www",
      "outFiles": [
        "${workspaceFolder}/dist/**/*.js"
      ],
      "console": "integratedTerminal",
      "internalConsoleOptions": "neverOpen"
    }
  ]
}

package.json

#...
"scripts": {
  "test:debug": "docker exec -it kiva_api node --nolazy --inspect-brk=0.0.0.0:9229 node_modules/.bin/jest --runInBand --config=test/jest-e2e.json"
}
#...

PS: If I run npm run test:debug from the command line & have a chrome debugger window open, Chrome's debugger works just fine

Answer 1

Here a shot of my solution, which comes mostly from your same question. Thank you for asking :)

First start jest in watch mode (--watchAll), so the process stays alive. (In the snippet I assume a backend container is running via docker-compose with port 9229 exposed on the host)

docker-compose exec backend \
  node --inspect=0.0.0.0:9229 -r tsconfig-paths/register -r ts-node/register \
  node_modules/.bin/jest --watchAll --runInBand 

Now in VSCode .vscode/launch.json config add a config to attach to the running process. Note: ensure remoteRoot fit your setup.

{
  // Use IntelliSense to learn about possible attributes.
  // Hover to view descriptions of existing attributes.
  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
  "version": "0.2.0",
  "configurations": [
    {
        "type": "node",
        "request": "attach",
        "name": "Docker: Debug tests",
        "address": "127.0.0.1",
        "port": 9229,
        "trace": true,
        "restart": true,
        "timeout": 10000,
        "localRoot": "${workspaceFolder}",
        "remoteRoot": "/app",
        "outFiles": [
            "${workspaceFolder}/dist/**/*.js"
        ],
        "disableOptimisticBPs": true,            
        "internalConsoleOptions": "neverOpen",
        "continueOnAttach": true,
    }]
}

From here on I have been able to develop and debug properly my code.