I have a simple Blazor Component that renders a string and a test that checks the html content is rendered when the component is rendered.
However – if I change the line with the markup string @(new MarkupString(TextContent)) to use use the raw string @TextContent then the test still passes, even though when I look at the output in the running application the html foramtting is not applied (as you’d expect, the raw html is shown on the page rather than the stlyed content). Even though it displays differently to the user, the bUnit test gets the exact same string back in both cases.
So how can I modify this test so that the raw output fails the test while the MarkupString version still passes?
<div class="text-content">
@if (!string.IsNullEmptyOrWhitespace(TextContent))
{
@(new MarkupString(TextContent))
}
</div>
@code {
[Parameter]
public string TextContent { get; set; } = "";
}
[Test]
[TestCase("<h1>Content Here</h1>")]
[TestCase("Content Here")]
[TestCase("This is some content with a <strong>bold</strong> bit in it.")]
public async Task TextCanContainHtmlFormatting(string content)
{
var context = new TestContext();
var cut = context.RenderComponent<TextComponent>(parameters =>
{
parameters.Add(s => s.TextContent, content);
});
var textDiv = cut.Find(".text-content");
Assert.AreEqual(content, textDiv.InnerHtml, "should have the html text content");
}