Review and update CSP and remove inline styles

SAPSec.Web/AssetSrc/scss/main.scss

@@ -212,6 +212,18 @@
   }
 }
 
+.app-similar-schools-contact {
+    border: 1px solid #b1b4b6;
+}
+
+.app-similar-schools-contact-content {
+    background: #f3f2f1;
+}
+
+.app-similar-schools-tag {
+    white-space: nowrap;
+}
+
 .app-similar-schools-sort {
   display: flex;
   align-items: center;

SAPSec.Web/Helpers/CspHelper.cs

@@ -14,18 +14,41 @@ public static string GenerateNonce()
         return Convert.ToBase64String(byteArray);
     }
 
-    public static string BuildPolicy(string nonce)
+    public static string BuildPolicy(string nonce, IWebHostEnvironment environment)
     {
+        if (environment.IsProduction())
+        { 
         return string.Join(" ",
             "base-uri 'self';",
             "object-src 'none';",
             "default-src 'self';",
             "frame-ancestors 'none';",
-            "form-action 'self' https://test-oidc.signin.education.gov.uk https://pp-oidc.signin.education.gov.uk https://oidc.signin.education.gov.uk;",
-            "connect-src 'self' *.google-analytics.com *.analytics.google.com https://www.compare-school-performance.service.gov.uk https://api.postcodes.io https://*.doubleclick.net https://*.clarity.ms https://c.bing.com https://*.applicationinsights.azure.com/ https://*.visualstudio.com/ wss://localhost:*;",
-            "img-src 'self' data: https://www.googletagmanager.com/ https://*.google-analytics.com https://atlas.microsoft.com https://*.clarity.ms https://c.bing.com https://js.monitor.azure.com/ https://*.tile.openstreetmap.org;",
-            "style-src 'self' 'unsafe-inline';",
+            "form-action 'self' https://oidc.signin.education.gov.uk;",
+            "connect-src 'self' *.google-analytics.com *.analytics.google.com https://*.clarity.ms https://c.bing.com;",
+            "img-src 'self' data: https://www.googletagmanager.com/ https://*.google-analytics.com https://*.clarity.ms https://c.bing.com https://*.tile.openstreetmap.org;",
+            "style-src 'self';",
             "font-src 'self' data:;",
-            $"script-src 'self' 'nonce-{nonce}' https://www.googletagmanager.com *.google-analytics.com https://*.clarity.ms https://c.bing.com https://js.monitor.azure.com/;");
+            $"script-src 'self' 'nonce-{nonce}' https://www.googletagmanager.com *.google-analytics.com https://*.clarity.ms https://c.bing.com;");
+        }
+        else
+        {
+            return string.Join(" ",
+            "base-uri 'self';",
+            "object-src 'none';",
+            "default-src 'self';",
+            "frame-ancestors 'none';",
+            "form-action 'self' https://test-oidc.signin.education.gov.uk https://pp-oidc.signin.education.gov.uk;",
+            "connect-src 'self' *.google-analytics.com *.analytics.google.com https://*.clarity.ms https://c.bing.com https://*.visualstudio.com/ ws://localhost:* wss://localhost:* http://localhost:*;",
+            "img-src 'self' data: https://www.googletagmanager.com/ https://*.google-analytics.com https://*.clarity.ms https://c.bing.com https://*.tile.openstreetmap.org;",
+            "style-src 'self';",
+            "font-src 'self' data:;",
+            $"script-src 'self' 'nonce-{nonce}' https://www.googletagmanager.com *.google-analytics.com https://*.clarity.ms https://c.bing.com;");
+         }
+
+        //Notes:
+        //https://c.bing.com is required by Clarity
+        //https://*.visualstudio.com/ used for live share in Visual Studio
+        //ws://localhost:* http://localhost:* used by https://browsersync.io/
+        //wss://localhost:* used by hot reload in Visual Studio
     }
 }

SAPSec.Web/Middleware/SecurityHeadersMiddleware.cs

@@ -4,7 +4,7 @@
 namespace SAPSec.Web.Middleware;
 
 [ExcludeFromCodeCoverage]
