Support for "Friendly Call Frames" in call stack, like Chrome's devtools

[joshtynjala]

The debugger in Chrome browser's devtools has a feature called "Friendly Call Frames" that renders the call stack using the original/unminified function names, if those name mappings are defined at a specific location in a source map (.js.map) file. This provides a better developer experience than rendering minified or obfuscated function names. It would be great to have this feature in vscode-js-debug too.

I'll just copy the description from babel/babel#14907 because it describes how the feature works very well.

Before:

After:

To unminify a frame, you need to have a name attached to the ( of the declaration site. So, we need to have a name:

function foo() {
//          ^ Here
  bar(baz);
}

function bar(callback) {
//          ^ Here
  callback();
}

function baz() {
//          ^ Here
  throw new Error('test');
}

foo();

It doesn't matter that we've properly named the bar/callback/Error/foo identifiers at before the (, the segment that includes the ( must also include it.

[connor4312]

Seems sensible 👍