test pipeline for Blazor

.gitlab-ci.yml

@@ -28,7 +28,7 @@ frontend:
     - dotnet build
 
 # Define the job for running the tests
-test:
+backend-test:
   stage: test
   image: golang:1.17.4-alpine3.14
   services:
@@ -51,3 +51,12 @@ test:
     - export DB_NAME=$POSTGRES_DB
   script:
     - go test -v ./...
+
+frontend-test:
+  stage: test
+  image: mcr.microsoft.com/dotnet/sdk:6.0
+  before_script:
+    - cd src/PanoptesTest
+    - dotnet restore
+  script:
+    - dotnet test

src/PanoptesFrontend/PanoptesFrontend.csproj

@@ -8,6 +8,9 @@
 
   <ItemGroup>
     <PackageReference Include="Blazor-ApexCharts" Version="0.9.20-beta" />
+    <PackageReference Include="Bunit" Version="1.19.14" />
+    <PackageReference Include="Microsoft.NET.Test.Sdk" Version="17.5.0" />
+    <PackageReference Include="Moq" Version="4.18.4" />
     <PackageReference Include="xunit" Version="2.4.2" />
   </ItemGroup>
 

src/PanoptesTest/Counter.razor

@@ -0,0 +1,16 @@
+<h1>Counter</h1>
+
+<p>
+    Current count: @currentCount
+</p>
+
+<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>
+
+@code {
+    int currentCount = 0;
+
+    void IncrementCount()
+    {
+        currentCount++;
+    }
+}

src/PanoptesTest/CounterCSharpTests.cs

@@ -0,0 +1,31 @@
+namespace PanoptesTest;
+
+/// <summary>
+/// These tests are written entirely in C#.
+/// Learn more at https://bunit.dev/docs/getting-started/writing-tests.html#creating-basic-tests-in-cs-files
+/// </summary>
+public class CounterCSharpTests : TestContext
+{
+	[Fact]
+	public void CounterStartsAtZero()
+	{
+		// Arrange
+		var cut = RenderComponent<Counter>();
+
+		// Assert that content of the paragraph shows counter at zero
+		cut.Find("p").MarkupMatches("<p>Current count: 0</p>");
+	}
+
+	[Fact]
+	public void ClickingButtonIncrementsCounter()
+	{
+		// Arrange
+		var cut = RenderComponent<Counter>();
+
+		// Act - click button to increment counter
+		cut.Find("button").Click();
+
+		// Assert that the counter was incremented
+		cut.Find("p").MarkupMatches("<p>Current count: 1</p>");
+	}
+}

src/PanoptesTest/CounterRazorTests.razor

@@ -0,0 +1,29 @@
+@inherits TestContext
+
+These tests are written entirely in razor and C# syntax.
+
+Learn more at https://bunit.dev/docs/getting-started/writing-tests.html#creating-basic-tests-in-razor-files
+
+@code {
+    [Fact]
+	public void CounterStartsAtZero()
+	{
+		// Arrange
+		var cut = Render(@<Counter />);
+
+		// Assert that content of the paragraph shows counter at zero
+		cut.Find("p").MarkupMatches(@<p>Current count: 0</p>);
+	}
+    [Fact]
+	public void ClickingButtonIncrementsCounter()
+	{
+		// Arrange
+		var cut = Render(@<Counter />);
+
+		// Act - click button to increment counter
+		cut.Find("button").Click();
+
+		// Assert that the counter was incremented
+		cut.Find("p").MarkupMatches(@<p>Current count: 1</p>);
+	}
+}

src/PanoptesTest/PanoptesTest.csproj

@@ -0,0 +1,40 @@
+<Project Sdk="Microsoft.NET.Sdk.Razor">
+
+	<PropertyGroup>
+		<TargetFramework>net6.0</TargetFramework>
+		<Nullable>enable</Nullable>
+		<IsPackable>false</IsPackable>
+	</PropertyGroup>
+
+	<ItemGroup>
+		<Using Include="Bunit" />
+		<Using Include="Bunit.TestDoubles" />
+		<Using Include="Microsoft.Extensions.DependencyInjection" />
+		<Using Include="Xunit" />
+	</ItemGroup>
+
+	<ItemGroup>
+		<PackageReference Include="bunit" Version="1.19.14" />
+		<PackageReference Include="Microsoft.NET.Test.Sdk" Version="17.5.0" />
+		<PackageReference Include="coverlet.collector" Version="3.1.0">
+			<IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
+			<PrivateAssets>all</PrivateAssets>
+		</PackageReference>
+		<PackageReference Include="RichardSzalay.MockHttp" Version="6.0.0" />
+	</ItemGroup>
+
+	<ItemGroup>
+		<PackageReference Include="xunit" Version="2.4.2" />
+		<PackageReference Include="xunit.runner.visualstudio" Version="2.4.5">
+			<IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
+			<PrivateAssets>all</PrivateAssets>
+		</PackageReference>
+	</ItemGroup>
+
+	<ItemGroup>
+	  <ProjectReference Include="..\PanoptesFrontend\PanoptesFrontend.csproj" />
+	</ItemGroup>
+
+
+
+</Project>

