Adding

2026-03-23 11:21:52 -05:00
parent de9ddd5001
commit a17bc4b4a9
426 changed files with 60574 additions and 1 deletions
@@ -0,0 +1,586 @@
+/* eslint-disable @typescript-eslint/quotes */
+import React from "react";
+import { mount, shallow } from "enzyme";
+import DepartmentTableRow from "./DepartmentTableRow";
+import Translate from "../../translate/Translate";
+import { IDepartment } from "../../shared/models/Department";
+import ViewDepartmentTableRow from "./ViewDepartmentTableRow";
+
+let wrapper: any;
+
+const mockUniqueFunction = jest.fn();
+const mockSubmitFunction = jest.fn();
+
+export interface IFakePermissionProps {
+    requiredPermissions: string[];
+    showWarning?: boolean;
+    children: JSX.Element;
+}
+
+export const FakePermissionGuard: React.FC<IFakePermissionProps> = (props) => {
+    return props.children;
+};
+
+jest.mock("../../containers/shared/PermissionGuard", () => FakePermissionGuard);
+
+beforeEach(() => {
+    mockUniqueFunction.mockReturnValue(true);
+    wrapper = mount(
+        <table>
+            <tbody>
+                <DepartmentTableRow
+                    department={
+                        {
+                            id: 4,
+                            departmentName: "testName",
+                            businessLineCode: "bl2",
+                            regionCode: "",
+                            state: "Active"
+                        } as IDepartment
+                    }
+                    updateDepartment={(department) =>
+                        mockSubmitFunction(department)
+                    }
+                    isDepartmentNameUnique={(deptName) => {
+                        return mockUniqueFunction();
+                    }}
+                    businessLines={[
+                        { name: "businessLine1", code: "bl1", orgCode: "ORG" },
+                        { name: "businessLine2", code: "bl2", orgCode: "ORG" }
+                    ]}
+                    departmentStateSet={{
+                        Avctive: "Active",
+                        Inactive: "Inactive"
+                    }}
+                    regions={[
+                        {
+                            name: "North",
+                            businessLineCode: "BCHOPS",
+                            code: "NORTH"
+                        },
+                        {
+                            name: "South",
+                            businessLineCode: "BCHOPS",
+                            code: "SOUTH"
+                        }
+                    ]}
+                />
+            </tbody>
+        </table>
+    );
+});
+
+describe("User Views a DepartmentTableRow", () => {
+    it("Displays Proper Department Data", () => {
+        let x = 0;
+        const temp = () => {
+            x++;
+        };
+        const tempWrapper = shallow(
+            <ViewDepartmentTableRow
+                department={
+                    {
+                        id: 4,
+                        departmentName: "testName",
+                        businessLineCode: "123",
+                        state: "Active"
+                    } as IDepartment
+                }
+                toggleEdit={temp}
+            />
+        );
+
+        expect(tempWrapper.find('[data-test="department_tr_4"]').length).toBe(
+            1
+        );
+        expect(tempWrapper.find('[data-test="edit-row"]').length).toBe(0);
+        expect(tempWrapper.find("td").length).toBe(6);
+        expect(tempWrapper.find('[data-test="dept-name"]').length).toBe(1);
+        expect(tempWrapper.find('[data-test="business-line"]').length).toBe(1);
+        expect(tempWrapper.find('[data-test="dept-state"]').length).toBe(1);
+        expect(
+            tempWrapper.find("td").find("Button").children().text()
+        ).toContain(
+            Translate.Get.components.departmentTable.departmentTableRow
+                .editButton
+        );
+    });
+});
+
+describe("Associate Can Toggle and Make Edits", () => {
+    test("Clicking Edit Button Opens Edit", () => {
+        wrapper.find("Button").simulate("click");
+        wrapper.update();
+
+        expect(wrapper.find('[data-test="display-row"]').length).toBe(0);
+        expect(wrapper.find('[data-test="edit-row"]').length).toBe(1);
+        expect(wrapper.find("td").length).toBe(6);
+        expect(
+            wrapper.find('[data-test="dept-name-input"]').hostNodes().length
+        ).toBe(1);
+        expect(
+            wrapper.find('[data-test="business-line-input"]').hostNodes().length
+        ).toBe(1);
+        expect(
+            wrapper.find('[data-test="region-input"]').hostNodes().length
+        ).toBe(1);
+        expect(
+            wrapper.find('[data-test="dept-state-input"]').hostNodes().length
+        ).toBe(1);
+        expect(
+            wrapper.find('[data-test="submit-button"]').hostNodes().text()
+        ).toContain(
+            Translate.Get.components.departmentTable.departmentTableRow
+                .saveUpdateButton
+        );
+        expect(
+            wrapper.find('[data-test="clear-button"]').hostNodes().length
+        ).toBe(1);
+    });
+
+    test("Initial Values are Set Properly", () => {
+        wrapper.find("Button").simulate("click");
+        wrapper.update();
+
+        expect(wrapper.find('[data-test="display-row"]').length).toBe(0);
+        expect(wrapper.find('[data-test="edit-row"]').length).toBe(1);
+        expect(wrapper.find("td").length).toBe(6);
+        expect(
+            wrapper
+                .find('[data-test="dept-name-input"]')
+                .hostNodes()
+                .prop("value")
+        ).toBe("testName");
+        expect(
+            wrapper
+                .find('[data-test="business-line-input"]')
+                .hostNodes()
+                .prop("value")
+        ).toBe("bl2");
+        expect(
+            wrapper.find('[data-test="region-input"]').hostNodes().prop("value")
+        ).toBe("");
+        expect(
+            wrapper
+                .find('[data-test="dept-state-input"]')
+                .hostNodes()
+                .prop("value")
+        ).toBe("Active");
+        expect(
+            wrapper.find('[data-test="submit-button"]').hostNodes().text()
+        ).toContain(
+            Translate.Get.components.departmentTable.departmentTableRow
+                .saveUpdateButton
+        );
+        expect(
+            wrapper.find('[data-test="clear-button"]').hostNodes().length
+        ).toBe(1);
+    });
+
+    test("Updating Values Updates State", () => {
+        wrapper.find("Button").simulate("click");
+        wrapper.update();
+
+        expect(wrapper.find('[data-test="display-row"]').length).toBe(0);
+        expect(wrapper.find('[data-test="edit-row"]').length).toBe(1);
+        expect(wrapper.find("td").length).toBe(6);
+        wrapper
+            .find('[data-test="dept-name-input"]')
+            .hostNodes()
+            .simulate("change", { target: { value: "NewName" } });
+        wrapper
+            .find('[data-test="business-line-input"]')
+            .hostNodes()
+            .simulate("change", { target: { value: "bl1" } });
+        wrapper
+            .find('[data-test="region-input"]')
+            .hostNodes()
+            .simulate("change", { target: { value: "NORTH" } });
+        wrapper
+            .find('[data-test="dept-state-input"]')
+            .hostNodes()
+            .simulate("change", { target: { value: "Inactive" } });
+        wrapper.update();
+        expect(
+            wrapper
+                .find('[data-test="dept-name-input"]')
+                .hostNodes()
+                .prop("value")
+        ).toBe("NewName");
+        expect(
+            wrapper
+                .find('[data-test="business-line-input"]')
+                .hostNodes()
+                .prop("value")
+        ).toBe("bl1");
+        expect(
+            wrapper.find('[data-test="region-input"]').hostNodes().prop("value")
+        ).toBe("NORTH");
+        expect(
+            wrapper
+                .find('[data-test="dept-state-input"]')
+                .hostNodes()
+                .prop("value")
+        ).toBe("Inactive");
+    });
+
+    test("Only - allowed as special charcter", () => {
+        wrapper.find("Button").simulate("click");
+        wrapper.update();
+
+        expect(wrapper.find("td").length).toBe(6);
+        wrapper
+            .find('[data-test="dept-name-input"]')
+            .hostNodes()
+            .simulate("change", {
+                target: { value: "New-Name Name.!@#$!#@$" }
+            });
+        wrapper.update();
+        expect(
+            wrapper
+                .find('[data-test="dept-name-input"]')
+                .hostNodes()
+                .prop("value")
+        ).toBe("New-NameName");
+    });
+
+    test("Submit is Disabled until Changes are Made - Name", () => {
+        wrapper.find("Button").simulate("click");
+        wrapper.update();
+
+        expect(
+            wrapper
+                .find('[data-test="submit-button"]')
+                .hostNodes()
+                .prop("disabled")
+        ).toBe(true);
+        wrapper
+            .find('[data-test="dept-name-input"]')
+            .hostNodes()
+            .simulate("change", { target: { value: "NewName" } });
+        wrapper.update();
+        expect(
+            wrapper
+                .find('[data-test="submit-button"]')
+                .hostNodes()
+                .prop("disabled")
+        ).toBe(false);
+
+        wrapper
+            .find('[data-test="dept-name-input"]')
+            .hostNodes()
+            .simulate("change", { target: { value: "testName" } });
+        wrapper.update();
+        expect(
+            wrapper
+                .find('[data-test="submit-button"]')
+                .hostNodes()
+                .prop("disabled")
+        ).toBe(true);
+    });
+
+    test("Submit is Disabled until Changes are Made - BusinessLine", () => {
+        wrapper.find("Button").simulate("click");
+        wrapper.update();
+
+        expect(
+            wrapper
+                .find('[data-test="submit-button"]')
+                .hostNodes()
+                .prop("disabled")
+        ).toBe(true);
+        wrapper
+            .find('[data-test="business-line-input"]')
+            .hostNodes()
+            .simulate("change", { target: { value: "bl1" } });
+        wrapper.update();
+        expect(
+            wrapper
+                .find('[data-test="submit-button"]')
+                .hostNodes()
+                .prop("disabled")
+        ).toBe(false);
+        wrapper
+            .find('[data-test="business-line-input"]')
+            .hostNodes()
+            .simulate("change", { target: { value: "bl2" } });
+        wrapper.update();
+        expect(
+            wrapper
+                .find('[data-test="submit-button"]')
+                .hostNodes()
+                .prop("disabled")
+        ).toBe(true);
+    });
+
+    test("Submit is Disabled until Changes are Made - State", () => {
+        wrapper.find("Button").simulate("click");
+        wrapper.update();
+
+        expect(
+            wrapper
+                .find('[data-test="submit-button"]')
+                .hostNodes()
+                .prop("disabled")
+        ).toBe(true);
+        wrapper
+            .find('[data-test="dept-state-input"]')
+            .hostNodes()
+            .simulate("change", { target: { value: "Inactive" } });
+        wrapper.update();
+        expect(
+            wrapper
+                .find('[data-test="submit-button"]')
+                .hostNodes()
+                .prop("disabled")
+        ).toBe(false);
+
+        expect(
+            wrapper
+                .find('[data-test="submit-button"]')
+                .hostNodes()
+                .prop("disabled")
+        ).toBe(false);
+        wrapper
+            .find('[data-test="dept-state-input"]')
+            .hostNodes()
+            .simulate("change", { target: { value: "Active" } });
+        wrapper.update();
+        expect(
+            wrapper
+                .find('[data-test="submit-button"]')
+                .hostNodes()
+                .prop("disabled")
+        ).toBe(true);
+    });
+});
+
+describe("Associate Inputs Are Validated", () => {
+    test("Name Must Be at least 3 Characters", () => {
+        wrapper.find("Button").simulate("click");
+        wrapper.update();
+
+        expect(
+            wrapper
+                .find('[data-test="submit-button"]')
+                .hostNodes()
+                .prop("disabled")
+        ).toBe(true);
+        wrapper
+            .find('[data-test="dept-name-input"]')
+            .hostNodes()
+            .simulate("change", { target: { value: "Ne" } });
+        wrapper.update();
+        ///Input disabled because too short
+        expect(
+            wrapper
+                .find('[data-test="submit-button"]')
+                .hostNodes()
+                .prop("disabled")
+        ).toBe(true);
+        expect(wrapper.find("FormFeedback").text()).toContain(
+            Translate.Get.components.departmentTable.departmentTableRow
+                .validation.departmentNameLength
+        );
+
+        //Input Enabled once name is > 2 characters
+        expect(
+            wrapper
+                .find('[data-test="submit-button"]')
+                .hostNodes()
+                .prop("disabled")
+        ).toBe(true);
+        wrapper
+            .find('[data-test="dept-name-input"]')
+            .hostNodes()
+            .simulate("change", { target: { value: "New" } });
+        wrapper.update();
+        expect(wrapper.find("FormFeedback").hostNodes().length).toBe(0);
+        expect(
+            wrapper
+                .find('[data-test="submit-button"]')
+                .hostNodes()
+                .prop("disabled")
+        ).toBe(false);
+    });
+
+    test("Name Must Be Unique If Name is Not Original Name", () => {
+        wrapper.find("Button").simulate("click");
+        wrapper.update();
+
+        mockUniqueFunction.mockReturnValue(false);
+        wrapper.update();
+
+        expect(
+            wrapper
+                .find('[data-test="submit-button"]')
+                .hostNodes()
+                .prop("disabled")
+        ).toBe(true);
+        wrapper
+            .find('[data-test="dept-name-input"]')
+            .hostNodes()
+            .simulate("change", { target: { value: "NewNewName" } });
+        wrapper.update();
+
+        ///Input disabled because unique check fails
+        expect(
+            wrapper
+                .find('[data-test="submit-button"]')
+                .hostNodes()
+                .prop("disabled")
+        ).toBe(true);
+        expect(wrapper.find("FormFeedback").text()).toContain(
+            Translate.Get.components.departmentTable.departmentTableRow
+                .validation.departmentNameUnique
+        );
+
+        //Input Enabled once name is unique
+        expect(
+            wrapper
+                .find('[data-test="submit-button"]')
+                .hostNodes()
+                .prop("disabled")
+        ).toBe(true);
+        wrapper
+            .find('[data-test="dept-name-input"]')
+            .hostNodes()
+            .simulate("change", { target: { value: "NewNewName" } });
+    });
+});
+
+describe("Associate can Abandon Changes", () => {
+    test("Cancel Button Clears Inputs and Returns to Display State", () => {
+        wrapper.find("Button").simulate("click");
+        wrapper.update();
+
+        expect(wrapper.find('[data-test="display-row"]').length).toBe(0);
+        expect(wrapper.find('[data-test="edit-row"]').length).toBe(1);
+        expect(wrapper.find("td").length).toBe(6);
+        wrapper
+            .find('[data-test="dept-name-input"]')
+            .hostNodes()
+            .simulate("change", { target: { value: "NewName" } });
+        wrapper
+            .find('[data-test="business-line-input"]')
+            .hostNodes()
+            .simulate("change", { target: { value: "bl1" } });
+        wrapper
+            .find('[data-test="region-input"]')
+            .hostNodes()
+            .simulate("change", { target: { value: "SOUTH" } });
+        wrapper
+            .find('[data-test="dept-state-input"]')
+            .hostNodes()
+            .simulate("change", { target: { value: "Inactive" } });
+        wrapper.update();
+
+        wrapper
+            .find('[data-test="clear-button"]')
+            .hostNodes()
+            .simulate("click");
+        wrapper.update();
+
+        expect(wrapper.find('[data-test="department_tr_4"]').length).toBe(1);
+        expect(wrapper.find('[data-test="edit-row"]').length).toBe(0);
+
+        wrapper.find("Button").simulate("click");
+        wrapper.update();
+
+        //Assert Values did Not Update After Cancel and are Reset to Prop Values
+        expect(wrapper.find('[data-test="display-row"]').length).toBe(0);
+        expect(wrapper.find('[data-test="edit-row"]').length).toBe(1);
+        expect(wrapper.find("td").length).toBe(6);
+        expect(
+            wrapper
+                .find('[data-test="dept-name-input"]')
+                .hostNodes()
+                .prop("value")
+        ).toBe("testName");
+        expect(
+            wrapper
+                .find('[data-test="business-line-input"]')
+                .hostNodes()
+                .prop("value")
+        ).toBe("bl2");
+        expect(
+            wrapper.find('[data-test="region-input"]').hostNodes().prop("value")
+        ).toBe("");
+        expect(
+            wrapper
+                .find('[data-test="dept-state-input"]')
+                .hostNodes()
+                .prop("value")
+        ).toBe("Active");
+    });
+});
+
+describe("Associate can Submit Changes", () => {
+    test("Submit Button Sends Correct Form Data", () => {
+        wrapper.find("Button").simulate("click");
+        wrapper.update();
+
+        wrapper
+            .find('[data-test="dept-name-input"]')
+            .hostNodes()
+            .simulate("change", { target: { value: "NewName" } });
+        wrapper
+            .find('[data-test="business-line-input"]')
+            .hostNodes()
+            .simulate("change", { target: { value: "bl1" } });
+        wrapper
+            .find('[data-test="region-input"]')
+            .hostNodes()
+            .simulate("change", { target: { value: "NORTH" } });
+        wrapper
+            .find('[data-test="dept-state-input"]')
+            .hostNodes()
+            .simulate("change", { target: { value: "Inactive" } });
+        wrapper.update();
+
+        wrapper
+            .find('[data-test="submit-button"]')
+            .hostNodes()
+            .simulate("click");
+        expect(mockSubmitFunction.mock.calls[0][0]).toEqual({
+            departmentName: "NewName",
+            businessLineCode: "bl1",
+            state: "Inactive",
+            id: 4,
+            regionCode: "NORTH"
+        });
+        wrapper.update();
+
+        expect(wrapper.find('[data-test="department_tr_4"]').length).toBe(1);
+        expect(wrapper.find('[data-test="edit-row"]').length).toBe(0);
+
+        wrapper.find("Button").simulate("click");
+        wrapper.update();
+
+        //Assert Values have updated since submit
+        expect(wrapper.find('[data-test="display-row"]').length).toBe(0);
+        expect(wrapper.find('[data-test="edit-row"]').length).toBe(1);
+        expect(wrapper.find("td").length).toBe(6);
+        expect(
+            wrapper
+                .find('[data-test="dept-name-input"]')
+                .hostNodes()
+                .prop("value")
+        ).toBe("testName");
+        expect(
+            wrapper
+                .find('[data-test="business-line-input"]')
+                .hostNodes()
+                .prop("value")
+        ).toBe("bl2");
+        expect(
+            wrapper.find('[data-test="region-input"]').hostNodes().prop("value")
+        ).toBe("");
+        expect(
+            wrapper
+                .find('[data-test="dept-state-input"]')
+                .hostNodes()
+                .prop("value")
+        ).toBe("Active");
+    });
+});