From a2b8bf97e0e169fe14c6ce5a3aa6714da115bb50 Mon Sep 17 00:00:00 2001
From: Richard van der Hoff <richard@matrix.org>
Date: Wed, 10 May 2023 14:48:40 +0100
Subject: [PATCH] Fix CSP problems due to cypress-axe

Rewrite `injectAxe` to use a script tag instead of an `eval`.
---
 cypress/support/axe.ts | 32 ++++++++++++++++++++++++++++++++
 1 file changed, 32 insertions(+)

diff --git a/cypress/support/axe.ts b/cypress/support/axe.ts
index 4040a983d9e..c0e7a6332af 100644
--- a/cypress/support/axe.ts
+++ b/cypress/support/axe.ts
@@ -67,3 +67,35 @@ Cypress.Commands.overwrite(
         );
     },
 );
+
+// Load axe-core into the window under test.
+//
+// The injectAxe in cypress-axe attempts to load axe via an `eval`. That conflicts with our CSP
+// which disallows "unsafe-eval". So, replace it with an implementation that loads it via an
+// injected <script> element.
+Cypress.Commands.overwrite("injectAxe", (originalFn: Chainable["injectAxe"]): void => {
+    Cypress.log({ name: "injectAxe" });
+
+    // load the minified axe source, and create an intercept to serve it up
+    cy.readFile("node_modules/axe-core/axe.min.js", { log: false }).then((source) => {
+        cy.intercept("/_axe", source);
+    });
+
+    // inject a script tag to load it
+    cy.get("head", { log: false }).then(
+        (head) =>
+            new Promise((resolve, reject) => {
+                const script = document.createElement("script");
+                script.type = "text/javascript";
+                script.async = true;
+                script.onload = resolve;
+                script.onerror = (_e) => {
+                    // Unfortunately there does not seem to be a way to get a reason for the error.
+                    // The error event is useless.
+                    reject(new Error("Unable to load axe"));
+                };
+                script.src = "/_axe";
+                head.get()[0].appendChild(script);
+            }),
+    );
+});