source maps are not working when debugging with chrome

[yanivefraim]

• Version: 6.3.1 +
• Platform: OSX

I am debugging my mocha tests using native node debugger, using the following command:

/usr/local/bin/node --debug-brk --inspect=9444 --expose_debug_as=v8debug /Users/yanivef/Documents/projects/node-debug-example/node_modules/mocha/bin/_mocha --require babel-register --timeout 0 --ui bdd test/**/*.spec.js

Debugger works great, but I cannot make source maps to work.

I created a small simple example here.

Just clone + npm i + npm run test-debug. You'll see that when opening the address from command line (chrome-devtools://devtools....) you can debug but source maps are not working:

I tried adding project to workspace / adding source maps manually with no luck. Am I doing something wrong here? Is there an issue here?

[jasnell]

Yep, this is a known limitation and it's not something that we can actually fix at this time. The issue is that the chrome debugger needs to know how to fetch the original source but the inspector code has no way of providing it yet.

[matthewoates]

@jasnell How so? The sourcemap in this example is inlined. Isn't the data from the sourcemap sufficient? Sourcemaps in the browser can show the original source without having access to the actual files.

[matthewoates]

poke @jasnell

[knownasilya]

Ping

[MylesBorins]

/cc @nodejs/v8-inspector

[samuelcastro]

Any solution here guys? @jasnell @matthewoates

[jasnell]

hmm... I thought I had responded to this earlier today. Perhaps it got lost somewhere and will show up on wikileaks someday... in any case, there's no solution at this time. Source maps are not supported when using the chrome inspector with node because there is no mechanism by which to locate and load those source maps. We would need some one to figure out how to make it work and open a PR.

[jasnell]

Source maps aren't supported at the current time because there's no
mechanism for loading them. It's something that has been discussed from
time to time but there's been no resolution yet

On Friday, October 21, 2016, Samuel Castro notifications@github.com wrote:

Any solution here guys? @jasnell https://github.com/jasnell
@matthewoates https://github.com/matthewoates

—
You are receiving this because you were mentioned.
Reply to this email directly, view it on GitHub
#8369 (comment), or mute
the thread
https://github.com/notifications/unsubscribe-auth/AAa2eeQkUcpdzhyIVLU8GVxoyQY7tk1vks5q2Q8vgaJpZM4JytlQ
.

[EricMCornelius]

@jasnell - can you give some technical background/pointers on what's going on here? I'll happily try to help out if I can get a bit of direction.

Isn't this just stock Chrome DevTools UI integrating with node's debugging protocol exposed via v8-inspector? Chrome's DevTools support sourcemap loading already for frontend work, and the context menu option to "Add Source Map" exists when you right-click on the code pane. It seems non-functional though.

Unfortunately, a ton of people are using Babel/Typescript transpilation for node, and lack of sourcemaps leaves --inspect functionality severely hampered.

@pavelfeldman indicated in a couple places that they should work:
#6792 (comment)
#6725 (comment)

[noinkling]

I'm chipping in because I've been a bit confused by this, and see no reason it shouldn't work given what's presented in Chrome.

• Node version: 7.0
• Platform: Windows 10
• Chrome version: 54 stable

I'm using babel-node in development which outputs inline source maps by default, I assume it's pretty much the same with babel-register. In my case I simply run something like babel-node --inspect src/server/index.js. In Chrome, in the sources panel, the path in the file tree and in the tab title point to the original source file, and it says it detects a source map, but I get displayed the transpiled version of the code (which I believe is served from memory with babel-node).

When I click "more" this is the message:

but there are no other versions of the same file in the file tree or when I press Ctrl + P.

If Chrome can both detect an inline source map and knows the path to my source, shouldn't this be able to work?

Debugging seems to work pretty much fine otherwise, other than a bug with the console sometimes not working correctly.

As an aside: I know it's probably not comparable, but I recently gave VS Code a go using the new Node debugger (referred to as node2) which uses the v8 inspector protocol, and source maps work fine there for the same use case (after setting "sourceMaps": true in launch.json).