New Cypress Test | Advance Filters Functionality | User Tab

cypress/e2e/users_spec/user_crud.cy.ts

@@ -11,8 +11,8 @@ const makeid = (length: number) => {
 };
 
 const username = makeid(25);
-const phone_number = 9999999999;
-const alt_phone_number = 9999999999;
+const phone_number = "9999999999";
+const alt_phone_number = "9999999999";
 
 describe("User management", () => {
   before(() => {

cypress/e2e/users_spec/user_homepage.cy.ts

@@ -4,11 +4,14 @@ import { cy, describe, before, beforeEach, it, afterEach } from "local-cypress";
 import LoginPage from "../../pageobject/Login/LoginPage";
 import { UserPage } from "../../pageobject/Users/UserSearch";
 
-describe("Asset Tab", () => {
+describe("User Homepage", () => {
   const userPage = new UserPage();
   const usernameToTest = "devdoctor";
   const currentuser = "devdistrictadmin";
   const loginPage = new LoginPage();
+  const phone_number = "9876543219";
+  const alt_phone_number = "9876543219";
+
   before(() => {
     loginPage.loginAsDisctrictAdmin();
     cy.saveLocalStorage();
@@ -19,6 +22,38 @@ describe("Asset Tab", () => {
     cy.awaitUrl("/users");
   });
 
+  it("User advance filter functionality", () => {
+    userPage.clickAdvancedFilters();
+    userPage.typeInFirstName("Dev");
+    userPage.typeInLastName("Doctor");
+    userPage.selectRole("Doctor");
+    userPage.selectDistrict("Ernakulam");
+    userPage.typeInPhoneNumber(phone_number);
+    userPage.typeInAltPhoneNumber(alt_phone_number);
+    userPage.applyFilter();
+    userPage.verifyUrlafteradvancefilter();
+    userPage.checkUsernameText(usernameToTest);
+    userPage.verifyDataTestIdText("First Name", "First Name: Dev");
+    userPage.verifyDataTestIdText("Last Name", "Last Name: Doctor");
+    userPage.verifyDataTestIdText(
+      "Phone Number",
+      "Phone Number: +919876543219"
+    );
+    userPage.verifyDataTestIdText(
+      "WhatsApp no.",
+      "WhatsApp no.: +919876543219"
+    );
+    userPage.verifyDataTestIdText("Role", "Role: Doctor");
+    userPage.verifyDataTestIdText("District", "District: Ernakulam");
+    userPage.clearFilters();
+    userPage.verifyDataTestIdNotVisible("First Name");
+    userPage.verifyDataTestIdNotVisible("Last Name");
+    userPage.verifyDataTestIdNotVisible("Phone Number");
+    userPage.verifyDataTestIdNotVisible("WhatsApp no.");
+    userPage.verifyDataTestIdNotVisible("Role");
+    userPage.verifyDataTestIdNotVisible("District");
+  });
+
   it("Search by username", () => {
     userPage.checkSearchInputVisibility();
     userPage.typeInSearchInput(usernameToTest);
@@ -33,6 +68,7 @@ describe("Asset Tab", () => {
     userPage.checkUsernameBadgeVisibility(false);
     userPage.checkUsernameText(currentuser);
   });
+
   afterEach(() => {
     cy.saveLocalStorage();
   });

cypress/pageobject/Users/UserSearch.ts

@@ -22,6 +22,16 @@ export class UserPage {
     cy.url().should("include", `username=${username}`);
   }
 
+  verifyUrlafteradvancefilter() {
+    cy.url()
+      .should("include", "first_name=Dev")
+      .and("include", "last_name=Doctor")
+      .and("include", "phone_number=%2B919876543219")
+      .and("include", "alt_phone_number=%2B919876543219")
+      .and("include", "user_type=Doctor")
+      .and("include", "district_id=7");
+  }
+
   checkUsernameText(username: string) {
     cy.get(this.usernameText).should("have.text", username);
   }
@@ -34,4 +44,51 @@ export class UserPage {
   clickRemoveIcon() {
     cy.get(this.removeIcon).click();
   }
+
+  clickAdvancedFilters() {
+    cy.get("#advanced-filter").contains("Advanced Filters").click();
+  }
+
+  typeInFirstName(firstName: string) {
+    cy.get("#first_name").click().type(firstName);
+  }
+
+  typeInLastName(lastName: string) {
+    cy.get("#last_name").click().type(lastName);
+  }
+
+  selectRole(role: string) {
+    cy.get("#role button").click();
+    cy.get("[role='option']").contains(role).click();
+  }
+
+  selectDistrict(district: string) {
+    cy.get("input[name='district']").click().type(district);
+    cy.get("[role='option']").contains(district).click();
+  }
+
+  typeInPhoneNumber(phone: string) {
+    cy.get("#phone_number").click().type(phone);
+  }
+
+  typeInAltPhoneNumber(altPhone: string) {
+    cy.get("#alt_phone_number").click().type(altPhone);
+  }
+
+  applyFilter() {
+    cy.get("#apply-filter").click();
+  }
+
+  verifyDataTestIdText(testId: string, text: string) {
+    cy.get(`[data-testid="${testId}"]`).contains(text).should("be.visible");
+  }
+
+  clearFilters() {
+    this.clickAdvancedFilters();
+    cy.get("#clear-filter").contains("Clear").click();
+  }
+
+  verifyDataTestIdNotVisible(testId: string) {
+    cy.get(`[data-testid="${testId}"]`).should("not.be.visible");
+  }
 }