Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/VerifyTests/Verify.Blazor
Support for rendering a Blazor Component to a verified file via bunit or raw Blazor rendering.
https://github.com/VerifyTests/Verify.Blazor
blazor bunit snapshot-testing testing
Last synced: 3 months ago
JSON representation
Support for rendering a Blazor Component to a verified file via bunit or raw Blazor rendering.
- Host: GitHub
- URL: https://github.com/VerifyTests/Verify.Blazor
- Owner: VerifyTests
- License: mit
- Created: 2020-06-14T02:49:06.000Z (over 4 years ago)
- Default Branch: main
- Last Pushed: 2024-04-29T20:21:52.000Z (6 months ago)
- Last Synced: 2024-05-01T09:37:51.348Z (6 months ago)
- Topics: blazor, bunit, snapshot-testing, testing
- Language: C#
- Homepage:
- Size: 1.27 MB
- Stars: 31
- Watchers: 2
- Forks: 2
- Open Issues: 1
-
Metadata Files:
- Readme: readme.md
- Funding: .github/FUNDING.yml
- License: license.txt
- Code of conduct: code_of_conduct.md
Awesome Lists containing this project
- awesome-blazor - Verify.Blazor - a snapshot testing library for Blazor components -   A snapshot testing library for Blazor Components. Supports rendering Blazor Components to a snapshot file via bunit or via raw Blazor rendering. (Libraries & Extensions / 2D/3D Rendering engines)
README
# 
Verify.Blazor
[](https://github.com/orgs/VerifyTests/discussions)
[](https://ci.appveyor.com/project/SimonCropp/Verify-Blazor)
[](https://www.nuget.org/packages/Verify.Blazor/)
Support for rendering a [Blazor Component](https://docs.microsoft.com/en-us/aspnet/core/blazor/#components) 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](https://github.com/VerifyTests/Verify.Bunit), however it does not provide many of the other features, for example [trigger event handlers](https://bunit.egilhansen.com/docs/interaction/trigger-event-handlers.html).
**See [Milestones](../../milestones?state=closed) for release notes.**
## Component
The below samples use the following Component:
@Title
@Person.Name
MyButton
@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;
}
}
```
snippet source | anchor
## NuGet package
https://nuget.org/packages/Verify.Blazor/
## Usage
### Render using ParameterView
This test:
```cs
[Fact]
public Task PassingParameters()
{
var parameters = ParameterView.FromDictionary(
new Dictionary
{
{
"Title", "The Title"
},
{
"Person", new Person
{
Name = "Sam"
}
}
});
var target = Render.Component(parameters: parameters);
return Verify(target);
}
```
snippet source | anchor
### Render using template instance
This test:
```cs
[Fact]
public Task PassingTemplateInstance()
{
var template = new TestComponent
{
Title = "The Title",
Person = new()
{
Name = "Sam"
}
};
var target = Render.Component(template: template);
return Verify(target);
}
```
snippet source | anchor
### Result
Both will produce:
The component rendered as html `...verified.html`:
The Title
Sam
MyButton
```
snippet source | anchor
And the current model rendered as txt `...verified.txt`:
```txt
{
Instance: {
Intitialized: true,
Title: The Title,
Person: {
Name: Sam
}
}
}
```
snippet source | anchor
## Scrubbing
### Integrity check
In Blazor an integrity check is applied to the `dotnet.*.js` file.
```
```
This line will change when the dotnet SDK is updated.
### Noise in rendered template
Blazor uses `` to delineate components in the resulting html. Some empty lines can be rendered when components are stitched together.
### Resulting scrubbing
```cs
// 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("<a href='/src/Tests/ModuleInitializer.cs#L10-L29' title='Snippet source file'>snippet source</a> | <a href='#snippet-scrubbers' title='Start of snippet'>anchor</a></sup>
<!-- endSnippet -->
## Icon
[Helmet](https://thenounproject.com/term/helmet/9554/) designed
by [Leonidas Ikonomou](https://thenounproject.com/alterego) from [The Noun Project](https://thenounproject.com).