Add Cypress Test Suite for Sample Test Request Workflow

cypress/e2e/sample_test_spec/SampleTestRequest.cy.ts

@@ -0,0 +1,42 @@
+import { SampleTestPage } from "pageobject/Sample/SampleTestCreate";
+
+describe("Sample Test", () => {
+  const sampleTestPage = new SampleTestPage();
+  const sampleTestType = "BA/ETA",
+    icmrCategory = "Cat 0",
+    icmrLabel = "Test Icmr Label";
+
+  before(() => {
+    cy.loginByApi("devdistrictadmin", "Coronasafe@123");
+    cy.saveLocalStorage();
+  });
+
+  beforeEach(() => {
+    cy.restoreLocalStorage();
+    cy.clearLocalStorage(/filters--.+/);
+  });
+
+  it("should request a new sample test", () => {
+    sampleTestPage.visitPatientPage();
+    sampleTestPage.visitPatientDashboardPage();
+    sampleTestPage.visitSampleRequestPage();
+
+    // Fill form fields
+    sampleTestPage.selectSampleType(sampleTestType);
+    sampleTestPage.selectIcmrCategory(icmrCategory);
+    sampleTestPage.typeIcmrLabel(icmrLabel);
+
+    // Submit the form
+    sampleTestPage.submitForm();
+
+    // Check for sample request notification and history
+    sampleTestPage.clickOnNotification();
+    sampleTestPage.checkRequestHistory();
+  });
+
+  it("should verify sample request on sample page", () => {
+    sampleTestPage.visitSamplePage();
+    sampleTestPage.searchPatientSample(sampleTestPage.patientName);
+    sampleTestPage.patientSampleMustExist();
+  });
+});

cypress/pageobject/Sample/SampleTestCreate.ts

@@ -0,0 +1,79 @@
+export class SampleTestPage {
+  sampleTestReportHistory = 0;
+  patientName = ""; // to search for patient in sample page
+
+  visitPatientPage() {
+    cy.awaitUrl("/patients");
+  }
+
+  visitPatientDashboardPage() {
+    cy.get(".patient-stable-ring").first().scrollIntoView();
+    cy.get(".patient-stable-ring").should("be.visible").first().click();
+    cy.get("#patient-name")
+      .invoke("text")
+      .then((patientName) => {
+        this.patientName = patientName.trim();
+      });
+    cy.get("#patient-details").should("be.visible").click();
+  }
+
+  visitSampleRequestPage() {
+    cy.get("body").then(($body) => {
+      if ($body.find("#sample-test-history").length > 0) {
+        cy.get("#sample-test-history")
+          .its("length")
+          .then((count) => {
+            this.sampleTestReportHistory = count;
+          });
+      } else {
+        // Set to 0 if the element does not exist
+        this.sampleTestReportHistory = 0;
+      }
+    });
+    cy.get("#sample-request-btn").scrollIntoView();
+    cy.get("#sample-request-btn").should("be.visible").click();
+  }
+
+  selectSampleType(option: string) {
+    cy.get("#sample-type").should("be.visible").click();
+    cy.get("[role='option']").contains(option).click();
+  }
+
+  selectIcmrCategory(option: string) {
+    cy.get("#icmr-category").should("be.visible").click();
+    cy.get("[role='option']").contains(option).click();
+  }
+
+  typeIcmrLabel(label: string) {
+    cy.get("#icmr-label").should("be.visible").type(label);
+  }
+
+  submitForm() {
+    cy.get("#sample-test-submit-btn").scrollIntoView();
+    cy.get("#sample-test-submit-btn").should("be.visible").click();
+  }
+
+  clickOnNotification() {
+    cy.get(".pnotify-container").should("be.visible").click();
+  }
+
+  checkRequestHistory() {
+    cy.get("#sample-test-history").scrollIntoView();
+    cy.get("#sample-test-history").should(
+      "have.length",
+      this.sampleTestReportHistory + 1,
+    );
+  }
+
+  visitSamplePage() {
+    cy.awaitUrl("/sample");
+  }
+
+  searchPatientSample() {
+    cy.get("#search_patient_name").should("be.visible").type(this.patientName);
+  }
+
+  patientSampleMustExist() {
+    cy.get("#sample-card").should("be.visible");
+  }
+}

