Rendering Issues When Using Virtualize with MudGrid

Bug type

Component

Component name

No response

What happened?

When using <Virtualize> with <MudGrid>, after approximately five rows (see example app -> Virtualize Example) the MudItems flash and no more are rendered.

Removing the surrounding <MudGrid> and all items are rendered correctly

This appears worse in Edge (Chrome); Firefox only displays the top 20 cards in my reproduction application (even though there should be more)

Expected behavior

Items should respect the <Virtualize> component and all should be rendered correctly when approaching the viewport according to the paramters set on the enclosing <Virtualize> component.

Reproduction link

https://github.com/thesilverbadger/MudBlazorVirtualize

Reproduction steps

1. Create a new page with a top level on a standard or admin template
2. Create a child <Virtualize> element bound to collection of greater than 100 items
3. Add some child content inside the <ItemContent> with a top level that is less than 100% width (e.g. <MudItem xs="4" />).
4. Run the app and scroll down

Relevant log output

No response

Version (bug)

6..2

Version (working)

No response

What browsers are you seeing the problem on?

Firefox, Microsoft Edge, Safari

On what operating system are you experiencing the issue?

Windows, Mac OSX

Pull Request

• I would like to do a Pull Request

Code of Conduct

• I agree to follow this project's Code of Conduct