Cypress - fix team page tests

app/views/team/_team.html.erb

@@ -41,11 +41,11 @@
     <% end %>
   <% end %>
 </td>
-<td id="delete-<%= member.id %>" class="table__data table__button_design" data-cy="delete-team-member-button">
+<td id="delete-<%= member.id %>" class="table__data table__button_design">
   <% if policy(:team).destroy? %>
     <%= link_to team_path(member), data: { confirm: "Are you sure?" }, method: :delete do %>
       <div class="w-6">
-        <%= image_tag 'delete_image_button.svg', class:"table__button" %>
+        <%= image_tag 'delete_image_button.svg', class:"table__button", "data-cy": "delete-team-member-button" %>
       </div>
     <% end %>
   <% end %>

cypress/constants/selectors/team.js

@@ -14,5 +14,5 @@ export const teamTabSelector = {
   newMemberEmail: dataCy("new-member-email"),
   adminRadioButton: dataCy("admin-radio-button"),
   employeeRadioButton: dataCy("employee-radio-button"),
-  sendInviteButton: dataCy("send-invite-button")
+  sendInviteButton: dataCy("send-invite-button"),
 };

cypress/integration/team/teamPageForAdmin.spec.js

@@ -1,5 +1,6 @@
-import { teamPath, signInPath } from "../../constants/routes/paths";
-import { navbarSelectors } from "../../constants/selectors/navbar";
+import { teamPath, signInPath, mailPath } from "../../constants/routes/paths";
+import { teamTabSelector } from "../../constants/selectors/team";
+import { addNewUser } from "../../support/utils/team";
 
 describe("Team page for Admin", () => {
   beforeEach(function () {
@@ -11,8 +12,25 @@ describe("Team page for Admin", () => {
     cy.visit(teamPath);
   });
 
-  it("should be able to add new user", function () {});
-  it("should display all column names", function () {});
-  it("should be able to update user details", function () {});
-  it("should be able to delete user", function () {});
+  it("should be able to add new Admin user", function () {
+    addNewUser("admin");
+    cy.reload();
+    // deleteTestUser();  -- to be fixed
+  });
+  it("should be able to add new Emp user", function () {
+    addNewUser();
+    // deleteTestUser();  -- to be fixed
+  });
+  it("should display all column names", function () {
+    cy.get(teamTabSelector.teamTableHeader).contains("PHOTO");
+    cy.get(teamTabSelector.teamTableHeader).contains("NAME");
+    cy.get(teamTabSelector.teamTableHeader).contains("EMAIL ID");
+    cy.get(teamTabSelector.teamTableHeader).contains("ROLE");
+  });
+  it("should be able to update user details", function () {
+    cy.get(teamTabSelector.teamTableRow)
+      .find(teamTabSelector.editTeamMemberButton)
+      .first()
+      .click();
+  });
 });

cypress/integration/team/teamPageForEmployee.spec.js

@@ -1,5 +1,6 @@
 import { teamPath, signInPath } from "../../constants/routes/paths";
-import { navbarSelectors } from "../../constants/selectors/navbar";
+import { teamTabSelector } from "../../constants/selectors/team";
+import { addNewUser } from "../../support/utils/team";
 
 describe("Team page for Employee", () => {
   beforeEach(function () {
@@ -11,7 +12,19 @@ describe("Team page for Employee", () => {
     cy.visit(teamPath);
   });
 
-  it("should be able to add new user", function () {});
-  it("should display all column names", function () {});
-  it("should be able to update user details", function () {});
+  it("should be not be able to add new user", function () {
+    cy.get(teamTabSelector.addNewUserButton).should("not.exist");
+  });
+  it("should display all column names", function () {
+    cy.get(teamTabSelector.teamTableHeader).contains("PHOTO");
+    cy.get(teamTabSelector.teamTableHeader).contains("NAME");
+    cy.get(teamTabSelector.teamTableHeader).contains("EMAIL ID");
+    cy.get(teamTabSelector.teamTableHeader).contains("ROLE");
+  });
+  it("should not see edit button", function () {
+    cy.get(teamTabSelector.editTeamMemberButton).should("not.exist");
+  });
+  it("should not see delete button", function () {
+    cy.get(teamTabSelector.deleteTeamMemberButton).should("not.exist");
+  });
 });

cypress/integration/team/teamPageForOwner.spec.js

@@ -12,16 +12,14 @@ describe("Team page for Owner", () => {
     cy.visit(teamPath);
   });
 
-  it.only("should be able to add new Admin user", function () {
+  it("should be able to add new Admin user", function () {
     addNewUser("admin");
     cy.reload();
+    // deleteTestUser();  -- to be fixed
   });
   it("should be able to add new Emp user", function () {
     addNewUser();
-
-    //delete user
-    cy.get(teamTabSelector.searchTeamMemberPlaceholder).clear().type("dummy");
-    cy.get(teamTabSelector.deleteTeamMemberButton).first().click();
+    // deleteTestUser();  -- to be fixed
   });
   it("should display all column names", function () {
     cy.get(teamTabSelector.teamTableHeader).contains("PHOTO");
@@ -35,10 +33,4 @@ describe("Team page for Owner", () => {
       .first()
       .click();
   });
-  it("should be able to delete user", function () {
-    //Add a team member and delete.
-    cy.get(teamTabSelector.teamTableRow).find(
-      teamTabSelector.deleteTeamMemberButton
-    );
-  });
 });

cypress/support/commands.js

@@ -27,23 +27,3 @@ Cypress.Commands.add("loginAsEmployee", function () {
   cy.get(authSelectors.signInButton).click();
   cy.location("pathname").should("eq", "/time-tracking");
 });
-
-//add new admin user from Team tab
-Cypress.Commands.add("addNewAdminUser", function () {
-  cy.get(teamTabSelector.addNewUserButton).click();
-  cy.get(teamTabSelector.newMemberFirstName).type("Dummy Admin FirstName");
-  cy.get(teamTabSelector.newMemberLastname).type("Dummy Admin LastName");
-  cy.get(teamTabSelector.newMemberEmail).type("test@email.com");
-  cy.get(teamTabSelector.adminRadioButton).check();
-  cy.get(teamTabSelector.sendInviteButton).click();
-});
-
-//add new employee user from Team tab
-Cypress.Commands.add("addNewEmpUser", function () {
-  cy.get(teamTabSelector.addNewUserButton).click();
-  cy.get(teamTabSelector.newMemberFirstName).type("Dummy Emp FirstName");
-  cy.get(teamTabSelector.newMemberLastname).type("Dummy Emp LastName");
-  cy.get(teamTabSelector.newMemberEmail).type("test@email.com");
-  cy.get(teamTabSelector.employeeRadioButton).check();
-  cy.get(teamTabSelector.sendInviteButton).click();
-});

cypress/support/utils/datacy.js

@@ -1,3 +1,3 @@
 export const dataCy = (value, suffix = "") => {
-    return `[data-cy='${value}']${suffix}`;
+  return `[data-cy='${value}']${suffix}`;
 };

cypress/support/utils/team.js

@@ -1,6 +1,6 @@
 import { teamTabSelector } from "../../constants/selectors/team";
 
-export const addNewUser = role => {
+export const addNewUser = (role) => {
   cy.get(teamTabSelector.addNewUserButton).click();
   cy.get(teamTabSelector.newMemberFirstName).type("Dummy Emp FirstName");
   cy.get(teamTabSelector.newMemberLastname).type("Dummy Emp LastName");