bunit-test-migration
Migrate bUnit test files from deprecated beta API (1.0.0-beta-10) to bUnit 2.x stable API. Use this when working on .razor test files in BlazorWebFormsComponents.Test that contain old patterns like TestComponentBase, Fixture, or SnapshotTest.
Install
mkdir -p .claude/skills/bunit-test-migration && curl -L -o skill.zip "https://mcp.directory/api/skills/download/2856" && unzip -o skill.zip -d .claude/skills/bunit-test-migration && rm skill.zipInstalls to .claude/skills/bunit-test-migration
About this skill
bUnit Test Migration Skill (Beta → 2.x)
This skill provides guidance for migrating test files from the deprecated bUnit 1.0.0-beta-10 API to bUnit 2.5.3 stable API. Use this when you encounter test files using the old TestComponentBase, <Fixture>, or <SnapshotTest> patterns.
When to Apply
Apply this skill when a .razor test file contains any of these patterns:
@inherits TestComponentBase<Fixture Test="..."><ComponentUnderTest><SnapshotTest>void MethodName(Fixture fixture)
Transformation Rules
1. Change Inheritance
- @inherits TestComponentBase
+ @inherits BunitContext
2. Remove Wrapper Elements
Remove these XML elements entirely (keep only the component inside):
- <Fixture Test="TestName">
- <ComponentUnderTest>
<MyComponent Parameter="value" />
- </ComponentUnderTest>
- </Fixture>
3. Convert Test Methods
- void TestMethodName(Fixture fixture)
+ [Fact]
+ public void ComponentName_Scenario_ExpectedResult()
4. Replace Component Access
- var cut = fixture.GetComponentUnderTest();
+ var cut = Render(@<MyComponent Parameter="value" />);
5. Convert Snapshot Tests
- <SnapshotTest Description="renders correctly">
- <TestInput>
- <MyComponent />
- </TestInput>
- <ExpectedOutput>
- <div>expected html</div>
- </ExpectedOutput>
- </SnapshotTest>
+ [Fact]
+ public void MyComponent_Default_RendersCorrectly()
+ {
+ var cut = Render(@<MyComponent />);
+ cut.MarkupMatches(@<div>expected html</div>);
+ }
Complete Example
Before
@inherits TestComponentBase
<Fixture Test="ShouldClickButton">
<ComponentUnderTest>
<Button OnClick="OnClick">Click me</Button>
</ComponentUnderTest>
</Fixture>
@code {
int ClickCount = 0;
void ShouldClickButton(Fixture fixture)
{
var cut = fixture.GetComponentUnderTest();
cut.Find("button").Click();
ClickCount.ShouldBe(1);
}
void OnClick() => ClickCount++;
}
After
@inherits BunitContext
@code {
int ClickCount = 0;
[Fact]
public void Button_Click_IncrementsCounter()
{
var cut = Render(@<Button OnClick="OnClick">Click me</Button>);
cut.Find("button").Click();
ClickCount.ShouldBe(1);
}
void OnClick() => ClickCount++;
}
Test Naming Convention
Pattern: ComponentName_Scenario_ExpectedResult
| Component | Scenario | Result | Test Name |
|---|---|---|---|
| Button | Click | InvokesHandler | Button_Click_InvokesHandler |
| DataList | EmptySource | ShowsEmptyTemplate | DataList_EmptySource_ShowsEmptyTemplate |
| GridView | WithData | RendersRows | GridView_WithData_RendersRows |
Special Patterns
Multiple Tests in One File
Each <Fixture> block becomes a separate [Fact] method:
@inherits BunitContext
@code {
[Fact]
public void Component_FirstScenario_ExpectedResult() { ... }
[Fact]
public void Component_SecondScenario_ExpectedResult() { ... }
}
Tests with Services
@code {
[Fact]
public void Component_WithService_Works()
{
Services.AddSingleton<IMyService>(new FakeService());
var cut = Render(@<MyComponent />);
}
}
Authentication Tests
@code {
[Fact]
public void SecureComponent_AuthenticatedUser_ShowsContent()
{
var authContext = this.AddTestAuthorization();
authContext.SetAuthorized("TestUser");
authContext.SetRoles("Admin");
var cut = Render(@<SecureComponent />);
}
}
Tests Requiring New TestContext
For tests that need isolated context (e.g., multiple renders):
@code {
[Fact]
public void Component_MultipleRenders_WorksCorrectly()
{
using var ctx = new Bunit.TestContext();
var cut1 = ctx.Render(@<MyComponent Value="1" />);
var cut2 = ctx.Render(@<MyComponent Value="2" />);
cut1.Find("span").TextContent.ShouldBe("1");
cut2.Find("span").TextContent.ShouldBe("2");
}
}
Tests with xUnit Logger (Optional)
For debugging complex tests, you can optionally enable xUnit logging:
@using Microsoft.Extensions.Logging
@code {
private ILogger<MyTest> _logger;
public MyTest(ITestOutputHelper output) : base(output)
{
}
[Fact]
public void Component_ComplexScenario_WorksAsExpected()
{
_logger = Services.GetService<ILogger<MyTest>>();
_logger?.LogInformation("Starting test");
var cut = Render(@<MyComponent />);
_logger?.LogDebug("Component rendered");
// Test assertions...
}
}
Note: Only add logging when diagnostic output is helpful. Most tests should remain simple without logging.
Quick Reference Table
| Old Pattern | New Pattern |
|---|---|
@inherits TestComponentBase | @inherits BunitContext |
<Fixture Test="Name"> | Remove |
<ComponentUnderTest> | Remove |
<SnapshotTest> | [Fact] method with MarkupMatches() |
void Name(Fixture fixture) | [Fact] public void Name() |
fixture.GetComponentUnderTest() | Render(@<Component />) |
fixture.GetComponentUnderTest<T>() | Render<T>(@<Component />) |
Verification
After migrating a file, verify with:
# Build check
dotnet build src/BlazorWebFormsComponents.Test --no-restore
# List discovered tests
dotnet test src/BlazorWebFormsComponents.Test --list-tests --filter "FullyQualifiedName~ComponentName"
# Run tests
dotnet test src/BlazorWebFormsComponents.Test --filter "FullyQualifiedName~ComponentName"
Common Errors
| Error | Cause | Fix |
|---|---|---|
CS0246: TestComponentBase not found | Old inheritance | Change to @inherits BunitContext |
CS0103: Fixture does not exist | Old wrapper element | Remove <Fixture> tags |
No tests discovered | Missing [Fact] attribute | Add [Fact] to test methods |
Method must be public | Private test method | Add public modifier |
More by FritzAndFriends
View all skills by FritzAndFriends →You might also like
flutter-development
aj-geddes
Build beautiful cross-platform mobile apps with Flutter and Dart. Covers widgets, state management with Provider/BLoC, navigation, API integration, and material design.
drawio-diagrams-enhanced
jgtolentino
Create professional draw.io (diagrams.net) diagrams in XML format (.drawio files) with integrated PMP/PMBOK methodologies, extensive visual asset libraries, and industry-standard professional templates. Use this skill when users ask to create flowcharts, swimlane diagrams, cross-functional flowcharts, org charts, network diagrams, UML diagrams, BPMN, project management diagrams (WBS, Gantt, PERT, RACI), risk matrices, stakeholder maps, or any other visual diagram in draw.io format. This skill includes access to custom shape libraries for icons, clipart, and professional symbols.
ui-ux-pro-max
nextlevelbuilder
"UI/UX design intelligence. 50 styles, 21 palettes, 50 font pairings, 20 charts, 8 stacks (React, Next.js, Vue, Svelte, SwiftUI, React Native, Flutter, Tailwind). Actions: plan, build, create, design, implement, review, fix, improve, optimize, enhance, refactor, check UI/UX code. Projects: website, landing page, dashboard, admin panel, e-commerce, SaaS, portfolio, blog, mobile app, .html, .tsx, .vue, .svelte. Elements: button, modal, navbar, sidebar, card, table, form, chart. Styles: glassmorphism, claymorphism, minimalism, brutalism, neumorphism, bento grid, dark mode, responsive, skeuomorphism, flat design. Topics: color palette, accessibility, animation, layout, typography, font pairing, spacing, hover, shadow, gradient."
godot
bfollington
This skill should be used when working on Godot Engine projects. It provides specialized knowledge of Godot's file formats (.gd, .tscn, .tres), architecture patterns (component-based, signal-driven, resource-based), common pitfalls, validation tools, code templates, and CLI workflows. The `godot` command is available for running the game, validating scripts, importing resources, and exporting builds. Use this skill for tasks involving Godot game development, debugging scene/resource files, implementing game systems, or creating new Godot components.
nano-banana-pro
garg-aayush
Generate and edit images using Google's Nano Banana Pro (Gemini 3 Pro Image) API. Use when the user asks to generate, create, edit, modify, change, alter, or update images. Also use when user references an existing image file and asks to modify it in any way (e.g., "modify this image", "change the background", "replace X with Y"). Supports both text-to-image generation and image-to-image editing with configurable resolution (1K default, 2K, or 4K for high resolution). DO NOT read the image file first - use this skill directly with the --input-image parameter.
fastapi-templates
wshobson
Create production-ready FastAPI projects with async patterns, dependency injection, and comprehensive error handling. Use when building new FastAPI applications or setting up backend API projects.
Related MCP Servers
Browse all serversEnhance software testing with Playwright MCP: Fast, reliable browser automation, an innovative alternative to Selenium s
Integrate with Gemini CLI for large-scale file analysis, secure code execution, and advanced context control using Googl
Run Python code online or compile Java programs easily with Code Runner. Test code in 30+ languages instantly in your br
Access LeetCode problems, user profiles, and community solutions for improved algorithm practice and LeetCode 75 contest
Manage GoLogin browser profiles via AI. Automate with GoLogin, Selenium for software testing, and browser automation stu
AI-ready access to Grafana UI: full React component library—TypeScript source, MDX docs, Storybook examples, tests, and
Stay ahead of the MCP ecosystem
Get weekly updates on new skills and servers.