From e08f9362c9742d1a619a0c0a6cf7a040e3473057 Mon Sep 17 00:00:00 2001
From: Jim Washbrook <jim.washbrook@and.digital>
Date: Tue, 27 Aug 2024 16:38:56 +0100
Subject: [PATCH 1/5] fix(print): Move Javascript to <script> element due to
 CSP

---
 .../Views/Content/CsIndex.cshtml              | 27 ++++++++++++++++++-
 .../Views/Shared/_Print.cshtml                |  2 +-
 2 files changed, 27 insertions(+), 2 deletions(-)

diff --git a/src/Dfe.ContentSupport.Web/Views/Content/CsIndex.cshtml b/src/Dfe.ContentSupport.Web/Views/Content/CsIndex.cshtml
index b1567d9..7876f90 100644
--- a/src/Dfe.ContentSupport.Web/Views/Content/CsIndex.cshtml
+++ b/src/Dfe.ContentSupport.Web/Views/Content/CsIndex.cshtml
@@ -51,4 +51,29 @@
             <partial name="_Feedback" />
         }
     </div>
-</div>
\ No newline at end of file
+</div>
+
+@section BodyEnd{
+    @if (Model.HasPrint)
+    {
+        <script nonce="@Context.Items["nonce"]" defer>
+            /**
+            * Adds functionality for printing a page to the Print Page button (_Print.cshtml)
+            */
+            const printPage = () => window.print();
+
+
+            const addPrintButtonEventListener = () => {
+                const printButton = document.getElementById("print-link");
+
+                if(!printButton){
+                    return;
+                }
+
+                printButton.addEventListener('click', printPage);
+            }
+
+            addPrintButtonEventListener();
+        </script>
+    }
+}
\ No newline at end of file
diff --git a/src/Dfe.ContentSupport.Web/Views/Shared/_Print.cshtml b/src/Dfe.ContentSupport.Web/Views/Shared/_Print.cshtml
index 402ac26..70c2e12 100644
--- a/src/Dfe.ContentSupport.Web/Views/Shared/_Print.cshtml
+++ b/src/Dfe.ContentSupport.Web/Views/Shared/_Print.cshtml
@@ -1,3 +1,3 @@
 <div class="print-button">
-    <button class="govuk-link print-link-button" data-module="print-link" onclick="window.print()">Print this page</button>
+    <button class="govuk-link print-link-button" data-module="print-link" id="print-link">Print this page</button>
 </div>
\ No newline at end of file

From 839d46e01a1d06faab6a10a7f084c27ebee2dc91 Mon Sep 17 00:00:00 2001
From: Jim Washbrook <jim.washbrook@and.digital>
Date: Tue, 27 Aug 2024 17:30:07 +0100
Subject: [PATCH 2/5] feat: Hide JS dependant elements unless JS enabled

---
 .../Views/Content/CsIndex.cshtml              | 24 +++++++++++++++++++
 .../Views/Shared/_Feedback.cshtml             |  2 +-
 .../Views/Shared/_Footer.cshtml               |  4 ++--
 .../Views/Shared/_Print.cshtml                |  2 +-
 4 files changed, 28 insertions(+), 4 deletions(-)

diff --git a/src/Dfe.ContentSupport.Web/Views/Content/CsIndex.cshtml b/src/Dfe.ContentSupport.Web/Views/Content/CsIndex.cshtml
index 7876f90..3087d3a 100644
--- a/src/Dfe.ContentSupport.Web/Views/Content/CsIndex.cshtml
+++ b/src/Dfe.ContentSupport.Web/Views/Content/CsIndex.cshtml
@@ -76,4 +76,28 @@
             addPrintButtonEventListener();
         </script>
     }
+
+    <script nonce="@Context.Items["nonce"]" defer>
+        const hiddenClass = "govuk-visually-hidden";
+
+        //Some elements should remain hidden
+        const idsToNotShow = ["support-links"];
+
+        //Remove hidden visibility CSS class if JS enabled
+        const removeHiddenClassFromElements = () => {
+            const hiddenElements = Array.from(document.querySelectorAll(`.${hiddenClass}`));
+
+            for(const element of hiddenElements){
+                if(idsToNotShow.indexOf(element.id) > -1){
+                    continue;
+                }
+
+                element.classList.remove(hiddenClass);
+                //Also unset "aria-hidden" attribute
+                element.ariaHidden = undefined;
+            }
+        }
+
+        removeHiddenClassFromElements();
+    </script>
 }
