Vscode-js-debug: Provide a diagnostic tool

Created on 25 Jan 2020  路  7Comments  路  Source: microsoft/vscode-js-debug

The v1 adapter has the .scripts command which dumps info about which scripts are loaded, the sourcemap info, and how the paths are finally resolved after applying overrides. It would be useful to have the same in this adapter. Would be awesome to have this in GUI form, a custom treeview, or opening an editor with a nicely formatted markdown grid, or something more user friendly than what v1 does.

feature-request on-testplan

Most helpful comment

Added a new command Create Diagnostic Information which generates a nice .html report. Example: https://memes.peet.io/img/js-debug-diagnostics2.html

  • shows current sources and shows you sourcemap children/parents
  • has a 'breakpoint fixer' that checks for a few common cases

    • a breakpoint set in a file that was missing. Will show if there are any files of the same name in the runtime.

    • For .ts/x files it suggests adding sourceMap: true to the tsconfig.json if no files are found

    • For web launches it suggests changing the webRoot

    • If it sees the user specific outFiles, it suggests removing the glob (since we default to the workspace)

    • Breakpoints where they match a file, but are unbound by the runtime (almost always outdated sources or bad locations)

All 7 comments

Yes please, this would make debugging these issues much easier

Could even pop open the browser and/or write an HTML file with details. We have a lot of data and being able to display it in a richer form than the debug console may make life easier. The analyzer could be built into it as well. That alone would make my debug loop a little faster.

Sort of related, I have imagined a workflow where you can click a source that looks like webpack://mycode.ts and pick the file on disk that it corresponds to, and we would generate the launch config parameters to produce that correct mapping.

Added a new command Create Diagnostic Information which generates a nice .html report. Example: https://memes.peet.io/img/js-debug-diagnostics2.html

  • shows current sources and shows you sourcemap children/parents
  • has a 'breakpoint fixer' that checks for a few common cases

    • a breakpoint set in a file that was missing. Will show if there are any files of the same name in the runtime.

    • For .ts/x files it suggests adding sourceMap: true to the tsconfig.json if no files are found

    • For web launches it suggests changing the webRoot

    • If it sees the user specific outFiles, it suggests removing the glob (since we default to the workspace)

    • Breakpoints where they match a file, but are unbound by the runtime (almost always outdated sources or bad locations)

I get the following error when running this new Create Diagnostic Information for Current Session command:

Command 'Debug: Create Diagnostic Information for Current Session' resulted in an error (Error processing createDiagnostics: Error: ENOENT: no such file or directory, open '/Users/julien/.vscode/extensions/ms-vscode.js-debug-nightly-2020.10.1317/src/index.bundle.js')

Is this a bug or am I missing something?

Thanks for pointing that out; fixed in the next nightly

I can confirm it works in v2020.10.2217 馃憤

Was this page helpful?
0 / 5 - 0 ratings

Related issues

connor4312 picture connor4312  路  4Comments

eamodio picture eamodio  路  5Comments

Skuriles picture Skuriles  路  5Comments

FicoPrieto picture FicoPrieto  路  4Comments

mgabeler-lee-6rs picture mgabeler-lee-6rs  路  4Comments