Debug console does not have link detection

[alexdima]

Testing #26203

In the testplan item, we are instructed that the debug console should detect links, however it appears it does not.

Have a file with the following content:

function fib(n) {
    if (n === 1 || n === 0) {
        throw new Error('Unexpected');
    }
    return fib(n - 1) + fib(n - 2);
}
try {
    fib(3)
} catch(err) {
    debug;
}

• press F5
• the exception widget pops up inside the catch statement (which is nice)
• in the debug console, evaluate err
• Observe: the error stack trace is not clickable in the debug console.

[michelkaporin]

@alexandrudima Apologise, I had to be more precise when saying that 'debug console' supports it. Link detection works only in the repl viewer-type part of debug console. Once err is requested, it is renderer as a tree, which is not supposed to go through the link detection mechanism. I doubt that it is helpful in the debug experience to navigate links through the object properties. Also this is the behaviour it used to be for the previous link detection in debug console.

Closing this for now. If people would like to have this feature, we can open it as a feature request.

[alexdima]

@michelkaporin @isidorn What is "the repl viewer-type part of debug console" and what steps does one need to do to see it ?

If I evaluate err.stack it also does not detect links:

[isidorn]

I think @michelkaporin meant that link detection in the tree is not very useful and I agree on that. However if we evaluate err.stack the links should be detected -> reopening
Maybe there is already a duplicate for this, however @michelkaporin would know better since I forwarded some of those bugs to him

[michelkaporin]

@alexandrudima I was not adding link detection to the debug console in #26203, instead just amending an existing implementation by linking it to the better link detection mechanism. Hence, sorry for the naming confusion here. By "the repl viewer-type part of debug console" I meant only the simple output that is renderer in the REPL viewer. The example above is rendering an expression rather then simple output and it was not going through the link detection before.

I agree that expression evaluation probably should have detect links also, hence leave it as an open feature request.

[alexdima]

@michelkaporin

Thank you for the explanations. I didn't know a string in the Debug Console is handled differently if it comes from evaluating an expression or if it comes from the stdout of the debuggee. Good to know for the future.

[admsteck]

Would the link detection in the debug console also apply to URLs? Currently when I launch a debugging session of my Django application, it outputs the URL for the running instance in the debug console and it would be great if I could click on it to open a browser, rather than copy paste.

[michelkaporin]

@admsteck there is another issue on that #197

[rebornix]

We already have link detection in integrated terminal so it makes sense that we have them in debug console or other panels.

@Tyriar is it an easy thing to make the link detecting sharable through all panels?

[michelkaporin]

@rebornix we've thought about that in #24489 with follow up in #23917 (comment).

[rsweetland]

Here is a workaround to get clickable file paths (alt + click) to work for debugging:

Start your debugger process in the integrated terminal. Attach the VS Code Debugger to the existing process. Voila! Debug output with clickable line numbers.

More detail (Node.js):

• Inside the integrated terminal, run your debug command. For example: mocha -w --inspect-brk. This will return a url with a port number.
• In the Debug Panel, Add a configuration for Node.js: Attach. Make sure the port matches what was returned from your debug command above.
• In the Debug Panel, click green triangle to attach VS Code to the debugger.

[vith]

@rsweetland thanks, alt+click works there! But a simpler way I found is to just use "console": "integratedTerminal" in the launch config while keeping "request": "launch" of using "attach".

[rsweetland]

Thanks @vith! Just updated to your method. Much better 👍

[jpike88]

There should be special characters one can introduce to the debug output that linkify anything inside them.

That way link detection can be much faster, if performance is a concern.

[iansan5653]

This would be a huge productivity boost for me if we could get something like this. A link markup (akin to markdown) would be fine or even better than automatic link detection. Currently I have to select the file path, copy it, Win+R, paste, and run to open a path.

To be clear, I'd like to be able to see file paths like images be clickable, not just debug statements with line numbers.

[orrgal1]

@rsweetland thanks, alt+click works there! But a simpler way I found is to just use "console": "integratedTerminal" in the launch config while keeping "request": "launch" of using "attach".

using this method but note that the integratedTerminal has some downsides compared to Debug Console. It's not coupled to the Callstack pane, and if you restart a process when the integratedTerminal for that process is not in focus, a new integratedTerminal opens. Also, I haven't found a way to name the terminal so they all just show up as Node Debug Console in the dropdown.

[iansan5653]

The terminal also doesn't support evaluating expressions while debugging, colors, or quoted file paths, and it doesn't auto-clear and has extra text for every run, adding clutter.

[karlos231]

What about a clickable java exception stack trace in the debug console ? Could not find any extension or workaround.

[isidorn]

This should be fixed now via #80502 thanks to @dgozman
We also plan to improve the link detection logic and are considering to turn on link detection in variables and watch pane. Feel free to share feedback - thanks!

To verify: make sure the initial comment works now for the debug console (the exception widget might not still work).