Merge pull request #456 from primeroIMS/trigyn-testcase-incidents-from-case

Trigyn testcase incidents from case

Author: aespinoza-quoin

app/javascript/components/incidents-from-case/components/detail/component.spec.js

@@ -0,0 +1,49 @@
+import { mountedComponent, screen } from "test-utils";
+import { fromJS } from "immutable";
+
+import { RECORD_TYPES } from "../../../../config";
+
+import IncidentDetail from "./component";
+
+describe("<IncidentDetail /> - Component", () => {
+  const props = {
+    css: {
+      titleHeader: {}
+    },
+    handleSubmit: () => {},
+    incidentCaseId: "case-unique-id-1",
+    incidentCaseIdDisplay: "case-short-id-1",
+    incidentDateInterview: "2020-Oct-02",
+    incidentDate: "2020-Oct-01",
+    incidentUniqueID: "e25c5cb1-1257-472e-b2ec-05f568a3b51e",
+    incidentType: "test",
+    mode: { isShow: true, isEdit: false },
+    setFieldValue: () => {},
+    recordType: RECORD_TYPES.cases,
+    handleCreateIncident: () => {}
+  };
+
+  const initialState = fromJS({
+    user: {
+      permissions: {
+        incidents: ["read", "write"]
+      }
+    }
+  });
+
+  beforeEach(() => {
+    mountedComponent(<IncidentDetail {...props} />, initialState);
+  });
+
+  it("render IncidentDetail component", () => {
+    expect(screen.getByText("incidents.date_of_incident")).toBeInTheDocument();
+  });
+
+  it("render a DisplayData", () => {
+    expect(screen.getAllByTestId("display-data")).toHaveLength(3);
+  });
+
+  it("render a DisplayData with action button", () => {
+    expect(screen.getAllByRole("button")).toHaveLength(2);
+  });
+});

app/javascript/components/incidents-from-case/components/detail/component.unit.test.js

@@ -69,7 +69,7 @@ const Component = ({
   };
 
   return (
-    <div key={incident.get("unique_id")}>
+    <div key={incident.get("unique_id")} data-testid="panel">
       <Accordion expanded={expanded} onChange={handleExpanded} className={css.panel}>
         <AccordionSummary
           expandIcon={<ExpandMoreIcon />}

app/javascript/components/incidents-from-case/components/panel/component.jsx

@@ -1,20 +1,15 @@
 // Copyright (c) 2014 - 2023 UNICEF. All rights reserved.
 
 import { fromJS } from "immutable";
-import { Accordion, AccordionDetails, AccordionSummary } from "@material-ui/core";
+import { mountedComponent, screen } from "test-utils";
 
-import LookupValue from "../../../record-form/form/subforms/subform-header-lookup";
-import { setupMountedComponent } from "../../../../test";
-import IncidentSummary from "../summary";
-import IncidentDetail from "../detail";
 import { RECORD_TYPES } from "../../../../config";
-import * as R from "../../../record-form/records";
+import { FieldRecord } from "../../../record-form/records";
 import { mapEntriesToRecord } from "../../../../libs";
 
 import IncidentPanel from "./component";
 
 describe("<IncidentPanel /> - Component", () => {
-  let component;
   const props = {
     incident: fromJS({
       created_by: "primero_gbv",
@@ -101,51 +96,27 @@ describe("<IncidentPanel /> - Component", () => {
           }
         ]
       },
-      fields: mapEntriesToRecord(fields, R.FieldRecord)
+      fields: mapEntriesToRecord(fields, FieldRecord)
     }
   });
 
   beforeEach(() => {
-    ({ component } = setupMountedComponent(IncidentPanel, props, initialState));
+    mountedComponent(<IncidentPanel {...props} />, initialState);
   });
 
   it("render IncidentPanel component", () => {
-    expect(component.find(IncidentPanel)).to.have.length(1);
+    expect(screen.getByTestId("panel")).toBeInTheDocument();
   });
 
-  it("render a Accordions", () => {
-    expect(component.find(Accordion)).to.have.lengthOf(1);
-    expect(component.find(AccordionSummary)).to.have.lengthOf(1);
-    expect(component.find(AccordionDetails)).to.have.lengthOf(1);
+  it("render IncidentSummary component", () => {
+    expect(screen.getAllByTestId("incidentsummary")).toHaveLength(1);
   });
 
-  it("render a IncidentSummary", () => {
-    expect(component.find(IncidentSummary)).to.have.lengthOf(1);
+  it("render IncidentDetail component", () => {
+    expect(screen.getByText("incidents.date_of_incident")).toBeInTheDocument();
   });
 
-  it("render a IncidentDetail", () => {
-    expect(component.find(IncidentDetail)).to.have.lengthOf(1);
-  });
-
-  describe("with violence-type-lookup", () => {
-    it("should use the lookup defined in the option_strings_source", () => {
-      expect(component.find(IncidentDetail).find(LookupValue).props().optionsStringSource).to.equal(
-        "lookup-gbv-sexual-violence-type"
-      );
-    });
-
-    it("renders the translated value", () => {
-      expect(component.find(IncidentDetail).find(LookupValue).text()).to.equal("Test1");
-    });
-  });
-
-  it("renders component with valid props", () => {
-    const incidentsProps = { ...component.find(IncidentPanel).props() };
-
-    ["incident", "incidentCaseId", "css", "mode", "setFieldValue", "handleSubmit", "recordType"].forEach(property => {
-      expect(incidentsProps).to.have.property(property);
-      delete incidentsProps[property];
-    });
-    expect(incidentsProps).to.be.empty;
+  it("with violence-type-lookup-renders the translated value", () => {
+    expect(screen.getAllByText("Test1")).toHaveLength(2);
   });
 });

app/javascript/components/incidents-from-case/components/panel/component.unit.test.js app/javascript/components/incidents-from-case/components/panel/component.spec.js

@@ -7,7 +7,7 @@ import { NAME_SUMMARY } from "../../constants";
 
 const Component = ({ css, incidentDate, incidentType }) => {
   return (
-    <Grid container spacing={2} alignItems="center">
+    <Grid container spacing={2} alignItems="center" data-testid="incidentsummary">
       <Grid item md={10} xs={8}>
         <div className={css.wrapper}>
           <div className={css.titleHeader}>{incidentDate}</div>

app/javascript/components/incidents-from-case/components/summary/component.jsx

@@ -0,0 +1,22 @@
+import { mountedComponent, screen } from "test-utils";
+import { fromJS } from "immutable";
+
+import IncidentSummary from "./component";
+
+describe("<IncidentSummary /> - Component", () => {
+  const props = {
+    incidentDate: "2020-Oct-01",
+    css: {
+      titleHeader: {}
+    },
+    incidentType: <></>
+  };
+
+  beforeEach(() => {
+    mountedComponent(<IncidentSummary {...props} />, fromJS({}));
+  });
+
+  it("render IncidentSummary component", () => {
+    expect(screen.getByText("2020-Oct-01")).toBeInTheDocument();
+  });
+});