bunit wait until OnInitializedAsync finishes before Asserting fields

Question

I have a blazor server component that load its customers into a table, it gets the customers in the OnInitializedAsync method. Is there a way to wait for the OnInitializedAsync to complete?

Component

<table>
    <thead>
    <tr>
        <th>Name</th>
        <th>Id</th>
    </tr>
    </thead>
    <tbody>
    @foreach (var customer in _customers)
    {
        <tr>
            <td>@customer.Name</td>
            <td>@customer.Id</td>
        </tr>
    }
    </tbody>
</table>

@code {
    IEnumerable<Customer> _customers = new List<Customer>();

    protected override async Task OnInitializedAsync()
    {
        _customers = await _customerService.GetCustomersAsync();
        StateHasChanged();
    }
}

I need my test to wait until this finishes to run my test.

var ctx = new TestContext();
ctx.Services.AddHttpContextAccessor();
ctx.Services.AddScoped<ICustomerService, CustomerServiceMock>();
var component = ctx.RenderComponent<Customers>();

var tableRows = component.FindAll("tr");
var buttons = component.FindAll("a");
var addButton = buttons.FirstOrDefault(b => b.OuterHtml.Contains("Add"));

component.WaitForAssertion(() => component.FindAll("td").Count.Equals(2));

var tds = component.FindAll("td");
var ths = component.FindAll("th");

// ASSERT
tableRows.Should().NotBeNull();
addButton.Should().NotBeNull();
tds.Count.Should().Be(2);
ths.Count.Should().Be(2);
ths[0].OuterHtml.Should().Be("<th>Name</th>");
ths[1].OuterHtml.Should().Be("<th>Id</th>");
tds[0].OuterHtml.Should().Be("<td>Customer XXX</td>");
tds[1].OuterHtml.Should().Be("<td>999</td>");

The test runs fine if I run it individually, but fails when I run all the tests together with error

Expected tds.Count to be 2, but found 0.

Mock

public class CustomerServiceMock : ICustomerServiceMock
{
    public async Task<IEnumerable<Customer>> GetCustomersAsync()
    {
        return new List<Customer>
        {
            await GetCustomer()
        };
    }

    private static async Task<Customer> GetCustomer()
    {
        return await Task.Run(() => new Customer
        {
            Id = 999,
            Name = "Customer XXX",
        });
    }
}

Answer 1

WaitForAssertion() needs something that throws instead of returning false.

//component.WaitForAssertion(() => component.FindAll("td").Count.Equals(2));

should become

component.WaitForAssertion(() => component.FindAll("td").Count.Should().Be(2));

or (better) use WaitForState()

component.WaitForState(() => component.FindAll("td").Count.Equals(2));