Unbound breakpoints in Docker node.js TypeScript application

Question

There are a lot of questions on this topic, and I have tried many of the solutions that worked for others, but the solution seems to depend on several things such as the version of VS Code and the recipe used.

This is my VS Code Help>About info:

Version: 1.60.2 (user setup)
Commit: 7f6ab5485bbc008386c4386d08766667e155244e
Date: 2021-09-22T12:00:31.514Z
Electron: 13.1.8
Chrome: 91.0.4472.164
Node.js: 14.16.0
V8: 9.1.269.39-electron.0
OS: Windows_NT x64 10.0.17763

The OS is Windows 10.

The Docker plugin is installed.

I have Docker Desktop 2.3.0.3 installed.

The application is written in TypeScript with inversify IOC.

I am using the launch.json and tasks.json files in src/.vscode. The Docker container is built with the contents of the workspacefolder in /app. It is running locally, using the VS Code Docker plugin.

launch.json:

{
  "configurations": [
    {
      "name": "Docker Node.js Launch",
      "type": "docker",
      "request": "launch",
      "port": 9229,
      "protocol": "inspector",
      "preLaunchTask": "docker-run: debug",
      "localRoot": "${workspaceFolder}/",
      "platform": "node",
      "remoteRoot": "/app/",
      "sourceMaps": true,
    }
  ]
}

tasks.json:

{
    "version": "2.0.0",
    "tasks": [
    {
      "type": "docker-build",
      "label": "docker-build",
      "platform": "node",
      "dockerBuild": {
        "dockerfile": "${workspaceFolder}/Dockerfile",
        "context": "${workspaceFolder}",
        "pull": true
      }
    },
    {
      "type": "docker-run",
      "label": "docker-run: release",
      "dependsOn": [
        "docker-build"
      ],
      "platform": "node"
    },
    {
      "type": "docker-run",
      "label": "docker-run: debug",
      "dependsOn": [
        "docker-build"
      ],
      "dockerRun": {
        "env": {
          "DEBUG": "*",
          "NODE_ENV": "development",
        },
        "command": "node --inspect-brk=0.0.0.0 dist/index.js",
        "envFiles": [".env"],
      },
      "node": {
        "enableDebugging": true,
        "inspectPort": 9229
      }
    }
  ]
}

tsconfig.json:

{
  "compilerOptions": {
    "target": "es2018",
    "module": "commonjs",
    "noImplicitAny": true,
    "strictNullChecks": true,
    "removeComments": true,
    "preserveConstEnums": true,
    "sourceMap": true,
    "outDir": "./dist/",
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true,
    "typeRoots": [ "./types", "./node_modules/@types"],
    "resolveJsonModule": true
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules", "src/**/*.test.ts", "types", "**/tests/*.ts"]
}

When I initiate debug (select the Docker Node.js Launch option and hit F5), the docker builds and starts. The application stops on the first line of dist/index.js, but all my breakpoints (which are all in classes) show as unbound and the debugger does not stop on any of them. The application runs normally otherwise.

I assume that the breakpoints are unbound because VS Code can not map the running code back to the breakpoints in the source. But I have tried opening the files inside the container and setting breakpoints there, and that doesn't work either.

What do I have to do to make breakpoints work?

Having a very similar issue, I also tried setting "sourceMapPathOverrides": { "webpack:///./*": "${workspaceRoot}/*" }, which didn't help either.. Hope someone will have an answer to this — platzhersh
– platzhersh, Commented Jan 12, 2022 at 10:54

platzhersh · Accepted Answer · 2022-01-12 19:31:39Z

I had a similar issue today and was finally able to solve it. I will provide my findings here in the hope it might be helpful to you too.

1. Use trace

By setting trace: true in the launch.json configuration, you will get a lot of more details in your logs. You can read how to make use of that here: NodeJs Debugging in Visual Studio Code When starting the debugger config with trace: true, you will get a log entry in your debug console in the likes of

Verbose logs are written to:
/somepath/vscode-debugadapter-xxxxxx.json.gz

You can take this logfile and analyze it here in this interesting online tool by Microsoft: vscode-pwa-analyzer (Whole Project on Github)

There's a whole lot of logs in there. Probably best if you just try it out and see if you see anything helpful in there.

2. check your sourcemaps

For me it really helped to look at one of my sourcemap files. Go to your build / dist or whatever name you use for your build directory and look for a .map File.

If you open it, you should see something along the lines of

{"version":3,"file":"somefile.js","sourceRoot":"","sources":["../../../src/somedir/somefile.ts"] ... }

Make sure that the sources path is correct. Otherwise there might be something off with your tsconfig File.

3. check the outFiles config

This seemed to be necessary for me to configure to make it work. Add all the paths as glob patterns that contain compiled Javascript Files.

      "outFiles": ["${workspaceFolder}/dist/**.js"],

4. sourceMapPathOverrides

There might also be an issue with the Source Map Paths. You can see if adding this snippet here helps:

"sourceMapPathOverrides": {
        "webpack:///./*": "${workspaceRoot}/*",
      },

5. check the program config

For me, adding the program config property finally did the trick.

If you don't know which one that might be, in my case it helped looking at what my Chrome used as the entry File.

Go to chrome://inspect in your Chrome Browser while your application is started and check what you see there.

In this example the entry File would be the server.js, which led me to configure the source of that file as the program, (with the local path) like so:

"program": "${workspaceFolder}/src/server.ts"

Conclusion

Your setup is probably different from mine and I still don't understand all the settings 100% to be honest. But maybe one of these things helps you get closer to find a solution. Let me know if it helped, and good luck.

Collectives™ on Stack Overflow

Unbound breakpoints in Docker node.js TypeScript application

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related