Virtualize component rendering

[guardrex]

Describe the bug

The Virtualize component adds <div> tags around rendered item template content. When creating a set of list items or table rows, the resultant markup is an HTML spec violation.

To Reproduce

<table>
    <Virtualize Items="@items" Context="item">
        <tr>
            <td>@item.First</td>
            <td>@item.Last</td>
        </tr>
    </Virtualize>
</table>

Result ...

<table>
    <!--!-->
    <div style="height: 0px;" _bl_2=""></div>
    <tr>
        <td>Sally</td>
        <!--!-->
        <td>Hurricane</td>
    </tr>
    <tr>
        <td>Big</td>
        <!--!-->
        <td>Mess</td>
    </tr>
    <div style="height: 0px;" _bl_3=""></div>
</table>

Exceptions (if any)

None

Further technical details

.NET SDK (reflecting any global.json):
 Version:   5.0.100-rc.1.20452.10
 Commit:    473d1b592e

Runtime Environment:
 OS Name:     Windows
 OS Version:  10.0.18363
 OS Platform: Windows
 RID:         win10-x64
 Base Path:   C:\Program Files\dotnet\sdk\5.0.100-rc.1.20452.10\

Host (useful for support):
  Version: 5.0.0-rc.1.20451.14
  Commit:  38017c3935

.NET SDKs installed:
  3.1.300 [C:\Program Files\dotnet\sdk]
  3.1.302 [C:\Program Files\dotnet\sdk]
  3.1.402 [C:\Program Files\dotnet\sdk]
  5.0.100-rc.1.20452.10 [C:\Program Files\dotnet\sdk]

Using the .NET CLI in a Windows command shell.

[mkArtakMSFT]

The Virtualize component allows you to customize the placeholder to be used, which is div by default. Use the Placeholder parameter to configure it.

[guardrex]

Doesn't seem like the presence/absence of <Placeholder> affects this ...

<table>
    <Virtualize Items="@employees" Context="employee">
    <ItemContent>
            <tr>
                <td>@employee.FirstName</td>
                <td>@employee.LastName</td>
            </tr>
        </ItemContent>
        <Placeholder>
            Loading&hellip;
        </Placeholder>
    </Virtualize>
</table>

<div>s aren't valid child elements of <table> ...

<table>
    <!--!-->
    <div style="height: 0px;" _bl_2=""></div>
    <tr>
        <td>Sally</td>
        <!--!-->
        <td>Hurricane</td>
    </tr>
    <tr>
        <td>Big</td>
        <!--!-->
        <td>Mess</td>
    </tr>
    <div style="height: 0px;" _bl_3=""></div>
</table>