Skip to content
This repository has been archived by the owner on Sep 11, 2024. It is now read-only.

Commit

Permalink
Fix CSP problems due to cypress-axe
Browse files Browse the repository at this point in the history
Rewrite `injectAxe` to use a script tag instead of an `eval`.
  • Loading branch information
richvdh committed May 10, 2023
1 parent 456c66d commit a2b8bf9
Showing 1 changed file with 32 additions and 0 deletions.
32 changes: 32 additions & 0 deletions cypress/support/axe.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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);
}),
);
});

0 comments on commit a2b8bf9

Please sign in to comment.