bUnit 找不到与给定选择器匹配的元素

Question

Using .net 6, bUnit 1.13.5 Mudblazor 6.0.17

I am trying to write unit tests for a razor component that is in a dialog box and bUnit is unable to find any of the components or class/ids in it. I am getting the following error...

Message: Bunit.ElementNotFoundException: No elements were found that matches the selector '#CancelButton'

in the ColumnTrackerEditDialog.razor there is the following line

        <MudButton id="CancelButton" OnClick="@Cancel">Cancel</MudButton>

This should always be rendered and it not under any conditional statements. The unit test for this is as follows (so far)

        [Test]
        public async Task ColumnTrackerEditDialogUITest_CancelButton()
        {
            var item = GetColumnTrackerPeco();

            PopulateData(item);

            var page = TestContext!.RenderComponent<ColumnTrackerEditDialog>(parameters =>
                parameters.Add(p => p.Item, item));
            Assert.IsNotNull(page);

            var cancelButton = page.Find("#CancelButton");
            Assert.IsNotNull(cancelButton);
            cancelButton.Click();
        }

The test set up is fine as the page is not null and on non dialog pages I can find elements by ids, classes or components.

Is this an issue because it's a dialog or am I missing something else?

I have tried to find "button", ".mud-button" and other classes, as well as.FindComponent and other tags within the component and it's not finding anything.

Answer 1

Is the component being added asynchronously? If that's the case, try using cut.WaitForElement("#CancelButton") instead.

Another approach is to stub out the MudBlazor component, so it's not directly influences your test, and instead find the stub and assert you passed the expected parameters to it. Learn more here: https://bunit.dev/docs/providing-input/substituting-components