blazor-hexagonal

To separate UI logic from Blazor components, move state transitions and visibility logic into Presenter classes within a UI.Domain layer that has zero Blazor dependencies. This enables fully testable presenters while keeping .razor files thin and focused on rendering.

The best way to TDD Blazor frontend state machines is to write failing unit tests against Presenter classes using Fake Gateways. Implement minimal Presenter logic to pass tests for visibility, state transitions, and error scenarios, then wire a thin Blazor component to the Presenter.

Hexagonal frontend architecture in Blazor uses dependency injection by defining ports as interfaces and registering HTTP adapter gateways with AddHttpClient. Presenters remain pure by depending on these interfaces and are registered using AddScoped for proper component lifecycle management.

Yes, you can use Fake Gateways for fast, synchronous Blazor unit tests. Define ports as interfaces and implement Fake Gateways in your test project so presenters remain pure. This allows driving TDD workflows for visibility control and state machines without actual HTTP overhead.

To prevent memory leaks when binding Blazor components to Presenters, use InvokeAsync(StateHasChanged) for thread-safe UI updates and implement IDisposable in your components. This unsubscription pattern ensures that event handlers are detached when the Blazor component is disposed.

To handle form state safely without UI dependencies, use strongly typed field presenters with Valide types and Result<T> patterns. This ensures immutable form state and safe validation logic resides in the UI.Domain layer, completely decoupled from Blazor rendering concerns.