Refactor table component tests to be more resilient to new columns

Author: ml-evs

webapp/cypress/component/EquipmentTableTest.cy.jsx

@@ -87,54 +87,60 @@ describe("EquipmentTable Component Tests", () => {
   });
 
   it("displays data from the Vuex store", () => {
-    cy.get(".p-datatable-tbody")
-      .find("tr")
-      .eq(0)
-      .within(() => {
-        cy.get("td").eq(0).should("contain.text", "");
-        cy.get("td").eq(1).should("contain.text", "equipment1");
-        cy.get("td").eq(3).should("contain.text", "Equipment One");
-        cy.get("td").eq(4).should("contain.text", "9/1/2023");
-        cy.get("td").eq(5).should("contain.text", "Warehouse A");
-        cy.get("td").eq(6).find(".avatar").should("have.length", 1);
-      });
+    cy.getColumnIndices({ checkbox: 0 }).then((columnIndices) => {
+      // First row - equipment1
+      cy.get(".p-datatable-tbody")
+        .find("tr")
+        .eq(0)
+        .within(() => {
+          cy.get("td").eq(columnIndices["ID"]).should("contain.text", "equipment1");
+          cy.get("td").eq(columnIndices["Name"]).should("contain.text", "Equipment One");
+          cy.get("td").eq(columnIndices["Date"]).should("contain.text", "9/1/2023");
+          cy.get("td").eq(columnIndices["Location"]).should("contain.text", "Warehouse A");
+          cy.get("td").eq(columnIndices["Maintainers"]).find(".avatar").should("have.length", 1);
+        });
 
-    cy.get(".p-datatable-tbody")
-      .find("tr")
-      .eq(1)
-      .within(() => {
-        cy.get("td").eq(0).should("contain.text", "");
-        cy.get("td").eq(1).should("contain.text", "equipment2");
-        cy.get("td").eq(3).should("contain.text", "Equipment Two");
-        cy.get("td").eq(4).should("contain.text", "8/15/2023");
-        cy.get("td").eq(5).should("contain.text", "Warehouse B");
-        cy.get("td").eq(6).find(".avatar").should("have.length", 2);
-      });
+      // Second row - equipment2
+      cy.get(".p-datatable-tbody")
+        .find("tr")
+        .eq(1)
+        .within(() => {
+          cy.get("td").eq(columnIndices["ID"]).should("contain.text", "equipment2");
+          cy.get("td").eq(columnIndices["Name"]).should("contain.text", "Equipment Two");
+          cy.get("td").eq(columnIndices["Date"]).should("contain.text", "8/15/2023");
+          cy.get("td").eq(columnIndices["Location"]).should("contain.text", "Warehouse B");
+          cy.get("td").eq(columnIndices["Maintainers"]).find(".avatar").should("have.length", 2);
+        });
+    });
   });
 
   it("renders the component FormattedItemName", () => {
-    cy.get(".p-datatable-tbody tr")
-      .eq(0)
-      .within(() => {
-        cy.get("td").eq(1).find(".formatted-item-name").should("exist");
-      });
-    cy.get(".p-datatable-tbody tr")
-      .eq(1)
-      .within(() => {
-        cy.get("td").eq(1).find(".formatted-item-name").should("exist");
-      });
+    cy.getColumnIndices({ checkbox: 0 }).then((columnIndices) => {
+      cy.get(".p-datatable-tbody tr")
+        .eq(0)
+        .within(() => {
+          cy.get("td").eq(columnIndices["ID"]).find(".formatted-item-name").should("exist");
+        });
+      cy.get(".p-datatable-tbody tr")
+        .eq(1)
+        .within(() => {
+          cy.get("td").eq(columnIndices["ID"]).find(".formatted-item-name").should("exist");
+        });
+    });
   });
 
   it("renders the component Creators", () => {
-    cy.get(".p-datatable-tbody tr")
-      .eq(0)
-      .within(() => {
-        cy.get("td").eq(6).find(".avatar").should("exist");
-      });
-    cy.get(".p-datatable-tbody tr")
-      .eq(1)
-      .within(() => {
-        cy.get("td").eq(6).find(".avatar").should("exist");
-      });
+    cy.getColumnIndices({ checkbox: 0 }).then((columnIndices) => {
+      cy.get(".p-datatable-tbody tr")
+        .eq(0)
+        .within(() => {
+          cy.get("td").eq(columnIndices["Maintainers"]).find(".avatar").should("exist");
+        });
+      cy.get(".p-datatable-tbody tr")
+        .eq(1)
+        .within(() => {
+          cy.get("td").eq(columnIndices["Maintainers"]).find(".avatar").should("exist");
+        });
+    });
   });
 });