[Unit Tests] Add Unit Tests in .razor files (#844)

* Add Razor Unit Tests

* Fix gitignore

.gitignore

@@ -400,6 +400,7 @@ FodyWeavers.xsd
 
 # Verify Test generated Files
 *.received.html
+*.received.razor.html
 
 # Specific files, typically generated by tools
 *.cobertura.xml

tests/Core/Button/FluentButtonRazorTests.razor

@@ -0,0 +1,31 @@
+@using Xunit;
+@inherits TestContext
+@code
+{
+    [Fact]
+    public void FluentButton_Title()
+    {
+        // Arrange && Act
+        var cut = Render(@<FluentButton Title="My Title">My button</FluentButton>);
+
+        // Assert
+        cut.Verify();
+    }
+
+    [Fact]
+    public void FluentButton_OnClick()
+    {
+        bool clicked = false;
+
+        // Arrange
+        var cut = Render(@<FluentButton OnClick="@(e => { clicked = true; } )">
+                             My button
+                          </FluentButton>);
+
+        // Act
+        cut.Find("fluent-button").Click();
+
+        // Assert
+        Assert.True(clicked);
+    }
+}

tests/Core/Button/FluentButtonTests.cs

@@ -5,8 +5,10 @@
 
 namespace Microsoft.Fast.Components.FluentUI.Tests.Button;
 
-public class FluentButtonTests : TestBase
+public partial class FluentButtonTests : TestContext
 {
+    private TestContext TestContext => new(); // TODO: To remove and to use the `RenderComponent` inherited method.
+
     [Fact]
     public void FluentButton_Default()
     {
@@ -393,39 +395,6 @@ public void FluentButton_IconNoContent()
         cut.Verify();
     }
 
-    [Fact]
-    public void FluentButton_Title()
-    {
-        // Arrange && Act
-        var cut = TestContext.RenderComponent<FluentButton>(parameters =>
-        {
-            parameters.Add(p => p.Title, "My Title");
-            parameters.AddChildContent("My button");
-        });
-
-        // Assert
-        cut.Verify();
-    }
-
-    [Fact]
-    public void FluentButton_OnClick()
-    {
-        bool clicked = false;
-
-        // Arrange
-        var cut = TestContext.RenderComponent<FluentButton>(parameters =>
-        {
-            parameters.Add(p => p.OnClick, (e) => { clicked = true; });
-            parameters.AddChildContent("My button");
-        });
-
-        // Act
-        cut.Find("fluent-button").Click();
-
-        // Assert
-        Assert.True(clicked);
-    }
-
     [Fact]
     public void FluentButton_OnClick_Disabled()
     {

tests/Core/FluentAssert.cs

@@ -47,21 +47,27 @@ public static class FluentAssert
     /// <param name="filename"></param>
     /// <param name="memberName"></param>
     /// <exception cref="ArgumentNullException"></exception>
-    public static void Verify(this IRenderedFragment actual,
+    public static void Verify(this IRenderedFragment? actual,
         Func<string, string>? received = null,
         [CallerFilePath] string? filename = "",
         [CallerMemberName] string? memberName = "",
         string? suffix = UndefinedSuffix)
     {
+        if (actual is null)
+        {
+            return;
+        }
+
         // Valid?
         ArgumentNullException.ThrowIfNull(filename, nameof(filename));
         ArgumentNullException.ThrowIfNull(memberName, nameof(memberName));
 
         // Files
         var file = new FileInfo(filename);
+        var isRazor = file.Extension == ".razor";
         var memberFullName = GetMemberFullName(memberName, suffix);
-        var expectedFile = file.GetTargetFile(memberFullName, Options.VerifiedExtension);
-        var receivedFile = file.GetTargetFile(memberFullName, Options.ReceivedExtension);
+        var expectedFile = file.GetTargetFile(memberFullName, isRazor ? Options.VerifiedRazorExtension : Options.VerifiedCSharpExtension);
+        var receivedFile = file.GetTargetFile(memberFullName, isRazor ? Options.ReceivedRazorExtension : Options.ReceivedCSharpExtension);
         var htmlParser = actual.Services.GetRequiredService<BunitHtmlParser>();
 
         // Load "verified.html" file

tests/Core/FluentAssertOptions.cs

@@ -7,14 +7,28 @@ namespace Microsoft.Fast.Components.FluentUI.Tests;
 public class FluentAssertOptions
 {
     /// <summary>
-    /// Gets or sets default file extension used to identify an expected JSON file.
+    /// Gets or sets default file extension used to identify an expected HTML file,
+    /// generated from CS tests.
     /// </summary>
-    public string VerifiedExtension { get; set; } = ".verified.html";
+    public string VerifiedCSharpExtension { get; set; } = ".verified.html";
 
     /// <summary>
-    /// Gets or sets default file extension used to save a Card generated JSON file.
+    /// Gets or sets default file extension used to save a Card generated HTML file,
+    /// generated from CS tests.
     /// </summary>
-    public string ReceivedExtension { get; set; } = ".received.html";
+    public string ReceivedCSharpExtension { get; set; } = ".received.html";
+
+    /// <summary>
+    /// Gets or sets default file extension used to identify an expected HTML file,
+    /// generated from RAZOR tests.
+    /// </summary>
+    public string VerifiedRazorExtension { get; set; } = ".verified.razor.html";
+
+    /// <summary>
+    /// Gets or sets default file extension used to save a Card generated JSON file,
+    /// generated from RAZOR tests.
+    /// </summary>
+    public string ReceivedRazorExtension { get; set; } = ".received.razor.html";
 
     /// <summary>
     /// Scrub lines with an optional replace.

tests/Core/Microsoft.Fast.Components.FluentUI.Tests.csproj

@@ -1,4 +1,4 @@
-<Project Sdk="Microsoft.NET.Sdk">
+<Project Sdk="Microsoft.NET.Sdk.Razor">
 
   <PropertyGroup>
     <TargetFrameworks>net8.0</TargetFrameworks>
@@ -40,22 +40,25 @@
       <ParentFile>$([System.String]::Copy('%(FileName)').Split('.')[0])</ParentFile>
       <DependentUpon>%(ParentFile).cs</DependentUpon>
     </None>
+
     <None Include="**\*.received.html" />
-
     <None Update="**\*.received.html">
       <ParentFile>$([System.String]::Copy('%(FileName)').Split('.')[0])</ParentFile>
       <DependentUpon>%(ParentFile).cs</DependentUpon>
     </None>
 
-  </ItemGroup>
-
-  <ItemGroup>
-    <None Update="List\FluentPersonaTests.FluentOptionPeople_Initials.verified.html">
-      <DependentUpon>FluentPersonaTests.cs</DependentUpon>
+    <None Include="**\*.verified.razor.html" />
+    <None Update="**\*.verified.razor.html">
+      <ParentFile>$([System.String]::Copy('%(FileName)').Split('.')[0])</ParentFile>
+      <DependentUpon>%(ParentFile).razor</DependentUpon>
     </None>
-    <None Update="List\FluentPersonaTests.FluentOptionPeople_Image.verified.html">
-      <DependentUpon>FluentPersonaTests.cs</DependentUpon>
+
+    <None Include="**\*.received.razor.html" />
+    <None Update="**\*.received.razor.html">
+      <ParentFile>$([System.String]::Copy('%(FileName)').Split('.')[0])</ParentFile>
+      <DependentUpon>%(ParentFile).razor</DependentUpon>
     </None>
+
   </ItemGroup>
 
 </Project>

tests/Core/_Imports.razor

@@ -0,0 +1,9 @@
+@using Microsoft.AspNetCore.Components.Forms
+@using Microsoft.AspNetCore.Components.Web
+@using Microsoft.JSInterop
+@using Microsoft.Extensions.DependencyInjection
+@using AngleSharp.Dom
+@using Bunit
+@using Bunit.TestDoubles
+@using Microsoft.Fast.Components.FluentUI
+@using Microsoft.Fast.Components.FluentUI.Tests