Razor formatting not stable in VS 17.4 Preview 1.0

[seangwright]

I watched the recent community standup stream and wanted to do my part to help resolve the issues I regularly have with Razor (both in VS and VS Code).

I installed VS 17.14.0 Preview 1.0 and made sure the experimental Razor features were enabled.

I then attempted to format a Razor file and experienced the classic "everything shifts to the right/left" each time I format. I thought this type of thing was supposed to be fixed with the new formatter? Maybe I misunderstood.

vs-17-4-preview-razor-formatting-broken.webm

I'm using ctrl+k, ctrl+d to format.

Also, it's very difficult to find documentation about how VS/VS Code should be configured to either

1. Try these experimental features as they are being worked on
2. Configure the IDEs correctly once the features are released.

Here's some specific questions

1. Is the new formatter available in preview in VS Code? (Normally I don't use VS because I need to be cross-platform)
2. If so, how do I enable it?
3. If so, where is it documented?
4. Is it delivered as part of the C# extension in VS Code or the DevKit extension?

[davidwengier]

I thought this type of thing was supposed to be fixed with the new formatter?

It is supposed to be fixed, but I failed to qualify my statement in the standup with "assume we don't have any bugs in the formatter". Sadly, we do. This one is pretty easy actually (and you're not the only person to hit it: #11506), its just a form of code we don't have test coverage for. We are missing the new TextEditorModel when we generate the formatting document, so Roslyn just sees a bunch of lines of code that end with a comma, not a semi-colon, and things get weird. Once we fix the bug and include the first line, the formatting document will look like sensible C# again and things should be fine.

Here's some specific questions

1. Is the new formatter available in preview in VS Code? (Normally I don't use VS because I need to be cross-platform)
2. If so, how do I enable it?
3. If so, where is it documented?
4. Is it delivered as part of the C# extension in VS Code or the DevKit extension?

1. Yes, its in the current pre-release I have installed, which is 2.65.29. It might also be in older versions, we release weekly and I lose track of where things end up :)
2. There is a setting for it if you search the VS Code settings for "razor":
   
3. What documentation are you looking for? As I mentioned in the community standup, we're going for parity so you shouldn't really notice the difference, other than bugs which obviously you've run in to, but I promise I'll get a fix out soon :)
4. C# extension. Broadly speaking there is no Razor editor functionality that is specific to Dev Kit, everything in this repo is part of the free C# extension

On documentation, and how to find out about things, in VS Code specifically we have an extensive changelog in the extension. You can see it in VS Code by clicking the extension and switching to the "CHANGELOG" tab. In fact, looking at the change log it seems the new formatting engine went in to VS Code in v2.63.x (I had to search the changelog for "formatting" to find it though, as its a little too extensive really 😛)

[seangwright]

Thanks for all the details - that helps clarify a lot for me.

I prefer to have "format on save" enabled for C# because auto formatting is something I really enjoy about JS/TS development, so I encounter these kinds of issues regularly.

I'll make sure my VS Code environment is using the new formatting engine and continue to test formatting, logging issues here with videos 😅.

Related: Should I have "Enable combined design time/runtime code generation for Razor files" turned on if I want less buggy syntax highlighting and intellisense?

[ryzngard]

Related: Should I have "Enable combined design time/runtime code generation for Razor files" turned on if I want less buggy syntax highlighting and intellisense?

It's unlikely that would be the case but soon it will be enabled for you so it doesn't hurt :)

[davidwengier]

Okay, I take it back. You found a case where the new formatting engine is unstable, and will keep moving lines to the right with every format operation 🤦‍♂️

So the "new formatting engine" is really almost entirely "new C# formatting part of the engine" because that is the thing that was the hardest to deal with, and was responsible for the instability. Turns out when I fix the thing I mentioned above (we were losing the first line of the attribute) everything looks great on the C# side! BUT we still increase indent by one level every time because the Html formatter doesn't know what do to with attributes that span multiple lines, which makes sense as that's invalid Html.

Anyway, will keep working on it, just wanted to vent a bit :)

[davidwengier]

Okay, fixed and PR is open. Hopefully can get it in to the next preview release of VS.

And just so nobody loses faith in the new formatting engine, the fix makes things look nice (the contents of multi-line attributes are lined up with the start of the attribute), and the old formatting engine, whilst it was stable, would sometimes format these correctly, and sometimes put everything at column 0, depending on the level of Html nesting. And it would have been harder to fix that 😛

[seangwright]

It makes sense that the true value of the new formatting engine is getting bugs fixed quickly is possible now 👍