javascripttypescriptvisual-studio-codevscode-debuggersource-maps

VSCode debugger not stopping on Typescript breakpoints

I have a Lerna monorepo with 2 modules(packages): ps and cli.

ps just exports a function whatever which cli imports.

When I try to debug this code using VSCode, however, my breakpoints stop on the generated Javascript files instead of my source Typescript files.

enter image description here

This has bothered me for hours and I have extensively played around with my tsconfig.json and launch.json as well as using vscode-pwa-analyzer to see that VSCode is able to detect my source TS code but I cannot figure out a fix.

EDIT: I am using the following setup: macOS Big Sur v11.1 Node.js v14.8.0 Typescript v4.1.3

And here is a dump file of my above debug you can load to vscode-pwa-analyzer. enter image description here I can see here that I get some Unbound Breakpoint errors.

Solution

  • I replicated the problem, but I would say that this is the expected behavior.

    Actually setting a breakpoint on a function declaration makes no sense. If you change your whatever function as a sync function (i.e. function whatever(): void) you will see that VSCode doesn't let you to break on that line.

    In the special case of an async function we know that the function body is actually wrapped in a Promise. Probably in this special case the typescript debugger let us to set a breakpoint on a function declaration line to let us check what happens outside the Promise wrap.