microsoft / vscode

Visual Studio Code
https://code.visualstudio.com
MIT License
164.87k stars 29.51k forks source link

unable to debug nodejs code written in es6 + async await and transpiled with babel. #19973

Closed talarari closed 7 years ago

talarari commented 7 years ago

Steps to Reproduce:

  1. clone this repository :https://github.com/talarari/vscode-debug/tree/master
  2. run npm run build to transpile code with babel
  3. run npm install
  4. set breakpoints in src/async-await.js like this (the breakpoints will move when you actually try to run...): image
  5. launch the project from inside vscode like this: image

breakpoints will break in unexpected places, stepping into and over will go to unexpected places, basically debugging will not be possible.

vscode code has an awesome debugging experience, but faced with the option of debugging vs writing async-await code, the latter wins.

would really like to have both :)
i've tried many different setups and none worked. any project setup that will work is fine by me (babel-node,building source before running, advanced versions of node , anything else you can think of).

if there is one that works, just fork my repo and make the needed changes. any help will be greatly appreciated.

weinand commented 7 years ago

@talarari please try our new node debugger by setting "type" to "node2" and see whether this makes a difference.

talarari commented 7 years ago

No, doesn't help. This is the launch config im using: https://github.com/talarari/vscode-debug/blob/master/.vscode/launch.json

Regular es6 works fine, the problem is debugging asyc await.

roblourens commented 7 years ago

I'm not sure we can do any better than this, the sourcemap output looks screwy. Is it better in any other debugger?

roblourens commented 7 years ago

Actually, I think this could be fixed by https://github.com/Microsoft/vscode-chrome-debug-core/issues/112. But it's only an issue because the babel sourcemappings are really weird.

Where you have var a = `hello${name}`;, the a and name on the generated side are mapped correctly, but the = 'hello' part is mapped to the wrong line for some reason. We can probably be a little more clever about how we pick mappings.

talarari commented 7 years ago

any update on this?

mengxingshike2012 commented 7 years ago

I have followed by the instruction of this, it seems that when I try to step into next line after await in a async function, the breakpoints will break in unexpected places. As we are using webpack2, the unconfortable thing is that we have many .babelrc files. one in project root with simple config, and one in each for the root category e.g. src/frontend, src/server, src/common..Does it matter

chemitaxis commented 7 years ago

Hi guys! Any news about it? Thanks!

roblourens commented 7 years ago

https://github.com/Microsoft/vscode-chrome-debug-core/issues/112 was closed awhile ago and the experience should be better now. Would appreciate if someone can try it out and let me know.