src/components/Patient/PatientHome.tsx

@@ -1370,6 +1370,7 @@ export const PatientHome = (props: any) => {
                       )
                     }
                     authorizeFor={NonReadOnlyUsers}
+                    id="sample-request-btn"
                   >
                     <span className="flex w-full items-center justify-start gap-2">
                       <CareIcon icon="l-medkit" className="text-xl" />

src/components/Patient/PatientInfoCard.tsx

@@ -255,7 +255,7 @@ export default function PatientInfoCard(props: {
                 className="mb-2 flex flex-col justify-center text-xl font-semibold capitalize lg:hidden"
                 id="patient-name-consultation"
               >
-                {patient.name}
+                <span id="patient-name">{patient.name}</span>
                 <div className="ml-3 mr-2 mt-[6px] text-sm font-semibold text-secondary-600">
                   {formatPatientAge(patient, true)} • {patient.gender}
                 </div>

src/components/Patient/SampleTest.tsx

@@ -212,6 +212,7 @@ export const SampleTest = ({ facilityId, patientId }: any) => {
           options={SAMPLE_TYPE_CHOICES}
           optionLabel={(option) => option.text}
           optionValue={(option) => option.id}
+          id="sample-type"
         />
 
         {state.form.sample_type === "OTHER TYPE" && (
@@ -226,6 +227,7 @@ export const SampleTest = ({ facilityId, patientId }: any) => {
           options={ICMR_CATEGORY}
           optionLabel={(option) => option}
           optionValue={(option) => option}
+          id="icmr-category"
         />
         <div className="mb-6 flex flex-col gap-1">
           <p className="font-medium">
@@ -251,7 +253,11 @@ export const SampleTest = ({ facilityId, patientId }: any) => {
           </span>
         </div>
 
-        <TextFormField {...field("icmr_label", "ICMR Label")} required />
+        <TextFormField
+          {...field("icmr_label", "ICMR Label")}
+          required
+          id="icmr-label"
+        />
         <div className="mb-6 w-full flex-none">
           <FieldLabel>Testing Facility</FieldLabel>
           <FacilitySelect
@@ -313,7 +319,11 @@ export const SampleTest = ({ facilityId, patientId }: any) => {
         />
         <div className="mt-4 flex flex-col justify-end gap-2 lg:flex-row">
           <Cancel onClick={() => goBack()} />
-          <Submit onClick={handleSubmit} label={buttonText} />
+          <Submit
+            onClick={handleSubmit}
+            label={buttonText}
+            id="sample-test-submit-btn"
+          />
         </div>
       </form>
     </Page>

src/components/Patient/SampleTestCard.tsx

@@ -76,6 +76,7 @@ export const SampleTestCard = (props: SampleDetailsProps) => {
 
   return (
     <div
+      id="sample-test-history"
       className={`${
         itemData.result === "POSITIVE"
           ? "border-red-500 bg-red-100 hover:border-red-700"

src/components/Patient/SampleViewAdmin.tsx

@@ -146,6 +146,7 @@ export default function SampleViewAdmin() {
                   ? "border-primary-700 bg-primary-100"
                   : "bg-white"
             }`}
+            id="sample-card"
           >
             <div className="flex h-full flex-col justify-between px-6 py-4">
               <div>
@@ -345,6 +346,7 @@ export default function SampleViewAdmin() {
           <div className="flex w-full flex-col gap-3">
             <SearchInput
               name="patient_name"
+              id="search_patient_name"
               value={qParams.patient_name}
               onChange={(e) => updateQuery({ [e.name]: e.value })}
               placeholder="Search patient"