Add Identity Components to Blazor template (#50722)

# Add Identity Components to Blazor template

## Description

This adds the option to add Identity Razor Components (`*.razor` files) when using the Blazor project template. This supports the same feature set as the Identity Razor Pages (`*.cshtml` files). We've already done an accessibility pass over these newly added components and this PR includes all the fixes for Accessibility too. As with the Identity Razor Pages, this supports local authentication (with the option to configure external login providers) and Identity management using EF Core.

Fixes #48786

## Customer Impact

These Identity Razor Components have been a common request for years as noted above, because it allows Blazor developers to use Identity without needing to add Razor Pages infrastructure which would otherwise be unnecessary and doesn't integrate well with the rest of the app. For example, the Identity Razor Pages to a Blazor app would use a different layout that doesn't match the look and feel of the Razor Components that make up the rest of the app.

## Regression?

- [ ] Yes
- [x] No

## Risk

- [ ] High
- [ ] Medium
- [x] Low

These are template only changes that only affect the brand new Blazor project template. It should have no impact on the project template output unless you opt-in to the individual auth option (other than a [small fix](5462e42) to make the `--empty` option produce compileable output with all `InteractivityPlatform` options.)

## Verification

- [x] Manual (required)
- [x] Automated

We're also adding new validation scenarios for vendors to validate periodically.

## Packaging changes reviewed?

- [ ] Yes
- [ ] No
- [x] N/A

----

- [x] Finish user management components for 2fa, external login, personal data, etc...
- [x] Add signout link
- [x] Verify RegisterOnPersisting gets invoked as expected with the changes from #50625
- [x] Render ShowRecoveryCodes.razor inline rather than via a redirect.
- [x] Add baseline tests
- [x] Fix BOMs
- [x] Validate the template in VS

Author: halter73

src/ProjectTemplates/ProjectTemplates.slnf

@@ -65,8 +65,8 @@
       "src\\ProjectTemplates\\Web.ItemTemplates\\Microsoft.DotNet.Web.ItemTemplates.csproj",
       "src\\ProjectTemplates\\Web.ProjectTemplates\\Microsoft.DotNet.Web.ProjectTemplates.csproj",
       "src\\ProjectTemplates\\test\\Templates.Blazor.Tests\\Templates.Blazor.Tests.csproj",
-      "src\\ProjectTemplates\\test\\Templates.Blazor.WebAssembly.Tests\\Templates.Blazor.WebAssembly.Tests.csproj",
       "src\\ProjectTemplates\\test\\Templates.Blazor.WebAssembly.Auth.Tests\\Templates.Blazor.WebAssembly.Auth.Tests.csproj",
+      "src\\ProjectTemplates\\test\\Templates.Blazor.WebAssembly.Tests\\Templates.Blazor.WebAssembly.Tests.csproj",
       "src\\ProjectTemplates\\test\\Templates.Mvc.Tests\\Templates.Mvc.Tests.csproj",
       "src\\ProjectTemplates\\test\\Templates.Tests\\Templates.Tests.csproj",
       "src\\Razor\\Razor.Runtime\\src\\Microsoft.AspNetCore.Razor.Runtime.csproj",
@@ -95,4 +95,4 @@
       "src\\SignalR\\server\\SignalR\\src\\Microsoft.AspNetCore.SignalR.csproj"
     ]
   }
-}
+}

src/ProjectTemplates/Web.ProjectTemplates/BlazorWeb-CSharp.Client.csproj.in

@@ -12,6 +12,7 @@
 
   <ItemGroup>
     <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="${MicrosoftAspNetCoreComponentsWebAssemblyVersion}" />
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Authentication" Version="${MicrosoftAspNetCoreComponentsWebAssemblyAuthenticationVersion}" Condition="'$(IndividualLocalAuth)' == 'True'" />
   </ItemGroup>
 
 </Project>

src/ProjectTemplates/Web.ProjectTemplates/BlazorWeb-CSharp.csproj.in

@@ -4,16 +4,28 @@
     <TargetFramework>${DefaultNetCoreTargetFramework}</TargetFramework>
     <Nullable>enable</Nullable>
     <ImplicitUsings>enable</ImplicitUsings>