\ No newline at end of file
diff --git a/src/Dfe.ContentSupport.Web/Views/Shared/_Feedback.cshtml b/src/Dfe.ContentSupport.Web/Views/Shared/_Feedback.cshtml
index 6564b7c..13ed0e9 100644
--- a/src/Dfe.ContentSupport.Web/Views/Shared/_Feedback.cshtml
+++ b/src/Dfe.ContentSupport.Web/Views/Shared/_Feedback.cshtml
@@ -17,7 +17,7 @@
 
 @if (track)
 {
-    <div class="dfe-feedback-banner govuk-!-margin-top-9">
+    <div class="dfe-feedback-banner govuk-!-margin-top-9 govuk-visually-hidden" aria-hidden="true">
         <div class="dfe-feedback-banner--content">
             <form id="feedbackForm">
                 <div class="dfe-feedback-banner--content-questions">
diff --git a/src/Dfe.ContentSupport.Web/Views/Shared/_Footer.cshtml b/src/Dfe.ContentSupport.Web/Views/Shared/_Footer.cshtml
index a99e003..5340cac 100644
--- a/src/Dfe.ContentSupport.Web/Views/Shared/_Footer.cshtml
+++ b/src/Dfe.ContentSupport.Web/Views/Shared/_Footer.cshtml
@@ -1,8 +1,8 @@
 <footer class="govuk-footer " role="contentinfo">
-    <div class="govuk-width-container ">
+    <div class="govuk-width-container">
         <div class="govuk-footer__meta">
             <div class="govuk-footer__meta-item govuk-footer__meta-item--grow">
-                <h2 class="govuk-visually-hidden">Support links</h2>
+                <h2 class="govuk-visually-hidden" id="support-links">Support links</h2>
                 @* @await Component.InvokeAsync("FooterLinks") *@
                 <svg aria-hidden="true" focusable="false" class="govuk-footer__licence-logo"
                      xmlns="http://www.w3.org/2000/svg" viewBox="0 0 483.2 195.7" height="17" width="41">
diff --git a/src/Dfe.ContentSupport.Web/Views/Shared/_Print.cshtml b/src/Dfe.ContentSupport.Web/Views/Shared/_Print.cshtml
index 70c2e12..492e803 100644
--- a/src/Dfe.ContentSupport.Web/Views/Shared/_Print.cshtml
+++ b/src/Dfe.ContentSupport.Web/Views/Shared/_Print.cshtml
@@ -1,3 +1,3 @@
 <div class="print-button">
-    <button class="govuk-link print-link-button" data-module="print-link" id="print-link">Print this page</button>
+    <button class="govuk-link print-link-button govuk-visually-hidden" data-module="print-link" id="print-link" aria-hidden="true">Print this page</button>
 </div>
\ No newline at end of file

From 94829140c69df9f967049bfd944b784a6de77ff9 Mon Sep 17 00:00:00 2001
From: Jim Washbrook <jim.washbrook@and.digital>
Date: Tue, 27 Aug 2024 17:32:02 +0100
Subject: [PATCH 3/5] chore: move class + attribute one up

---
 src/Dfe.ContentSupport.Web/Views/Shared/_Print.cshtml | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/Dfe.ContentSupport.Web/Views/Shared/_Print.cshtml b/src/Dfe.ContentSupport.Web/Views/Shared/_Print.cshtml
index 492e803..b65a3b2 100644
--- a/src/Dfe.ContentSupport.Web/Views/Shared/_Print.cshtml
+++ b/src/Dfe.ContentSupport.Web/Views/Shared/_Print.cshtml
@@ -1,3 +1,3 @@
-<div class="print-button">
-    <button class="govuk-link print-link-button govuk-visually-hidden" data-module="print-link" id="print-link" aria-hidden="true">Print this page</button>
+<div class="print-button govuk-visually-hidden" aria-hidden="true">
+    <button class="govuk-link print-link-button" data-module="print-link" id="print-link" >Print this page</button>
 </div>
\ No newline at end of file

From 5faafc3593a069f84cee243260e07ff79ab3fb7a Mon Sep 17 00:00:00 2001
From: Jim Washbrook <jim.washbrook@and.digital>
Date: Tue, 27 Aug 2024 18:54:09 +0100
Subject: [PATCH 4/5] tests: Add E2E tests for feedback + print button

---
 .../Views/Shared/_Feedback.cshtml             |  2 +-
 .../cypress/e2e/pages/feedback.cy.js          | 30 +++++++++++++++++++
 .../cypress/e2e/pages/print-button.cy.js      | 25 ++++++++++++++++
 3 files changed, 56 insertions(+), 1 deletion(-)
 create mode 100644 tests/Dfe.ContentSupport.Web.E2ETests/cypress/e2e/pages/feedback.cy.js
 create mode 100644 tests/Dfe.ContentSupport.Web.E2ETests/cypress/e2e/pages/print-button.cy.js

diff --git a/src/Dfe.ContentSupport.Web/Views/Shared/_Feedback.cshtml b/src/Dfe.ContentSupport.Web/Views/Shared/_Feedback.cshtml
index 13ed0e9..c6fbf40 100644
--- a/src/Dfe.ContentSupport.Web/Views/Shared/_Feedback.cshtml
+++ b/src/Dfe.ContentSupport.Web/Views/Shared/_Feedback.cshtml
@@ -17,7 +17,7 @@
 
 @if (track)
 {
-    <div class="dfe-feedback-banner govuk-!-margin-top-9 govuk-visually-hidden" aria-hidden="true">
+    <div class="dfe-feedback-banner govuk-!-margin-top-9 govuk-visually-hidden" aria-hidden="true" id="feedback-banner">
         <div class="dfe-feedback-banner--content">
             <form id="feedbackForm">
                 <div class="dfe-feedback-banner--content-questions">
diff --git a/tests/Dfe.ContentSupport.Web.E2ETests/cypress/e2e/pages/feedback.cy.js b/tests/Dfe.ContentSupport.Web.E2ETests/cypress/e2e/pages/feedback.cy.js
new file mode 100644
index 0000000..ffdc97d
--- /dev/null
+++ b/tests/Dfe.ContentSupport.Web.E2ETests/cypress/e2e/pages/feedback.cy.js
@@ -0,0 +1,30 @@
+describe('Feedback banner', () => {
+  it("should be visible when tracking consented", () => {
+    cy.visit('content/hello-world',
+      {
+        headers: {
+          'Cookie': '.AspNet.Consent=yes'
+        }
+      }
+    );
+
+    cy.get("div#feedback-banner")
+      .should('exist')
+      .not("govuk-visually-hidden")
+      .should('not.have.attr', 'aria-hidden');
+  });
+
+  it("should not exist when tracking consent not given", () => {
+    cy.visit('content/hello-world',
+      {
+        headers: {
+          'Cookie': '.AspNet.Consent=no'
+        }
+      }
+    );
+
+    cy.get("div#feedback-banner")
+      .should('not.exist');
+  });
+
+});
\ No newline at end of file
diff --git a/tests/Dfe.ContentSupport.Web.E2ETests/cypress/e2e/pages/print-button.cy.js b/tests/Dfe.ContentSupport.Web.E2ETests/cypress/e2e/pages/print-button.cy.js
new file mode 100644
index 0000000..f6a4a6a
--- /dev/null
+++ b/tests/Dfe.ContentSupport.Web.E2ETests/cypress/e2e/pages/print-button.cy.js
@@ -0,0 +1,25 @@
+describe('Print button', () => {
+  beforeEach(() => {
+    cy.visit('content/hello-world', {
+      onBeforeLoad(win) {
+        //Stub the print functionality so we can see if it was called
+        //Note: could spy instead, but I don't want the print dialog to actually show.
+        cy.stub(win, 'print', () => { });
+      },
+    });
+  });
+
+  it("should be visible", () => {
+    cy.get("div.print-button")
+      .should('exist')
+      .not("govuk-visually-hidden")
+      .should('not.have.attr', 'aria-hidden');
+
+    cy.get("button#print-link").should("exist");
+  });
+
+  it("should print on click", () => {
+    cy.get("button#print-link").click();
+    cy.window().its("print").should('be.called');
+  });
+});
\ No newline at end of file

From f511d94b8a31d6a34b5413e407f96448a941b461 Mon Sep 17 00:00:00 2001
From: Jim Washbrook <jim.washbrook@and.digital>
Date: Wed, 28 Aug 2024 09:49:15 +0100
Subject: [PATCH 5/5] fix: Exclude cypress tests from sonarcloud

---
 .github/workflows/code-pr-check.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/code-pr-check.yml b/.github/workflows/code-pr-check.yml
index 96df990..9de8410 100644
--- a/.github/workflows/code-pr-check.yml
+++ b/.github/workflows/code-pr-check.yml
@@ -55,7 +55,7 @@ jobs:
         /d:sonar.login="${{ secrets.SONAR_TOKEN }}" \
         /d:sonar.host.url="https://sonarcloud.io" \
         /d:sonar.cs.vscoveragexml.reportsPaths=coverage.xml \
-        /d:sonar.coverage.exclusions=**/Program.cs,**/wwwroot/** \
+        /d:sonar.coverage.exclusions=**/Program.cs,**/wwwroot/**,**/Dfe.ContentSupport.Web.E2ETests/** \
         /d:sonar.issue.ignore.multicriteria=e1 \
         /d:sonar.issue.ignore.multicriteria.e1.ruleKey=csharpsquid:S6602 \
         /d:sonar.issue.ignore.multicriteria.e1.resourceKey=src/**/*.cs