src/PanoptesTest/_Imports.razor

@@ -0,0 +1,9 @@
+@using Microsoft.AspNetCore.Components.Web
+@using Microsoft.JSInterop
+@using Microsoft.Extensions.DependencyInjection
+@using Bunit
+@using Bunit.TestDoubles
+@using Xunit
+@using System.Net;
+@using System.Net.Http;
+@using System.Threading.Tasks;

src/PanoptesTest/bin/Debug/net6.0/PanoptesFrontend.runtimeconfig.json

@@ -0,0 +1,19 @@
+{
+  "runtimeOptions": {
+    "tfm": "net6.0",
+    "frameworks": [
+      {
+        "name": "Microsoft.NETCore.App",
+        "version": "6.0.0"
+      },
+      {
+        "name": "Microsoft.AspNetCore.App",
+        "version": "6.0.0"
+      }
+    ],
+    "configProperties": {
+      "System.GC.Server": true,
+      "System.Runtime.Serialization.EnableUnsafeBinaryFormatterSerialization": false
+    }
+  }
+}

src/PanoptesTest/bin/Debug/net6.0/PanoptesFrontend.staticwebassets.runtime.json

@@ -0,0 +1 @@
+{"ContentRoots":["C:\\Users\\user\\Documents\\Panoptes\\2023-ca400-murphg62-byrnm257\\src\\PanoptesFrontend\\wwwroot\\","C:\\Users\\user\\.nuget\\packages\\microsoft.aspnetcore.components.webassembly.authentication\\6.0.0\\staticwebassets\\","C:\\Users\\user\\.nuget\\packages\\blazor-apexcharts\\0.9.20-beta\\staticwebassets\\","C:\\Users\\user\\Documents\\Panoptes\\2023-ca400-murphg62-byrnm257\\src\\PanoptesFrontend\\obj\\Debug\\net6.0\\scopedcss\\bundle\\"],"Root":{"Children":{"css":{"Children":{"bootstrap":{"Children":{"bootstrap.min.css":{"Children":null,"Asset":{"ContentRootIndex":0,"SubPath":"css/bootstrap/bootstrap.min.css"},"Patterns":null},"bootstrap.min.css.map":{"Children":null,"Asset":{"ContentRootIndex":0,"SubPath":"css/bootstrap/bootstrap.min.css.map"},"Patterns":null}},"Asset":null,"Patterns":null},"open-iconic":{"Children":{"FONT-LICENSE":{"Children":null,"Asset":{"ContentRootIndex":0,"SubPath":"css/open-iconic/FONT-LICENSE"},"Patterns":null},"font":{"Children":{"css":{"Children":{"open-iconic-bootstrap.min.css":{"Children":null,"Asset":{"ContentRootIndex":0,"SubPath":"css/open-iconic/font/css/open-iconic-bootstrap.min.css"},"Patterns":null}},"Asset":null,"Patterns":null},"fonts":{"Children":{"open-iconic.eot":{"Children":null,"Asset":{"ContentRootIndex":0,"SubPath":"css/open-iconic/font/fonts/open-iconic.eot"},"Patterns":null},"open-iconic.otf":{"Children":null,"Asset":{"ContentRootIndex":0,"SubPath":"css/open-iconic/font/fonts/open-iconic.otf"},"Patterns":null},"open-iconic.svg":{"Children":null,"Asset":{"ContentRootIndex":0,"SubPath":"css/open-iconic/font/fonts/open-iconic.svg"},"Patterns":null},"open-iconic.ttf":{"Children":null,"Asset":{"ContentRootIndex":0,"SubPath":"css/open-iconic/font/fonts/open-iconic.ttf"},"Patterns":null},"open-iconic.woff":{"Children":null,"Asset":{"ContentRootIndex":0,"SubPath":"css/open-iconic/font/fonts/open-iconic.woff"},"Patterns":null}},"Asset":null,"Patterns":null}},"Asset":null,"Patterns":null},"ICON-LICENSE":{"Children":null,"Asset":{"ContentRootIndex":0,"SubPath":"css/open-iconic/ICON-LICENSE"},"Patterns":null},"README.md":{"Children":null,"Asset":{"ContentRootIndex":0,"SubPath":"css/open-iconic/README.md"},"Patterns":null}},"Asset":null,"Patterns":null},"site.css":{"Children":null,"Asset":{"ContentRootIndex":0,"SubPath":"css/site.css"},"Patterns":null}},"Asset":null,"Patterns":null},"favicon.ico":{"Children":null,"Asset":{"ContentRootIndex":0,"SubPath":"favicon.ico"},"Patterns":null},"_content":{"Children":{"Microsoft.AspNetCore.Components.WebAssembly.Authentication":{"Children":{"AuthenticationService.js":{"Children":null,"Asset":{"ContentRootIndex":1,"SubPath":"AuthenticationService.js"},"Patterns":null}},"Asset":null,"Patterns":null},"Blazor-ApexCharts":{"Children":{"css":{"Children":{"apexcharts.css":{"Children":null,"Asset":{"ContentRootIndex":2,"SubPath":"css/apexcharts.css"},"Patterns":null}},"Asset":null,"Patterns":null},"js":{"Children":{"apex-charts.min.js":{"Children":null,"Asset":{"ContentRootIndex":2,"SubPath":"js/apex-charts.min.js"},"Patterns":null},"blazor-apex-charts.js":{"Children":null,"Asset":{"ContentRootIndex":2,"SubPath":"js/blazor-apex-charts.js"},"Patterns":null}},"Asset":null,"Patterns":null}},"Asset":null,"Patterns":null}},"Asset":null,"Patterns":null},"PanoptesFrontend.styles.css":{"Children":null,"Asset":{"ContentRootIndex":3,"SubPath":"PanoptesFrontend.styles.css"},"Patterns":null}},"Asset":null,"Patterns":[{"ContentRootIndex":0,"Pattern":"**","Depth":0}]}}

