"format document" does not work properly with textareas in Blazor razor

[vsfeedback]

This issue has been moved from a ticket on Developer Community.

---

In my Blazor project, I often use CTRL+K, CTRL+D to format my documents, but there is a bug, when in Razor, there is a textarea inside of a code block. Please see attached screencast.

B62dac05b45ac464692578b602618e488638774719490215504_textarea_bug_in_razor.mp4

---

Original Comments

Feedback Bot on 14/03/2025, 01:56 PM:

We have directed your feedback to the appropriate engineering team for further evaluation. The team will review the feedback and notify you about the next steps.

[davidwengier]

Repros in both new and old formatting engines. I think textarea formatting is weird

Simple repro:

@if (true)
{
    <textarea id="textarea1"
              oninput="return false">
    </textarea>
}

[davidwengier]

Yep, as expected, the Html formatter doesn't move the closing tag (presumably since the whitespace before it, being part of the text area, is significant), so we think it wants it to be indented 4 spaces, and we want 4 spaces due to the @if, so it ends up at 8. Next pass, we think Html wants 8, we want 4, etc. I think we should probably treat it like we treat comments.

[PhilippJR]

Please note, that outside the code block, it also does not work as expected: The closing tag should align with the opening tag.

[davidwengier]

That's not up to us, but rather up to the HTML formatted, and it looks like it doesn't want to move it. Which makes sense because if the start tag was at column 0, but the end tag was at column 4, then moving the end tag would remove 4 spaces of user data from the text area.

Either way, once you get the update if there is a change in formatting you want to see, you can log a VS Feedback issue and we can route it to the right team. We at least won't move the close tag endlessly to the right anymore :)

[PhilippJR]

Is the fix already published?
I am currently working with Visual Studio 17.13.6 and the CTRL + K, D gets even worse:

I only changed 2 lines but my entire file is messed up.

[davidwengier]

@PhilippJR The fix for this issue is in VS 17.14 Preview 3

[PhilippJR]

OK, thanks for the quick response.
Previously we talked about textareas, but above you can see, it is a general issue. Will the fix include this?

[davidwengier]

Would need to see more info to know if the issue you're hitting is an existing one. Can you reproduce the issue in a new project that would allow you to post the whole file contents? Seems like there must be something that the formatter isn't handling, but its not present in the screenshots.

Also feel free to log a new issue, so its easier to keep track of when the fix is made.

[davidwengier]

Oh, is your project multi-targeted to more than one version of .NET? #11646 works around a bug related to that, which could have caused the behaviour you're seeing too. Also 17.14 P3 though

[PhilippJR]

No, it is not.
I will create a new project and post a link...

[PhilippJR]

Hm, I cannot reproduce it with a new project.
In the meantime, I had to stash the changes of above screenshot to fix a little bug. When I popped the changes and formatted the document, it worked properly.
I observed a similar behavior before. When I closed and re-opened Visual Studio everything worked fine.

Sorry, I know without being able to reproduce it, this does not help. I'll let you know, if I find out more.

[PhilippJR]

Hi,

this morning, I worked on a file with a textarea and when I formatted the document with CTRL+k,d, my textarea closing tag again moved to a wrong position. So, I remembered that 17.14 is available and updated VS from 17.13.x.
While before the update, only the textarea closing tag moved, now many more elements move:

17.14.mp4

The textarea closing tag moves to to the right as well as line broken items in the span. The span closing tag is moved to the left.

For reproduction, I copied my code to Home.razor of a new Blazor Wasm project, deleted some things and replaced classes that did not exist. CTRL+k,d resulted in the same misformatted file. Please try yourself. Simply paste below code that I formatted by hand. Then, hit CTRL+k,d or already see what's wrong when "format on paste" is activated.
After the first "misplacement" of some elements, CTRL+k,d still moves the textarea closing tag, what I thought should have been fixed with 17.14.

@page "/"
@using System.Globalization

@if (true)
{
    <div class="d-flex">
        <div class="data-box-column">
            @if (true)
            {
                <span>foo:</span>
                <span>bar:</span>
                <hr class="my-1" />
            }
            <span>baz:</span>
        </div>
        <div class="d-flex flex-column" style="text-align: end;">
            <textarea id="modifiedPrice" disabled="@(!true)" maxlength="10" rows="1" @bind="String1" oninput="if(this.value.includes('\n')) modifiedPrice.blur()"></textarea>
            @if (true)
            {
                <span>
                    @((((true) ? 123d : 0d) +
                        (true ? 123d : 0d)
                        ).ToString("F2", CultureInfo.InvariantCulture)) €
                </span>
                <hr class="my-1" />
                <span>
                    @((123d +
                        ((true) ? 123d : 0d) +
                        (true ? 123d : 0d)
                        ).ToString("F2", CultureInfo.InvariantCulture)) €
                </span>
            }
        </div>
    </div>
    <div class="d-flex flex-column mt-2">
        <label class="small" for="foo">
            <textarea id="foo"
                      disabled="@(!true)"
                      maxlength="56"
                      rows="1"
                      placeholder="@String2"
                      @bind="String3"
                      oninput="if(this.value.includes('\n')) { this.value = this.value.replace(/\n/g, ''); this.blur(); }">
            </textarea>
        </label>
    </div>
}
else
{
    <span>@String4</span>
}


@code {
    private string String1 { get; set; } = string.Empty;
    private string String2 { get; set; } = string.Empty;
    private string String3 { get; set; } = string.Empty;
    private string String4 { get; set; } = string.Empty;
}

[davidwengier]

Thanks for the report @PhilippJR, but can you please log a new issue for it though, so it doesn't get lost? Comments on closed issues are easy to miss and I'm travelling for a couple of weeks at the moment.

[PhilippJR]

Sure, here it is.