updated tests

cypress/component/mounting.cy.tsx

@@ -4,11 +4,11 @@ import Contact from "@/app/contactez-nous/page";
 
 const navbarFooterCheck = () => {
   it("includes navbar", () => {
-    cy.get("[data-cy='navbar']");
+    cy.getByData("navbar");
   });
 
   it("includes footer", () => {
-    cy.get("[data-cy='footer']");
+    cy.getByData("footer");
   });
 };
 
@@ -19,7 +19,7 @@ describe("Verify component mount", () => {
     });
 
     it("correct h1 tags with website name included", () => {
-      cy.get("[data-cy='header1']").contains("echecs france", {
+      cy.getByData("header1").contains("echecs france", {
         matchCase: false,
       });
     });
@@ -33,7 +33,7 @@ describe("Verify component mount", () => {
     });
 
     it("correct h1 tags with page title included", () => {
-      cy.get("[data-cy='header2']").contains("qui sommes-nous", {
+      cy.getByData("header2").contains("qui sommes-nous", {
         matchCase: false,
       });
     });
@@ -47,7 +47,7 @@ describe("Verify component mount", () => {
     });
 
     it("correct h1 tags with page title included", () => {
-      cy.get("[data-cy='header2']").contains("contactez-nous", {
+      cy.getByData("header2").contains("contactez-nous", {
         matchCase: false,
       });
     });

cypress/component/scroll.cy.tsx

@@ -4,12 +4,12 @@ describe("Scroll to top button", () => {
   it("desktop scroll button clickable", () => {
     cy.viewport("macbook-15");
     cy.mount(<ScrollToTopButton />);
-    cy.get("[data-cy='scroll-to-top-button']").should("exist").click();
+    cy.getByData("scroll-to-top-button").should("exist").click();
   });
 
   it("mobile scroll button clickable", () => {
     cy.viewport(600, 600);
     cy.mount(<ScrollToTopButton />);
-    cy.get("[data-cy='scroll-to-top-button']").should("exist").click();
+    cy.getByData("scroll-to-top-button").should("exist").click();
   });
 });

cypress/component/themeToggle.cy.tsx

@@ -7,17 +7,17 @@ describe("ThemeSwitcher component", () => {
     cy.mount(<ThemeSwitcher />);
 
     // checking that the toggle is there and light mode is active
-    cy.get("[data-cy='toggle']").should("exist");
-    cy.get("[data-cy='toggle']").should(($toggle) => {
+    cy.getByData("toggle").should("exist");
+    cy.getByData("toggle").should(($toggle) => {
       const backgroundImage = $toggle.css("background-image");
       expect(backgroundImage).to.include(
         "linear-gradient(rgb(0, 255, 255), rgb(135, 206, 235)"
       );
     });
     // checking that the toggle is clickable and dark mode is active
-    cy.get("[data-cy='toggle']").click();
-    cy.get("[data-cy='toggle-dark']").should("exist");
-    cy.get("[data-cy='toggle-dark']").should(($toggle) => {
+    cy.getByData("toggle").click();
+    cy.getByData("toggle-dark").should("exist");
+    cy.getByData("toggle-dark").should(($toggle) => {
       const backgroundImage = $toggle.css("background-image");
       expect(backgroundImage).to.include(
         "linear-gradient(rgb(25, 25, 112), rgb(102, 51, 153)"

cypress/e2e/data.cy.ts

@@ -2,7 +2,7 @@ let tableRows: number;
 describe("Data fetching for map", () => {
   it("map markers is equal to table rows", () => {
     cy.visit("/tournois");
-    cy.get('[data-cy="tournament-table"]')
+    cy.getByData("tournament-table")
       .find("tr")
       .then((rows) => {
         tableRows = rows.length - 1;

cypress/e2e/links.cy.ts

@@ -25,7 +25,7 @@ describe("Test links", () => {
     cy.viewport(600, 600);
     cy.visit("/");
     pages.forEach((page) => {
-      cy.get("[data-cy='hamburger-button']").click();
+      cy.getByData("hamburger-button").click();
       cy.contains(page, { matchCase: false }).click();
       cy.location("pathname").should("eq", `/${navLinkToSlug(page)}`); // url path matches link name, replacing whitespace with hyphens
       cy.go("back");

cypress/e2e/navbar.cy.ts

@@ -5,12 +5,12 @@ describe("Mobile Navbar", () => {
   });
 
   it("hamburger menu on mobile screens", () => {
-    cy.get("[data-cy='mobile-menu']").should("be.visible");
-    cy.get("[data-cy='desktop-menu']").should("be.not.visible");
+    cy.getByData("mobile-menu").should("be.visible");
+    cy.getByData("desktop-menu").should("be.not.visible");
   });
 
   it("hamburger button available", () => {
-    cy.get("[data-cy='hamburger-button']").should("be.visible");
+    cy.getByData("hamburger-button").should("be.visible");
   });
 });
 
@@ -21,11 +21,11 @@ describe("Desktop Navbar", () => {
   });
 
   it("desktop menu on larger screens", () => {
-    cy.get("[data-cy='mobile-menu']").should("be.hidden");
-    cy.get("[data-cy='desktop-menu']").should("be.not.hidden");
+    cy.getByData("mobile-menu").should("be.hidden");
+    cy.getByData("desktop-menu").should("be.not.hidden");
   });
 
   it("hamburger button hidden", () => {
-    cy.get("[data-cy='hamburger-button']").should("be.not.visible");
+    cy.getByData("hamburger-button").should("be.not.visible");
   });
 });

cypress/e2e/scroll.cy.ts

@@ -5,8 +5,8 @@ describe("Scroll to top button", () => {
 
   it("desktop scroll to top", () => {
     cy.viewport(1024, 800);
-    cy.get("[data-cy='tournament-table-div']").scrollTo("bottom");
-    cy.get("[data-cy='scroll-to-top-button']").click();
+    cy.getByData("tournament-table-div").scrollTo("bottom");
+    cy.getByData("scroll-to-top-button").click();
     // cy.get("[data-cy='tournament-table-div']")
     //   .invoke("scrollTop")
     //   .should("equal", 0);
@@ -20,7 +20,7 @@ describe("Scroll to top button", () => {
     cy.viewport(600, 600);
     cy.scrollTo("bottom");
     cy.window().its("scrollY").should("not.equal", 0);
-    cy.get("[data-cy='scroll-to-top-button']").click();
+    cy.getByData("scroll-to-top-button").click();
     cy.window().its("scrollY").should("equal", 0);
   });
 });

cypress/support/commands.ts

@@ -5,7 +5,7 @@ declare namespace Cypress {
 }
 
 Cypress.Commands.add("getByData", (selector) => {
-  return cy.get(`[data-cy=${selector}]`);
+  return cy.get(`[data-test=${selector}]`);
 });
 
 /// <reference types="cypress" />

cypress/support/component-index.html

@@ -11,4 +11,4 @@
   <body>
     <div data-cy-root></div>
   </body>
-</html>
+</html>