src/PanoptesTest/bin/Debug/net6.0/PanoptesTest.runtimeconfig.json

@@ -0,0 +1,15 @@
+{
+  "runtimeOptions": {
+    "tfm": "net6.0",
+    "frameworks": [
+      {
+        "name": "Microsoft.NETCore.App",
+        "version": "6.0.0"
+      },
+      {
+        "name": "Microsoft.AspNetCore.App",
+        "version": "6.0.0"
+      }
+    ]
+  }
+}

src/PanoptesTest/bin/Debug/net6.0/PanoptesTest.staticwebassets.runtime.json

@@ -0,0 +1 @@
+{"ContentRoots":["C:\\Users\\user\\.nuget\\packages\\microsoft.aspnetcore.components.webassembly.authentication\\6.0.0\\staticwebassets\\","C:\\Users\\user\\.nuget\\packages\\blazor-apexcharts\\0.9.20-beta\\staticwebassets\\","C:\\Users\\user\\Documents\\Panoptes\\2023-ca400-murphg62-byrnm257\\src\\PanoptesFrontend\\obj\\Debug\\net6.0\\scopedcss\\projectbundle\\","C:\\Users\\user\\Documents\\Panoptes\\2023-ca400-murphg62-byrnm257\\src\\PanoptesFrontend\\wwwroot\\","C:\\Users\\user\\Documents\\Panoptes\\2023-ca400-murphg62-byrnm257\\src\\PanoptesTest\\obj\\Debug\\net6.0\\scopedcss\\bundle\\"],"Root":{"Children":{"_content":{"Children":{"Microsoft.AspNetCore.Components.WebAssembly.Authentication":{"Children":{"AuthenticationService.js":{"Children":null,"Asset":{"ContentRootIndex":0,"SubPath":"AuthenticationService.js"},"Patterns":null}},"Asset":null,"Patterns":null},"Blazor-ApexCharts":{"Children":{"css":{"Children":{"apexcharts.css":{"Children":null,"Asset":{"ContentRootIndex":1,"SubPath":"css/apexcharts.css"},"Patterns":null}},"Asset":null,"Patterns":null},"js":{"Children":{"apex-charts.min.js":{"Children":null,"Asset":{"ContentRootIndex":1,"SubPath":"js/apex-charts.min.js"},"Patterns":null},"blazor-apex-charts.js":{"Children":null,"Asset":{"ContentRootIndex":1,"SubPath":"js/blazor-apex-charts.js"},"Patterns":null}},"Asset":null,"Patterns":null}},"Asset":null,"Patterns":null},"PanoptesFrontend":{"Children":{"PanoptesFrontend.bundle.scp.css":{"Children":null,"Asset":{"ContentRootIndex":2,"SubPath":"PanoptesFrontend.bundle.scp.css"},"Patterns":null},"css":{"Children":{"bootstrap":{"Children":{"bootstrap.min.css":{"Children":null,"Asset":{"ContentRootIndex":3,"SubPath":"css/bootstrap/bootstrap.min.css"},"Patterns":null},"bootstrap.min.css.map":{"Children":null,"Asset":{"ContentRootIndex":3,"SubPath":"css/bootstrap/bootstrap.min.css.map"},"Patterns":null}},"Asset":null,"Patterns":null},"open-iconic":{"Children":{"FONT-LICENSE":{"Children":null,"Asset":{"ContentRootIndex":3,"SubPath":"css/open-iconic/FONT-LICENSE"},"Patterns":null},"font":{"Children":{"css":{"Children":{"open-iconic-bootstrap.min.css":{"Children":null,"Asset":{"ContentRootIndex":3,"SubPath":"css/open-iconic/font/css/open-iconic-bootstrap.min.css"},"Patterns":null}},"Asset":null,"Patterns":null},"fonts":{"Children":{"open-iconic.eot":{"Children":null,"Asset":{"ContentRootIndex":3,"SubPath":"css/open-iconic/font/fonts/open-iconic.eot"},"Patterns":null},"open-iconic.otf":{"Children":null,"Asset":{"ContentRootIndex":3,"SubPath":"css/open-iconic/font/fonts/open-iconic.otf"},"Patterns":null},"open-iconic.svg":{"Children":null,"Asset":{"ContentRootIndex":3,"SubPath":"css/open-iconic/font/fonts/open-iconic.svg"},"Patterns":null},"open-iconic.ttf":{"Children":null,"Asset":{"ContentRootIndex":3,"SubPath":"css/open-iconic/font/fonts/open-iconic.ttf"},"Patterns":null},"open-iconic.woff":{"Children":null,"Asset":{"ContentRootIndex":3,"SubPath":"css/open-iconic/font/fonts/open-iconic.woff"},"Patterns":null}},"Asset":null,"Patterns":null}},"Asset":null,"Patterns":null},"ICON-LICENSE":{"Children":null,"Asset":{"ContentRootIndex":3,"SubPath":"css/open-iconic/ICON-LICENSE"},"Patterns":null},"README.md":{"Children":null,"Asset":{"ContentRootIndex":3,"SubPath":"css/open-iconic/README.md"},"Patterns":null}},"Asset":null,"Patterns":null},"site.css":{"Children":null,"Asset":{"ContentRootIndex":3,"SubPath":"css/site.css"},"Patterns":null}},"Asset":null,"Patterns":null},"favicon.ico":{"Children":null,"Asset":{"ContentRootIndex":3,"SubPath":"favicon.ico"},"Patterns":null}},"Asset":null,"Patterns":[{"ContentRootIndex":3,"Pattern":"**","Depth":2}]}},"Asset":null,"Patterns":null},"PanoptesTest.styles.css":{"Children":null,"Asset":{"ContentRootIndex":4,"SubPath":"PanoptesTest.styles.css"},"Patterns":null}},"Asset":null,"Patterns":null}}

src/PanoptesTest/bin/Debug/net6.0/appsettings.Development.json

@@ -0,0 +1,9 @@
+{
+  "DetailedErrors": true,
+  "Logging": {
+    "LogLevel": {
+      "Default": "Information",
+      "Microsoft.AspNetCore": "Warning"
+    }
+  }
+}

src/PanoptesTest/bin/Debug/net6.0/appsettings.json

@@ -0,0 +1,9 @@
+{
+  "Logging": {
+    "LogLevel": {
+      "Default": "Information",
+      "Microsoft.AspNetCore": "Warning"
+    }
+  },
+  "AllowedHosts": "*"
+}