Vscode: Multi-line diagnostics

[ccapndave]

Some error messages (e.g. from Elm) are quite verbose, and are very hard to read properly without line breaks.

Therefore it would be nice if the vscode.Diagnostic message could contain line breaks (these could be stripped out in the Errors and warnings selector to keep the UI sensible). It would be even nicer still if error messages could contain colors and styles.

This is an example of the kind of thing it would be nice to have in a diagnostic popup:

[jrieken]

Wd do support this with the hover. I'll add support for the F8 feature, unsure what to do with the new error list.

[sandy081]

With regards to error-lists, showing long error messages completely would occupy space. So, I am thinking to provide an expand/collapse option for the error-entry to show or hide the complete description.

[jrieken]

Also, a mono-space font should be used. Otherwise whitespace based formatting won't work

[jrieken]

Like the hover, the message part of the in-editor error display now uses the editor font.

[jrieken]

cc @stevencl for how to handle multiline diagnostics in the error list view

[sandy081]

Supporting multiline or long descriptions is not trivial with current infrastructure. Firstly, I will be showing them with ellipsis.

@joaomoreno mentioned different ideas on how we can support this in trees.. Will look into them.

[sandy081]

Marking this as a feature request for problems view to show multi line descriptions

[trixnz]

I'm not sure if this belongs in its own issue or is suitable to piggy back on the discussion here: Some languages (Rust, for instance) output additional references to lines of code that contributed to the error. Adding these to the Problems window would be helpful to the end user, but doing so causes confusion because the diagnostic entries are sorted on the Range field, resulting in out of order results.

Allowing a Diagnostic object to contain child errors that show up in a tree display would be a big step forward. Is that what you meant by trees, @sandy081?

[sandy081]

@trixnz Scenario you mentioned is different than what is being discussed here. Its about showing long/ multi line description problems.

Trees, I mentioned here is an implementation detail. But, we do show problems as tree with only one level. Your scenario is interesting and I would suggest to make that as a separate issue, since, it needs changes at multiple places for eg: Diagnostic model, api etc

[faceyspacey]

any progress on this? It's been a long while. As it currently stands, Flow for VS Code is basically useless because of issues like this:
https://github.com/flowtype/flow-for-vscode/issues/39#issuecomment-272881674

If you can't see usages for typed modules for something so common as unused props, you've basically just typed a file for no purpose other than its own use.

[sandy081]

Multiline errors are not yet planned, we will definitely come to this when there are free cycles. Thanks.

[dmitriid]

Is it possible to bump this in priority? Off the top of my head, Elm, Reason/Bucklescript, Typescript would greatly benefit from this. Rust was mentioned above.

In general, most modern languages/build tools provide multiline errors which become unreadable when squashed into single line.

Hovering to display the error is nice-ish, but it breaks the mostly-keyboard flow that developers are in when developing.

[jonsterling]

I second @dmitriid's comment. I'm building a proof assistant, and lack of multiline errors makes the diagnostics view essentially useless for my purposes—but with a modification to support multiline errors (or at the very least, a modification so that diagnostics are displayed in the order that they are reported!) it would become an essential part of my users' workflow.

As it stands, I may have to implement my own diagnostics pane, which I was hoping to avoid.

[jonsterling]

(See #16099 for a description of the out-of-order diagnostics issue I mention in connection with this.)

[damassi]

For those who are curious, I fixed this by following these (somewhat hacky) steps:

1. Install https://github.com/be5invis/vscode-custom-css … and get it working
2. Add this to stylesheet:

.panel .monaco-tree-row {
    white-space: pre-line;
    height: auto !important;
}

1. Reload the JS/CSS, and fixed (though scrolling is impacted):

For day-to-day development this has greatly increased my productivity but its unfortunate that it requires an ouside plugin to achieve.

[dmitriid]

@damassi You are the hero we don't deserve :)

[sandy081]

@damassi The hack might break other behaviour like Scrolling if there are many problems.
I am open to take a PR for this with proper fix.

[damassi]

@sandy081 - Indeed it does break scrolling but for most of my cases its been more than sufficient. I'll look into opening a PR for a proper fix today 👍

[DanTup]

Dart is considering more verbose messages to help users too, so I'd love to see this. I did wonder about using the additional info and just setting the same range (since it already expands/collapses), but it shows the filename/range even if it's the same:

Maybe hiding the filename/range info if it's the same as the parent diagnostic would be a relatively simple way to get part-way there (the diagnostic provider would have to split the lines, of course).

[damassi]

Note that my vs-code-custom CSS solution to this no longer works in the latest VSCode, haven't had time to investigate why, but 👍 👍 for getting multiline in core!

[sandy081]

Problems view now shows multi-line diagnostics in multiple lines. You can expand/collapse the message to be shown in multiple or single line. There is also a global command to show all message in multiple or single lines. Check it out 👇

[damassi]

Beautiful @sandy081 💯 🎉