From fa0befcdf8196822df8eb9a2796d2d6ae27a53e0 Mon Sep 17 00:00:00 2001 From: Angela Cooney Date: Wed, 11 Dec 2024 10:32:26 -0500 Subject: [PATCH] CMDCT-4065: writing tests to appease the codeclimate gods --- .../pages/Dashboard/DashboardPage.test.tsx | 28 ++++++++++- .../src/components/report/Page.test.tsx | 47 +++++++++++++++++-- .../components/report/StatusTable.test.tsx | 33 ++++++++++--- .../ui-src/src/utils/testing/setupJest.tsx | 6 +++ 4 files changed, 102 insertions(+), 12 deletions(-) diff --git a/services/ui-src/src/components/pages/Dashboard/DashboardPage.test.tsx b/services/ui-src/src/components/pages/Dashboard/DashboardPage.test.tsx index 13920d72..32c9ccba 100644 --- a/services/ui-src/src/components/pages/Dashboard/DashboardPage.test.tsx +++ b/services/ui-src/src/components/pages/Dashboard/DashboardPage.test.tsx @@ -1,9 +1,14 @@ import { render, screen, waitFor } from "@testing-library/react"; import { DashboardPage } from "components"; -import { RouterWrappedComponent, mockUseStore } from "utils/testing/setupJest"; +import { + RouterWrappedComponent, + mockUseReadOnlyUserStore, + mockUseStore, +} from "utils/testing/setupJest"; import { useStore } from "utils"; import { getReportsForState } from "utils/api/requestMethods/report"; import { Report } from "types"; +import dashboardVerbiage from "verbiage/pages/dashboard"; window.HTMLElement.prototype.scrollIntoView = jest.fn(); @@ -46,7 +51,7 @@ const dashboardComponent = ( ); -describe("", () => { +describe("DashboardPage with state user", () => { beforeEach(() => jest.clearAllMocks()); it("should render an empty state when there are no reports", async () => { @@ -95,3 +100,22 @@ describe("", () => { expect(cellContent("Edited by")).toBe("Mock User"); }); }); + +describe("DashboardPage with Read only user", () => { + beforeEach(() => { + mockedUseStore.mockReturnValue(mockUseReadOnlyUserStore); + }); + it("should not render the Start Report button when user is read only", async () => { + (getReportsForState as jest.Mock).mockResolvedValueOnce([]); + + render(dashboardComponent); + await waitFor(() => { + expect(getReportsForState).toHaveBeenCalled(); + }); + + const startReportButton = screen.queryByText( + dashboardVerbiage.body.link.callToActionText + ); + expect(startReportButton).not.toBeInTheDocument(); + }); +}); diff --git a/services/ui-src/src/components/report/Page.test.tsx b/services/ui-src/src/components/report/Page.test.tsx index 035cdf92..ca92c93e 100644 --- a/services/ui-src/src/components/report/Page.test.tsx +++ b/services/ui-src/src/components/report/Page.test.tsx @@ -1,7 +1,10 @@ -import { render } from "@testing-library/react"; +import { render, screen } from "@testing-library/react"; import { ElementType, PageElement } from "types/report"; import { Page } from "./Page"; -import { mockUseStore } from "utils/testing/setupJest"; +import { + mockUseReadOnlyUserStore, + mockUseStore, +} from "utils/testing/setupJest"; import { useStore } from "utils/state/useStore"; jest.mock("react-router-dom", () => ({ @@ -81,7 +84,27 @@ const elements: PageElement[] = [ }, ]; -describe("Page Component", () => { +const textFieldElement: PageElement[] = [ + { + type: ElementType.Textbox, + label: "labeled", + }, + { + type: ElementType.Radio, + label: "radio button", + value: [{ label: "radio choice 1", value: "1", checkedChildren: [] }], + }, +]; + +const dateFieldElement: PageElement[] = [ + { + type: ElementType.Date, + label: "date label", + helperText: "can you read this?", + }, +]; + +describe("Page Component with state user", () => { test.each(elements)("Renders all element types: %p", (element) => { const { container } = render(); expect(container).not.toBeEmptyDOMElement(); @@ -96,3 +119,21 @@ describe("Page Component", () => { expect(container).not.toBeEmptyDOMElement(); }); }); + +describe("Page Component with read only user", () => { + beforeEach(() => { + mockedUseStore.mockReturnValue(mockUseReadOnlyUserStore); + }); + test("text field and radio button should be disabled", () => { + render(); + const textField = screen.getByRole("textbox"); + const radioButton = screen.getByLabelText("radio choice 1"); + expect(textField).toBeDisabled(); + expect(radioButton).toBeDisabled(); + }); + test("date field should be disabled", () => { + render(); + const dateField = screen.getByRole("textbox"); + expect(dateField).toBeDisabled(); + }); +}); diff --git a/services/ui-src/src/components/report/StatusTable.test.tsx b/services/ui-src/src/components/report/StatusTable.test.tsx index 161938c5..cf4d152a 100644 --- a/services/ui-src/src/components/report/StatusTable.test.tsx +++ b/services/ui-src/src/components/report/StatusTable.test.tsx @@ -3,6 +3,7 @@ import userEvent from "@testing-library/user-event"; import { StatusTableElement } from "./StatusTable"; import { useNavigate } from "react-router-dom"; import { useStore } from "utils"; +import { mockUseReadOnlyUserStore } from "utils/testing/setupJest"; jest.mock("react-router-dom", () => ({ useNavigate: jest.fn(), @@ -23,7 +24,14 @@ const report = { ], }; -describe("StatusTableElement", () => { +const mockPageMap = new Map(); +mockPageMap.set("root", 0); +mockPageMap.set("1", 1); +mockPageMap.set("2", 2); + +const mockedUseStore = useStore as jest.MockedFunction; + +describe("StatusTable with state user", () => { const mockNavigate = jest.fn(); const setCurrentPageId = jest.fn(); @@ -31,12 +39,7 @@ describe("StatusTableElement", () => { (useNavigate as jest.Mock).mockReturnValue(mockNavigate); jest.clearAllMocks(); - const mockPageMap = new Map(); - mockPageMap.set("root", 0); - mockPageMap.set("1", 1); - mockPageMap.set("2", 2); - - (useStore as unknown as jest.Mock).mockReturnValue({ + mockedUseStore.mockReturnValue({ pageMap: mockPageMap, report: report, setCurrentPageId, @@ -85,3 +88,19 @@ describe("StatusTableElement", () => { expect(container.firstChild).toBeNull(); }); }); + +describe("StatusPage with Read only user", () => { + beforeEach(() => { + mockedUseStore.mockReturnValue({ + ...mockUseReadOnlyUserStore, + pageMap: mockPageMap, + report: report, + }); + }); + it("should not render the Submit QMS Report button when user is read only", async () => { + render(); + + const submitButton = screen.queryByText("Submit QMS Report"); + expect(submitButton).not.toBeInTheDocument(); + }); +}); diff --git a/services/ui-src/src/utils/testing/setupJest.tsx b/services/ui-src/src/utils/testing/setupJest.tsx index d846b825..92e9bdce 100644 --- a/services/ui-src/src/utils/testing/setupJest.tsx +++ b/services/ui-src/src/utils/testing/setupJest.tsx @@ -250,6 +250,12 @@ export const mockUseAdminStore: HcbsUserState & AdminBannerState = { ...mockBannerStore, }; +export const mockUseReadOnlyUserStore: HcbsUserState & AdminBannerState = { + ...mockHelpDeskUserStore, + ...mockBannerStore, + ...mockReportStore, +}; + // ROUTER export const RouterWrappedComponent: React.FC = ({ children }) => (