+    <UserSecretsId Condition="'$(IndividualLocalAuth)' == 'True'">aspnet-BlazorWeb-CSharp-53bc9b9d-9d6a-45d4-8429-2a2761773502</UserSecretsId>
     <NoDefaultLaunchSettingsFile Condition="'$(ExcludeLaunchSettings)' == 'True'">True</NoDefaultLaunchSettingsFile>
     <RootNamespace Condition="'$(name)' != '$(name{-VALUE-FORMS-}safe_namespace)'">BlazorWeb-CSharp</RootNamespace>
     <AssemblyName Condition="'$(name)' != '$(name{-VALUE-FORMS-}safe_namespace)'">`$(AssemblyName.Replace(' ', '_'))</AssemblyName>
   </PropertyGroup>
-  <!--#if UseWebAssembly -->
 
+  <!--#if (IndividualLocalAuth && !UseLocalDB) -->
   <ItemGroup>
-    <ProjectReference Include="..\BlazorWeb-CSharp.Client\BlazorWeb-CSharp.Client.csproj" />
-    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="${MicrosoftAspNetCoreComponentsWebAssemblyServerVersion}" />
+    <None Update="app.db" CopyToOutputDirectory="PreserveNewest" ExcludeFromSingleFile="true" />
   </ItemGroup>
+
   <!--#endif -->
+  <!--#if (UseWebAssembly || IndividualLocalAuth) -->
+  <ItemGroup>
+    <ProjectReference Include="..\BlazorWeb-CSharp.Client\BlazorWeb-CSharp.Client.csproj" Condition="'$(UseWebAssembly)' == 'True'" />
+    <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="${MicrosoftAspNetCoreComponentsWebAssemblyServerVersion}" Condition="'$(UseWebAssembly)' == 'True'" />
+    <PackageReference Include="Microsoft.AspNetCore.Diagnostics.EntityFrameworkCore" Version="${MicrosoftAspNetCoreDiagnosticsEntityFrameworkCoreVersion}" Condition="'$(IndividualLocalAuth)' == 'True'" />
+    <PackageReference Include="Microsoft.AspNetCore.Identity.EntityFrameworkCore" Version="${MicrosoftAspNetCoreIdentityEntityFrameworkCoreVersion}" Condition="'$(IndividualLocalAuth)' == 'True'" />
+    <PackageReference Include="Microsoft.EntityFrameworkCore.Sqlite" Version="${MicrosoftEntityFrameworkCoreSqliteVersion}" Condition="'$(IndividualLocalAuth)' == 'True' AND '$(UseLocalDB)' != 'True'" />
+    <PackageReference Include="Microsoft.EntityFrameworkCore.SqlServer" Version="${MicrosoftEntityFrameworkCoreSqlServerVersion}" Condition="'$(IndividualLocalAuth)' == 'True' AND '$(UseLocalDB)' == 'True'" />
+    <PackageReference Include="Microsoft.EntityFrameworkCore.Tools" Version="${MicrosoftEntityFrameworkCoreToolsVersion}" Condition="'$(IndividualLocalAuth)' == 'True'" />
+  </ItemGroup>
 
+  <!--#endif -->
 </Project>

src/ProjectTemplates/Web.ProjectTemplates/RazorPagesWeb-CSharp.csproj.in

@@ -4,7 +4,7 @@
     <TargetFramework>${DefaultNetCoreTargetFramework}</TargetFramework>
     <Nullable>enable</Nullable>
     <ImplicitUsings>enable</ImplicitUsings>
-    <UserSecretsId Condition="'$(IndividualAuth)' == 'True' OR '$(OrganizationalAuth)' == 'True'">aspnet-Company.WebApplication1-0ce56475-d1db-490f-8af1-a881ea4fcd2d</UserSecretsId>
+    <UserSecretsId Condition="'$(IndividualAuth)' == 'True' OR '$(OrganizationalAuth)' == 'True'">aspnet-Company.WebApplication1-53bc9b9d-9d6a-45d4-8429-2a2761773502</UserSecretsId>
     <NoDefaultLaunchSettingsFile Condition="'$(ExcludeLaunchSettings)' == 'True'">True</NoDefaultLaunchSettingsFile>
     <RootNamespace Condition="'$(name)' != '$(name{-VALUE-FORMS-}safe_namespace)'">Company.WebApplication1</RootNamespace>
   </PropertyGroup>

src/ProjectTemplates/Web.ProjectTemplates/content/BlazorWeb-CSharp/.template.config/dotnetcli.host.json

@@ -21,6 +21,9 @@
     "IncludeSampleContent": {
       "isHidden": true
     },
+    "UseLocalDB": {
+      "longName": "use-local-db"
+    },
     "Framework": {
       "longName": "framework"
     },
@@ -51,5 +54,8 @@
       "longName": "use-program-main",
       "shortName": ""
     }
-  }
+  },
+  "usageExamples": [
+    "-int auto --auth individual --use-local-db"
+  ]
 }

src/ProjectTemplates/Web.ProjectTemplates/content/BlazorWeb-CSharp/.template.config/localize/templatestrings.cs.json

@@ -4,6 +4,7 @@
   "description": "Šablona projektu pro vytvoření webové aplikace Blazor, která podporuje vykreslování na straně serveru i interaktivitu klienta. Tato šablona se dá použít pro webové aplikace s bohatými dynamickými uživatelskými rozhraními (UI).",
   "symbols/Framework/description": "Cílová architektura pro projekt",
   "symbols/Framework/choices/net8.0/description": "Cílový net8.0",
+  "symbols/UserSecretsId/description": "The ID to use for secrets (use with Individual auth).",
   "symbols/skipRestore/description": "Pokud se tato možnost zadá, přeskočí automatické obnovení projektu při vytvoření.",
   "symbols/ExcludeLaunchSettings/description": "Určuje, jestli se má z vygenerované šablony vyloučit soubor launchSettings.json.",
   "symbols/kestrelHttpPort/description": "Číslo portu, který se má použít pro koncový bod HTTP v souboru launchSettings.json.",
@@ -29,6 +30,10 @@
   "symbols/IncludeSampleContent/displayName": "_Zahrnout ukázkové stránky",
   "symbols/IncludeSampleContent/description": "Nastavuje, jestli se mají přidávat ukázkové stránky a styly pro demonstraci základních vzorů použití.",
   "symbols/Empty/description": "Nastavuje, jestli se mají vynechat ukázkové stránky a styly, které demonstrují základní vzory použití.",
+  "symbols/auth/choices/None/description": "No authentication",
+  "symbols/auth/choices/Individual/description": "Individual authentication",
+  "symbols/auth/description": "The type of authentication to use",
+  "symbols/UseLocalDB/description": "Whether to use LocalDB instead of SQLite. This option only applies if --auth Individual is specified.",
   "symbols/AllInteractive/displayName": "_Enable interactive rendering globally throughout the site",
   "symbols/AllInteractive/description": "Configures whether to make every page interactive by applying an interactive render mode at the top level. If false, pages will use static server rendering by default, and can be marked interactive on a per-page or per-component basis.",
   "symbols/NoHttps/description": "Určuje, jestli se má protokol HTTPS vypnout. Tato možnost platí jenom v případě, že se pro --auth nepoužívají Individual, IndividualB2C, SingleOrg ani MultiOrg.",

src/ProjectTemplates/Web.ProjectTemplates/content/BlazorWeb-CSharp/.template.config/localize/templatestrings.de.json

@@ -4,6 +4,7 @@
   "description": "Eine Projektvorlage zum Erstellen einer Blazor-Web-App, die sowohl serverseitiges Rendering als auch Clientinteraktivität unterstützt. Diese Vorlage kann für Web-Apps mit umfangreichen dynamischen Benutzeroberflächen (UIs) verwendet werden.",
   "symbols/Framework/description": "Das Zielframework für das Projekt.",
   "symbols/Framework/choices/net8.0/description": "Ziel net8.0",
+  "symbols/UserSecretsId/description": "The ID to use for secrets (use with Individual auth).",
   "symbols/skipRestore/description": "Wenn angegeben, wird die automatische Wiederherstellung des Projekts beim Erstellen übersprungen.",
   "symbols/ExcludeLaunchSettings/description": "Ob launchSettings.json aus der generierten Vorlage ausgeschlossen werden soll.",
   "symbols/kestrelHttpPort/description": "Portnummer, die für den HTTP Endpunkt in launchSettings.json verwendet werden soll.",
@@ -29,6 +30,10 @@
   "symbols/IncludeSampleContent/displayName": "_Include Beispielseiten",
   "symbols/IncludeSampleContent/description": "Konfiguriert, ob Beispielseiten und Stile hinzugefügt werden, um grundlegende Verwendungsmuster zu veranschaulichen.",
   "symbols/Empty/description": "Konfiguriert, ob Beispielseiten und Formatierungen weggelassen werden sollen, die grundlegende Verwendungsmuster veranschaulichen.",
+  "symbols/auth/choices/None/description": "No authentication",
+  "symbols/auth/choices/Individual/description": "Individual authentication",
+  "symbols/auth/description": "The type of authentication to use",
+  "symbols/UseLocalDB/description": "Whether to use LocalDB instead of SQLite. This option only applies if --auth Individual is specified.",
   "symbols/AllInteractive/displayName": "_Enable interactive rendering globally throughout the site",
   "symbols/AllInteractive/description": "Configures whether to make every page interactive by applying an interactive render mode at the top level. If false, pages will use static server rendering by default, and can be marked interactive on a per-page or per-component basis.",
   "symbols/NoHttps/description": "Ob HTTPS deaktiviert werden soll. Diese Option gilt nur, wenn Individual, IndividualB2C, SingleOrg oder MultiOrg nicht für --auth verwendet werden.",

src/ProjectTemplates/Web.ProjectTemplates/content/BlazorWeb-CSharp/.template.config/localize/templatestrings.en.json

@@ -4,12 +4,13 @@
   "description": "A project template for creating a Blazor web app that supports both server-side rendering and client interactivity. This template can be used for web apps with rich dynamic user interfaces (UIs).",
   "symbols/Framework/description": "The target framework for the project.",
   "symbols/Framework/choices/net8.0/description": "Target net8.0",
+  "symbols/UserSecretsId/description": "The ID to use for secrets (use with Individual auth).",
   "symbols/skipRestore/description": "If specified, skips the automatic restore of the project on create.",
   "symbols/ExcludeLaunchSettings/description": "Whether to exclude launchSettings.json from the generated template.",
   "symbols/kestrelHttpPort/description": "Port number to use for the HTTP endpoint in launchSettings.json.",
-  "symbols/kestrelHttpsPort/description": "Port number to use for the HTTPS endpoint in launchSettings.json. This option is only applicable when the parameter no-https is not used (no-https will be ignored if either IndividualAuth or OrganizationalAuth is used).",
+  "symbols/kestrelHttpsPort/description": "Port number to use for the HTTPS endpoint in launchSettings.json. This option is only applicable when the parameter no-https is not used (no-https will be ignored if Individual auth is used).",
   "symbols/iisHttpPort/description": "Port number to use for the IIS Express HTTP endpoint in launchSettings.json.",
-  "symbols/iisHttpsPort/description": "Port number to use for the IIS Express HTTPS endpoint in launchSettings.json. This option is only applicable when the parameter no-https is not used (no-https will be ignored if either IndividualAuth or OrganizationalAuth is used).",
+  "symbols/iisHttpsPort/description": "Port number to use for the IIS Express HTTPS endpoint in launchSettings.json. This option is only applicable when the parameter no-https is not used (no-https will be ignored if Individual auth is used).",
   "symbols/InteractivityPlatform/displayName": "_Interactivity type",
   "symbols/InteractivityPlatform/description": "Chooses which hosting platform to use for interactive components",
   "symbols/InteractivityPlatform/choices/None/displayName": "None",
@@ -29,9 +30,13 @@
   "symbols/IncludeSampleContent/displayName": "_Include sample pages",
   "symbols/IncludeSampleContent/description": "Configures whether to add sample pages and styling to demonstrate basic usage patterns.",
   "symbols/Empty/description": "Configures whether to omit sample pages and styling that demonstrate basic usage patterns.",
+  "symbols/auth/choices/None/description": "No authentication",
+  "symbols/auth/choices/Individual/description": "Individual authentication",
+  "symbols/auth/description": "The type of authentication to use",
+  "symbols/UseLocalDB/description": "Whether to use LocalDB instead of SQLite. This option only applies if --auth Individual is specified.",
   "symbols/AllInteractive/displayName": "_Enable interactive rendering globally throughout the site",
   "symbols/AllInteractive/description": "Configures whether to make every page interactive by applying an interactive render mode at the top level. If false, pages will use static server rendering by default, and can be marked interactive on a per-page or per-component basis.",
-  "symbols/NoHttps/description": "Whether to turn off HTTPS. This option only applies if Individual, IndividualB2C, SingleOrg, or MultiOrg aren't used for --auth.",
+  "symbols/NoHttps/description": "Whether to turn off HTTPS. This option only applies if Individual isn't used for --auth.",
   "symbols/UseProgramMain/displayName": "Do not use _top-level statements",
   "symbols/UseProgramMain/description": "Whether to generate an explicit Program class and Main method instead of top-level statements.",
   "postActions/restore/description": "Restore NuGet packages required by this project.",

src/ProjectTemplates/Web.ProjectTemplates/content/BlazorWeb-CSharp/.template.config/localize/templatestrings.es.json

@@ -4,6 +4,7 @@
   "description": "Plantilla de proyecto para crear una aplicación web de Blazor que admita tanto la representación del lado del servidor como la interactividad del cliente. Esta plantilla se puede usar para las aplicaciones web con interfaces de usuario dinámicas enriquecidas.",
   "symbols/Framework/description": "Marco de destino del proyecto.",
   "symbols/Framework/choices/net8.0/description": "net8.0 de destino",
+  "symbols/UserSecretsId/description": "The ID to use for secrets (use with Individual auth).",
   "symbols/skipRestore/description": "Si se especifica, se omite la restauración automática del proyecto durante la creación.",
   "symbols/ExcludeLaunchSettings/description": "Indica si se va a excluir launchSettings.json de la plantilla generada.",
   "symbols/kestrelHttpPort/description": "Número de puerto que se va a usar para el punto de conexión HTTP en launchSettings.json.",
@@ -29,6 +30,10 @@
   "symbols/IncludeSampleContent/displayName": "_Incluir páginas de ejemplo",
   "symbols/IncludeSampleContent/description": "Configura si se van a agregar páginas de ejemplo y estilos para mostrar patrones de uso básicos.",
   "symbols/Empty/description": "Configura si se omiten las páginas de ejemplo y los estilos que muestran patrones de uso básicos.",
+  "symbols/auth/choices/None/description": "No authentication",
+  "symbols/auth/choices/Individual/description": "Individual authentication",
+  "symbols/auth/description": "The type of authentication to use",
+  "symbols/UseLocalDB/description": "Whether to use LocalDB instead of SQLite. This option only applies if --auth Individual is specified.",
   "symbols/AllInteractive/displayName": "_Enable interactive rendering globally throughout the site",
   "symbols/AllInteractive/description": "Configures whether to make every page interactive by applying an interactive render mode at the top level. If false, pages will use static server rendering by default, and can be marked interactive on a per-page or per-component basis.",
   "symbols/NoHttps/description": "Si se va a desactivar HTTPS. Esta opción solo se aplica si Individual, IndividualB2C, SingleOrg o MultiOrg no se usan para --auth.",

src/ProjectTemplates/Web.ProjectTemplates/content/BlazorWeb-CSharp/.template.config/localize/templatestrings.fr.json

@@ -4,6 +4,7 @@
   "description": "Modèle de projet pour la création d’une application web Blazor qui prend en charge le rendu côté serveur et l’interactivité du client. Ce modèle peut être utilisé pour les applications web avec des interfaces utilisateur dynamiques enrichies.",
   "symbols/Framework/description": "Framework cible du projet.",
   "symbols/Framework/choices/net8.0/description": "Cible net8.0",
+  "symbols/UserSecretsId/description": "The ID to use for secrets (use with Individual auth).",
   "symbols/skipRestore/description": "S’il est spécifié, ignore la restauration automatique du projet lors de la création.",
   "symbols/ExcludeLaunchSettings/description": "Indique s’il faut exclure launchSettings.json du modèle généré.",
   "symbols/kestrelHttpPort/description": "Numéro de port à utiliser pour le point de terminaison HTTP dans launchSettings.json.",
@@ -29,6 +30,10 @@
   "symbols/IncludeSampleContent/displayName": "_Inclure des exemples de pages",
   "symbols/IncludeSampleContent/description": "Configure s'il faut ajouter des exemples de pages et de style pour illustrer les modèles d'utilisation de base.",
   "symbols/Empty/description": "Configure s'il faut omettre les exemples de pages et le style qui illustrent les modèles d'utilisation de base.",
+  "symbols/auth/choices/None/description": "No authentication",
+  "symbols/auth/choices/Individual/description": "Individual authentication",
+  "symbols/auth/description": "The type of authentication to use",
+  "symbols/UseLocalDB/description": "Whether to use LocalDB instead of SQLite. This option only applies if --auth Individual is specified.",
   "symbols/AllInteractive/displayName": "_Enable interactive rendering globally throughout the site",
   "symbols/AllInteractive/description": "Configures whether to make every page interactive by applying an interactive render mode at the top level. If false, pages will use static server rendering by default, and can be marked interactive on a per-page or per-component basis.",
   "symbols/NoHttps/description": "Indique s’il faut désactiver HTTPS. Cette option s’applique uniquement si Individual, IndividualB2C, SingleOrg ou MultiOrg ne sont pas utilisés pour --auth.",

src/ProjectTemplates/Web.ProjectTemplates/content/BlazorWeb-CSharp/.template.config/localize/templatestrings.it.json

@@ -4,6 +4,7 @@
   "description": "Modello di progetto per la creazione di un'app Web Blazor che supporta sia il rendering lato server sia l'interattività client. Questo modello può essere usato per app Web con interfacce utente dinamiche avanzate.",
   "symbols/Framework/description": "Il framework di destinazione per il progetto.",
   "symbols/Framework/choices/net8.0/description": "Destinazione net8.0",
+  "symbols/UserSecretsId/description": "The ID to use for secrets (use with Individual auth).",
   "symbols/skipRestore/description": "Se specificato, ignora il ripristino automatico del progetto durante la creazione.",
   "symbols/ExcludeLaunchSettings/description": "Indica se escludere launchSettings.json dal modello generato.",
   "symbols/kestrelHttpPort/description": "Numero di porta da usare per l'endpoint HTTP in launchSettings.json.",
@@ -29,6 +30,10 @@
   "symbols/IncludeSampleContent/displayName": "_Include pagine di esempio",
   "symbols/IncludeSampleContent/description": "Consente di configurare se aggiungere pagine di esempio e stile per mostrare modelli di utilizzo di base.",
   "symbols/Empty/description": "Consente di configurare se omettere pagine di esempio e stile che mostrano modelli di utilizzo di base.",
+  "symbols/auth/choices/None/description": "No authentication",
+  "symbols/auth/choices/Individual/description": "Individual authentication",
+  "symbols/auth/description": "The type of authentication to use",
+  "symbols/UseLocalDB/description": "Whether to use LocalDB instead of SQLite. This option only applies if --auth Individual is specified.",
   "symbols/AllInteractive/displayName": "_Enable interactive rendering globally throughout the site",
   "symbols/AllInteractive/description": "Configures whether to make every page interactive by applying an interactive render mode at the top level. If false, pages will use static server rendering by default, and can be marked interactive on a per-page or per-component basis.",
   "symbols/NoHttps/description": "Indica se disattivare HTTPS. Questa opzione si applica solo se Individual, IndividualB2C, SingleOrg o MultiOrg non vengono usati per --auth.",