Support for rendering a Blazor Component to a verified file via Blazor rendering.
Verify.Blazor uses the Blazor APIs to take a snapshot (metadata and html) of the current state of a Blazor component. It has fewer dependencies and is a simpler API than Verify.Bunit approach, however it does not provide many of the other features, for example trigger event handlers.
See Milestones for release notes.
Entity Framework Extensions is a major sponsor and is proud to contribute to the development this project.
The below samples use the following Component:
<div>
<h1>@Title</h1>
<p>@Person.Name</p>
<button>MyButton</button>
</div>
@code {
[Parameter]
public string Title { get; set; } = "My Test Component";
[Parameter]
public Person Person { get; set; }
public bool Intitialized;
protected override Task OnInitializedAsync()
{
Intitialized = true;
return Task.CompletedTask;
}
}This test:
[Fact]
public Task PassingParameters()
{
var parameters = ParameterView.FromDictionary(
new Dictionary<string, object?>
{
{
"Title", "The Title"
},
{
"Person", new Person
{
Name = "Sam"
}
}
});
var target = Render.Component<TestComponent>(parameters: parameters);
return Verify(target);
}This test:
[Fact]
public Task PassingTemplateInstance()
{
var template = new TestComponent
{
Title = "The Title",
Person = new()
{
Name = "Sam"
}
};
var target = Render.Component(template: template);
return Verify(target);
}Both will produce:
The component rendered as html ...verified.html:
<div>
<h1>The Title</h1>
<p>Sam</p>
<button>MyButton</button>
</div>And the current model rendered as txt ...verified.txt:
{
Instance: {
Intitialized: true,
Title: The Title,
Person: {
Name: Sam
}
}
}In Blazor an integrity check is applied to the dotnet.*.js file.
<script src="_framework/dotnet.5.0.2.js" defer="" integrity="sha256-AQfZ6sKmq4EzOxN3pymKJ1nlGQaneN66/2mcbArnIJ8=" crossorigin="anonymous"></script>
This line will change when the dotnet SDK is updated.
Blazor uses <!--!--> to delineate components in the resulting html. Some empty lines can be rendered when components are stitched together.
// remove some noise from the html snapshot
VerifierSettings.ScrubEmptyLines();
BlazorScrubber.ScrubCommentLines();
VerifierSettings.ScrubLinesWithReplace(
line =>
{
var scrubbed = line.Replace("<!--!-->", "");
if (string.IsNullOrWhiteSpace(scrubbed))
{
return null;
}
return scrubbed;
});
HtmlPrettyPrint.All();
VerifierSettings.ScrubLinesContaining("<script src=\"_framework/dotnet.");Helmet designed by Leonidas Ikonomou from The Noun Project.