Add Test suit for Image Upload Functionality

cypress/e2e/facility_spec/FacilityCoverImage.cy.ts

@@ -0,0 +1,79 @@
+import FacilityPage from "pageobject/Facility/FacilityCreation";
+import FacilityHome from "pageobject/Facility/FacilityHome";
+import FacilityManage from "pageobject/Facility/FacilityManage";
+import LoginPage from "pageobject/Login/LoginPage";
+import { users } from "pageobject/utils/userConfig";
+
+interface IRoleAndFacility {
+  role: keyof typeof users;
+  facilityName: string;
+}
+
+const rolesAndFacility: IRoleAndFacility[] = [
+  {
+    role: "districtAdmin",
+    facilityName: "Dummy Facility 40",
+  },
+  {
+    role: "devDoctor",
+    facilityName: "Dummy Facility 4",
+  },
+];
+
+describe("Facility Cover Image Upload Functionality", () => {
+  const loginPage = new LoginPage();
+  const facilityPage = new FacilityPage();
+  const facilityHome = new FacilityHome();
+  const facilityManage = new FacilityManage();
+  const successUploadNotificationText = "Cover image updated.";
+
+  rolesAndFacility.forEach(({ role, facilityName }) => {
+    before(() => {
+      loginPage.loginByRole(role);
+      cy.saveLocalStorage();
+    });
+
+    beforeEach(() => {
+      cy.viewport(1920, 1080);
+      cy.restoreLocalStorage();
+      cy.clearLocalStorage(/filters--.+/);
+      cy.awaitUrl("/");
+      facilityHome.typeFacilitySearch(facilityName);
+      facilityPage.visitAlreadyCreatedFacility();
+    });
+
+    it(`Upload and Verify Cover Image Upload Functionality as ${role}`, () => {
+      // Test Visibility of Pop-up
+      facilityManage.clickCoverImage();
+      facilityManage.verifyUploadButtonVisible();
+      facilityManage.clickCancelCoverImage();
+      // Test Functionality of Upload Cover Image
+      facilityManage.interceptImageUploadRequest();
+      facilityManage.clickCoverImage();
+      facilityManage.uploadCoverImage("facility-cover-image.jpg");
+      facilityManage.clickSaveCoverImage();
+      facilityManage.verifyImageUploadRequest();
+      facilityManage.verifySuccessMessageVisibilityAndContent(
+        successUploadNotificationText,
+      );
+      // Test Edit Cover Image Functionality
+      facilityManage.interceptImageUploadRequest();
+      facilityManage.clickCoverImage();
+      facilityManage.uploadCoverImage("facility-cover-image-1.jpg");
+      facilityManage.clickSaveCoverImage();
+      facilityManage.verifyImageUploadRequest();
+      facilityManage.verifySuccessMessageVisibilityAndContent(
+        successUploadNotificationText,
+      );
+      // Test Delete Cover Image Functionality
+      facilityManage.clickCoverImage();
+      facilityManage.interceptImageDeleteRequest();
+      facilityManage.clickDeleteCoverImage();
+      facilityManage.verifyImageDeleteRequest();
+    });
+
+    afterEach(() => {
+      cy.saveLocalStorage();
+    });
+  });
+});

cypress/pageobject/Facility/FacilityManage.ts

@@ -18,6 +18,14 @@ class FacilityManage {
     cy.get("#save-cover-image").click();
   }
 
+  clickCancelCoverImage() {
+    cy.verifyAndClickElement("#cancel", "Cancel");
+  }
+
+  clickDeleteCoverImage() {
+    cy.verifyAndClickElement("#delete-cover-image", "Delete");
+  }
+
   verifyTotalDoctorCapacity(expectedCapacity: string) {
     cy.get("#facility-doctor-totalcapacity").contains(expectedCapacity);
   }
@@ -100,6 +108,26 @@ class FacilityManage {
     cy.get("#facility-add-bedtype").click();
   }
 
+  interceptImageUploadRequest() {
+    cy.intercept("POST", "**/api/v1/facility/*/cover_image/").as(
+      "imageUploadReq",
+    );
+  }
+
+  verifyImageUploadRequest() {
+    cy.wait("@imageUploadReq").its("response.statusCode").should("eq", 200);
+  }
+
+  interceptImageDeleteRequest() {
+    cy.intercept("DELETE", "**/api/v1/facility/*/cover_image/").as(
+      "imageDeleteReq",
+    );
+  }
+
+  verifyImageDeleteRequest() {
+    cy.wait("@imageDeleteReq").its("response.statusCode").should("eq", 204);
+  }
+
   visitViewPatients() {
     cy.intercept("GET", "**/api/v1/facility/**").as("getFacilityPatients");
     cy.get("#view-patient-facility-list").scrollIntoView().click();

public/locale/en.json

@@ -354,7 +354,6 @@
   "asset_type": "Asset Type",
   "assets": "Assets",
   "assign": "Assign",
-  "unassign":"Unassign",
   "assign_a_volunteer_to": "Assign a volunteer to {{name}}",
   "assign_bed": "Assign Bed",
   "assign_to_volunteer": "Assign to a Volunteer",
@@ -1444,6 +1443,7 @@
   "type_your_comment": "Type your comment",
   "type_your_reason_here": "Type your reason here",
   "unable_to_get_current_position": "Unable to get current position.",
+  "unassign": "Unassign",
   "unconfirmed": "Unconfirmed",
   "unique_id": "Unique Id",
   "unknown": "Unknown",
@@ -1558,8 +1558,8 @@
   "voice_autofill": "Voice Autofill",
   "volunteer_assigned": "Volunteer assigned successfully",
   "volunteer_contact": "Volunteer Contact",
-  "volunteer_update" : "Volunteer updated successfully",
   "volunteer_unassigned": "Volunteer unassigned successfully",
+  "volunteer_update": "Volunteer updated successfully",
   "ward": "Ward",
   "warranty_amc_expiry": "Warranty / AMC Expiry",
   "weekly_working_hours_error": "Average weekly working hours must be a number between 0 and 168",

src/components/Common/AvatarEditModal.tsx

@@ -282,6 +282,7 @@ const AvatarEditModal = ({
                 />
                 {imageUrl && (
                   <ButtonV2
+                    id="delete-cover-image"
                     variant="danger"
                     onClick={deleteAvatar}
                     disabled={isProcessing}