-public class SecurityHeadersMiddleware(RequestDelegate next)
+public class SecurityHeadersMiddleware(RequestDelegate next, IWebHostEnvironment environment)
 {
     public async Task InvokeAsync(HttpContext context)
     {
@@ -32,7 +32,7 @@ public async Task InvokeAsync(HttpContext context)
         context.Response.Headers.Append("X-Permitted-Cross-Domain-Policies", "none");
         context.Response.Headers.Append("X-XSS-Protection", "0");
         context.Response.Headers.Append("Strict-Transport-Security", "max-age=31536000; includeSubDomains; preload");
-        context.Response.Headers.Append("Content-Security-Policy", CspHelper.BuildPolicy(nonce));
+        context.Response.Headers.Append("Content-Security-Policy", CspHelper.BuildPolicy(nonce, environment));
 
         await next(context);
     }

SAPSec.Web/Program.cs

@@ -204,7 +204,7 @@ public static void Main(string[] args)
             app.UseHsts();
         }
         app.UseForwardedHeaders();
-        app.UseMiddleware<SecurityHeadersMiddleware>();
+        app.UseMiddleware<SecurityHeadersMiddleware>(app.Environment);
         app.UseHttpsRedirection();
 
         var provider = new FileExtensionContentTypeProvider

SAPSec.Web/Views/Shared/_Layout.cshtml

@@ -71,7 +71,7 @@ n&&j.setAttribute('nonce',n.nonce||n.getAttribute('nonce'));f.parentNode.insertB
     @if (loadAnalytics && !string.IsNullOrWhiteSpace(gtmId))
     {
     <!-- Google Tag Manager (noscript) -->
-    <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=@gtmId@Html.Raw(gtmAdditional)" height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
+    <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=@gtmId@Html.Raw(gtmAdditional)" height="0" width="0" hidden"></iframe></noscript>
     <!-- End Google Tag Manager (noscript) -->
     }
     <script add-nonce="true">

SAPSec.Web/Views/SimilarSchoolsComparison/SchoolDetails.cshtml

@@ -55,7 +55,6 @@
     </summary>
 
     <div class="govuk-details__text govuk-!-padding-left-2 govuk-!-padding-right-0">
-        @* <div id="comparison-map" style="height:520px;"></div> *@
         <div id="map" data-map-mode="compare"
              data-fixed-zoom="14"
              role="region"
@@ -93,9 +92,8 @@
 
 @if (Model.SimilarSchoolDetails is not null)
 {
-    <div class="govuk-!-margin-top-6 govuk-!-margin-bottom-9" style="border: 1px solid #b1b4b6;">
-        <div class="govuk-!-padding-top-4 govuk-!-padding-right-6 govuk-!-padding-bottom-4 govuk-!-padding-left-6"
-             style="background: #f3f2f1;">
+    <div class="govuk-!-margin-top-6 govuk-!-margin-bottom-9 app-similar-schools-contact">
+        <div class="govuk-!-padding-top-4 govuk-!-padding-right-6 govuk-!-padding-bottom-4 govuk-!-padding-left-6 app-similar-schools-contact-content">
             <h2 class="govuk-heading-m govuk-!-margin-bottom-0">Contact this school</h2>
         </div>
 

SAPSec.Web/Views/SimilarSchoolsComparison/Similarity.cshtml

@@ -44,13 +44,13 @@
                     @switch (row.Similarity)
                     {
                         case SchoolSimilarity.Similar:
-                            <strong class="govuk-tag govuk-tag--green" style="white-space: nowrap;">Similar</strong>
+                            <strong class="govuk-tag govuk-tag--green app-similar-schools-tag">Similar</strong>
                             break;
                         case SchoolSimilarity.LessSimilar:
-                            <strong class="govuk-tag govuk-tag--yellow" style="white-space: nowrap;">Less similar</strong>
+                                <strong class="govuk-tag govuk-tag--yellow app-similar-schools-tag">Less similar</strong>
                             break;
                         default:
-                            <strong class="govuk-tag govuk-tag--red" style="white-space: nowrap;">Not similar</strong>
+                            <strong class="govuk-tag govuk-tag--red app-similar-schools-tag">Not similar</strong>
                             break;
                     }
                 </td>