Testing with bUnit in depth – Blazor in depth (W8, lesson 8)

What you learn in this lesson

give a component its render mode and renderer behavior (SetRendererInfo, assigned mode) and know the order trap

fake JavaScript interop with BunitJSInterop and modules and check what the component calls and cleans up

set up sign-in and roles with AddAuthorization and check navigation through BunitNavigationManager

use cascading values, templates with generics, additional attributes and stubs in tests of the library

test asynchronous states with TaskCompletionSource, WaitForState and WaitForAssertion and say what bUnit does not see

K2 introduced bUnit in lesson 2.7.6 far enough that a contact's row, the booking and the week calendar are tested. A Blazor Web App for production has more that a test must set up: which render mode the component runs in, who is signed in, what it calls in the browser, what it waits for. This lesson goes through these points and says for each where bUnit stops. The components appear in the smallest form that the respective test needs.

Where the Kladde stands

The lesson presupposes K2's lessons 2.7.6 ("Component tests with bUnit") and 2.7.7 ("An end-to-end test with Playwright"), plus from W8 "A component library and a design system" (Kladde.UI), "Sign-in across render modes", "Forms and validation at scale" and "JavaScript interop done right". The test project is tests/Kladde.Web.Tests with xUnit 3, Shouldly and the package bunit. In Kladde.UI stand KButton, KDialog and KTable<TItem> here, in Kladde.Web/Components StaffPanel, RenderInfoBadge, ContactForm, DeleteContact and AppointmentCount. Your components from the other lessons may look different: keep your names and carry the steps over.

What you learn in this lesson

Where the Kladde stands

This lesson belongs to course W8