add e2e tests (#943)

components/design-system/HelpIcon.jsx

@@ -29,10 +29,19 @@ export const HelpIcon = ({ title, body, lang }) => {
 
       {showModal && (
         <div className="modal-bg">
-          <Modal show={showModal} onHide={handleClose} className="modal">
+          <Modal
+            show={showModal}
+            onHide={handleClose}
+            className="modal"
+            aria-label={title}
+          >
             <Modal.Header className="modal-header">
               <h2 className="modal-title">{title}</h2>
-              <button onClick={handleClose} className="modal-exit">
+              <button
+                onClick={handleClose}
+                className="modal-exit"
+                aria-label={lang === "en" ? "Close" : "Fermer"}
+              >
                 <svg
                   width="17"
                   height="17"

cypress/integration/404-page.spec.js

@@ -0,0 +1,24 @@
+describe("404 Error Page", () => {
+  beforeEach(() => {
+    cy.visit("/404", { failOnStatusCode: false });
+    cy.injectAxe();
+  });
+
+  it("has no a11y violations", () => {
+    cy.checkA11y();
+  });
+
+  it("page loaded", () => {
+    cy.url().should("equal", Cypress.config().baseUrl + "/en/404");
+  });
+
+  it("navigates to english homepage", () => {
+    cy.get('a[href*="/en/home"]').click();
+    cy.url().should("equal", Cypress.config().baseUrl + "/en/home");
+  });
+
+  it("navigates to french homepage", () => {
+    cy.get('a[href*="fr/accueil"]').click();
+    cy.url().should("equal", Cypress.config().baseUrl + "/fr/accueil");
+  });
+});

cypress/integration/500-page.spec.js

@@ -0,0 +1,25 @@
+describe("500 Error Page", () => {
+    beforeEach(() => {
+      cy.visit("/500", { failOnStatusCode: false });
+      cy.injectAxe();
+    });
+
+    it("has no a11y violations", () => {
+      cy.checkA11y();
+    });
+
+    it("page loaded", () => {
+      cy.url().should("equal", Cypress.config().baseUrl + "/en/500");
+    });
+
+    it("navigates to english homepage", () => {
+      cy.get('a[href*="/en/home"]').click();
+      cy.url().should("equal", Cypress.config().baseUrl + "/en/home");
+    });
+
+    it("navigates to french homepage", () => {
+      cy.get('a[href*="fr/accueil"]').click();
+      cy.url().should("equal", Cypress.config().baseUrl + "/fr/accueil");
+    });
+  });
+

cypress/integration/benefits-navigator.spec.js

@@ -0,0 +1,25 @@
+describe("Home Page", () => {
+    beforeEach(() => {
+      cy.visit("/en/projects/benefits-navigator");
+      cy.injectAxe();
+    });
+
+    it("has no a11y violations", () => {
+      cy.checkA11y();
+    });
+
+    it("loads page",()=>{
+        cy.url().should('equal',Cypress.config().baseUrl+'/en/projects/benefits-navigator')
+        cy.get('button.info').click()
+        cy.get('h2.modal-title').should('have.text','Alpha')
+    })
+
+    it("navigates to a project page", () => {
+      cy.get("a[href*=difficulties-community]").click();
+      cy.url().should(
+        "equal",
+        Cypress.config().baseUrl + "/en/projects/benefits-navigator/difficulties-community-workers-help-people-benefits"
+      );
+    });
+  });
+

cypress/integration/digital-standards-playbook.spec.js

@@ -0,0 +1,21 @@
+describe("Digital Standards Playbook Page", () => {
+    beforeEach(() => {
+      cy.visit("/en/projects/digital-standards-playbook");
+      cy.injectAxe();
+    });
+
+    it("has no a11y violations", () => {
+      cy.checkA11y();
+    });
+
+    it("loads page",()=>{
+        cy.url().should('equal',Cypress.config().baseUrl+'/en/projects/digital-standards-playbook')
+        cy.get('button.info').click()
+        cy.get('h2.modal-title').should('have.text','Discovery')
+    })
+
+    it("finds survey page", () => {
+      cy.get("a:contains('Take survey')").should('be.visible');
+    });
+  });
+

cypress/integration/error-page.spec.js

@@ -0,0 +1,24 @@
+describe("Error Page", () => {
+  beforeEach(() => {
+    cy.visit("/error", { failOnStatusCode: false });
+    cy.injectAxe();
+  });
+
+  it("has no a11y violations", () => {
+    cy.checkA11y();
+  });
+
+  it("page loaded", () => {
+    cy.url().should("equal", Cypress.config().baseUrl + "/en/error");
+  });
+
+  it("navigates to english homepage", () => {
+    cy.get('a[href*="/en/home"]').click();
+    cy.url().should("equal", Cypress.config().baseUrl + "/en/home");
+  });
+
+  it("navigates to french homepage", () => {
+    cy.get('a[href*="fr/accueil"]').click();
+    cy.url().should("equal", Cypress.config().baseUrl + "/fr/accueil");
+  });
+});

cypress/integration/home.spec.js

@@ -1,51 +1,23 @@
-import terminalLog from "../plugins/terminalLog";
-
-/* eslint-disable no-undef */
-/// <reference types="Cypress" />
-
-describe("home page", () => {
+describe("Home page", () => {
   beforeEach(() => {
-    cy.visit("/home");
+    cy.visit("/en/home");
     cy.injectAxe();
   });
 
-  it("landing page loaded", () => {
-    cy.url().should("contains", "/home");
-  });
-
-  it("Has no detectable a11y violations on load", () => {
-    cy.checkA11y(null, null, terminalLog);
-  });
-
-  it("Toggles content language when language button is clicked", () => {
-    cy.get('[data-cy="toggle-language-link"]').then(($link) => {
-      const txt = $link.text();
-      cy.get('[data-cy="toggle-language-link"]').click();
-      cy.get('[data-cy="toggle-language-link"]').should(($link2) => {
-        expect($link2.text()).not.to.eq(txt);
-      });
-    });
+  it("has no a11y violations", () => {
+    cy.checkA11y();
   });
 
-  it("Adds subpath for french pages", () => {
-    cy.get('[data-cy="toggle-language-link"]').click();
-    cy.url().should("eq", "http://localhost:3000/fr/accueil");
-  });
-  /* Commenting out the below for now to look into since it doesn't seem to be working with AEM
-  
-  it("See projects button goes to projects page (button at the bottom of the content)", () => {
-    cy.get('[dataCy="HOMEPAGE-VIEW-PROJECTS"]').click();
-    cy.url().should("include", "/projects");
-  });
-
-  it("See about button goes to about page (button at the bottom of the content)", () => {
-    cy.get('[dataCy="AboutButton"]').click();
-    cy.url().should("include", "/about");
-  });
+  it("toggles language",()=>{
+    cy.get("a:contains('Français')").click()
+    cy.url().should('equal',Cypress.config().baseUrl+'/fr/accueil')
+  })
 
-  it("See signup button (not in the nav menu) goes to signup page", () => {
-    cy.get('[dataCy="SIGN-UP-TO-GET-INVITED-TO-RESEARCH-SESSIONS"]').click();
-    cy.url().should("include", "/signup");
+  it("navigates to a project page", () => {
+    cy.get("a[href*=benefits-navigator]").click();
+    cy.url().should(
+      "equal",
+      Cypress.config().baseUrl + "/en/projects/benefits-navigator"
+    );
   });
-  */
 });

cypress/integration/index.spec.js

@@ -0,0 +1,24 @@
+describe("Index Page", () => {
+  beforeEach(() => {
+    cy.visit("/");
+    cy.injectAxe()
+  });
+
+  it("has no a11y violations",()=>{
+    cy.checkA11y()
+  })
+
+  it("index page loaded", () => {
+    cy.url().should('equal',Cypress.config().baseUrl+'/')
+  });
+
+  it("navigates to english homepage",() => {
+    cy.get('#english-button').click()
+    cy.url().should('equal',Cypress.config().baseUrl+'/en/home')
+  })
+
+  it("navigates to french homepage",() => {
+    cy.get('#french-button').click()
+    cy.url().should('equal',Cypress.config().baseUrl+'/fr/accueil')
+  })
+});

cypress/integration/msca-dashboard.spec.js

@@ -0,0 +1,18 @@
+describe("MSCA Dashboard Page", () => {
+    beforeEach(() => {
+      cy.visit("/en/projects/dashboard");
+      cy.injectAxe();
+    });
+
+    it("has no a11y violations", () => {
+      cy.checkA11y();
+    });
+
+    it("loads page",()=>{
+        cy.url().should('equal',Cypress.config().baseUrl+'/en/projects/dashboard')
+        cy.get('button.info').click()
+        cy.get('h2.modal-title').should('have.text','Alpha')
+    })
+
+  });
+

cypress/integration/not-supported-page.spec.js

@@ -0,0 +1,14 @@
+describe("Not Supported Page", () => {
+  beforeEach(() => {
+    cy.visit("/notsupported", { failOnStatusCode: false });
+    cy.injectAxe();
+  });
+
+  it("has no a11y violations", () => {
+    cy.checkA11y();
+  });
+
+  it("page loaded", () => {
+    cy.url().should("equal", Cypress.config().baseUrl + "/en/notsupported");
+  });
+});

cypress/integration/oas-estimator.spec.js

@@ -0,0 +1,25 @@
+describe("OAS Estimator Page", () => {
+    beforeEach(() => {
+      cy.visit("/en/projects/oas-benefits-estimator");
+      cy.injectAxe();
+    });
+
+    it("has no a11y violations", () => {
+      cy.checkA11y();
+    });
+
+    it("loads page",()=>{
+        cy.url().should('equal',Cypress.config().baseUrl+'/en/projects/oas-benefits-estimator')
+        cy.get('button.info').click()
+        cy.get('h2.modal-title').should('have.text','Beta')
+    })
+
+    it("navigates to a project page", () => {
+      cy.get("a[href*=what-we-learned]").click();
+      cy.url().should(
+        "equal",
+        Cypress.config().baseUrl + "/en/projects/oas-benefits-estimator/what-we-learned"
+      );
+    });
+  });
+

cypress/support/index.js

@@ -14,23 +14,23 @@
 // ***********************************************************
 
 // Import commands.js using ES2015 syntax:
-import './commands'
+import "./commands";
 
 // Import cypress-axe
-import 'cypress-axe'
+import "cypress-axe";
 
 // Alternatively you can use CommonJS syntax:
 // require('./commands')
 
 // Set default language for all tests that do not test the Splash page
 before(() => {
   // Set language in cypress instance localstorage to skip the splash page
-  cy.setLanguage()
+  cy.setLanguage();
   // Save localstorage
-  cy.saveLocalStorage()
-})
+  cy.saveLocalStorage();
+});
 
 beforeEach(() => {
   // Restore localstorage to initial state before each test
   cy.restoreLocalStorage();
-})
+});