Skip to content

Commit

Permalink
add tests
Browse files Browse the repository at this point in the history
  • Loading branch information
@fzhao99
fzhao99 committed Aug 29, 2023
1 parent 6c131e7 commit 64c115e
Show file tree
Hide file tree
Showing 3 changed files with 139 additions and 70 deletions.
2 changes: 1 addition & 1 deletion frontend/src/app/supportAdmin/ManageFacility/FacilityInformation.test.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,8 @@ import { initialState, ManageFacilityState } from "./ManageFacility";
describe("Facility Information", () => {
const handleFacilityDelete = jest.fn();
const mockManageFacilityState: ManageFacilityState = {
orgId: "123",
facilityId: "123",
orgId: "456",
facility: {
city: "New York",
state: "NY",
Expand Down
56 changes: 37 additions & 19 deletions frontend/src/app/supportAdmin/ManageFacility/FacilitySelectFilter.test.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,13 @@
import { fireEvent, render, screen, waitFor } from "@testing-library/react";
import {
fireEvent,
render,
screen,
waitFor,
within,
} from "@testing-library/react";
import { MemoryRouter } from "react-router-dom";
import React from "react";
import { ComboBoxRef } from "@trussworks/react-uswds";

import { Option } from "../../commonComponents/Dropdown";

Expand All @@ -22,36 +30,45 @@ describe("FacilitySelectFilter", () => {
orgOptions: Option[],
facilityOptions: Option[],
manageFacilityState: ManageFacilityState
) =>
) => {
const orgRef = React.createRef<ComboBoxRef>();
const facilityRef = React.createRef<ComboBoxRef>();
render(
<MemoryRouter>
<FacilitySelectFilter
organizationOptions={orgOptions}
facilityOptions={facilityOptions}
manageFacilityState={manageFacilityState}
onClearFilter={handleClearFilter}
onSelectOrg={handleSelectOrg}
onSelectFacility={handleSelectFacility}
onSearch={handleSearch}
manageFacilityState={manageFacilityState}
loading={true}
orgRef={orgRef}
facilityRef={facilityRef}
/>
</MemoryRouter>
);
};

it("disables controls when loading data", () => {
renderWithMocks([], [], initialState);

expect(
screen.getByRole("combobox", { name: /organization/i })
).toBeDisabled();
expect(screen.getByRole("combobox", { name: /facility/i })).toBeDisabled();
const orgSelectionDiv = screen.getByText("Organization");
const orgDropdown = within(orgSelectionDiv).getByRole("combobox");

const facilitySelectionDiv = screen.getByText("Testing facility");
const facilityDropdown = within(facilitySelectionDiv).getByRole("combobox");

expect(facilityDropdown).toBeDisabled();
expect(orgDropdown).toBeDisabled();
});

it("calls handleClearFilter upon clicking clear filters button", async () => {
renderWithMocks(mockOrganizationOptions, mockFacilityOptions, {
orgId: "123",
facilityId: "",
facilityId: undefined,
facility: undefined,
orgId: "123",
});
const clearFiltersBtn = screen.getByRole("button", {
name: /clear facility selection filters/i,
Expand All @@ -63,38 +80,39 @@ describe("FacilitySelectFilter", () => {

it("calls event handlers when organization is selected", async () => {
renderWithMocks(mockOrganizationOptions, mockFacilityOptions, initialState);
const orgDropdown = screen.getByRole("combobox", { name: /organization/i });

const orgSelectionDiv = screen.getByText("Organization");
const orgDropdown = within(orgSelectionDiv).getByRole("combobox");

fireEvent.change(orgDropdown, { target: { value: "123" } });
await waitFor(() => expect(handleSelectOrg).toHaveBeenCalled());
});

it("calls event handlers when facility is selected", async () => {
renderWithMocks(mockOrganizationOptions, mockFacilityOptions, {
orgId: "123",
facilityId: "",
facility: undefined,
orgId: "",
});
const facilityDropdown = screen.getByRole("combobox", {
name: /facility/i,
});

const facilitySelectionDiv = screen.getByText("Testing facility");
const facilityDropdown = within(facilitySelectionDiv).getByRole("combobox");

fireEvent.change(facilityDropdown, { target: { value: "123" } });
await waitFor(() => expect(handleSelectFacility).toHaveBeenCalled());
});

it("calls event handlers when search button is clicked", async () => {
renderWithMocks(mockOrganizationOptions, mockFacilityOptions, {
orgId: "123",
facilityId: "123",
facility: undefined,
orgId: undefined,
});
const facilityDropdown = screen.getByRole("combobox", {
name: /facility/i,
});
fireEvent.change(facilityDropdown, { target: { value: "123" } });

const searchBtn = screen.getByRole("button", {
name: /search/i,
});
expect(searchBtn).toBeEnabled();
fireEvent.click(searchBtn);

await waitFor(() => expect(handleSearch).toHaveBeenCalled());
Expand Down
151 changes: 101 additions & 50 deletions frontend/src/app/supportAdmin/ManageFacility/ManageFacility.test.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import { fireEvent, render, screen, waitFor } from "@testing-library/react";
import { act, render, screen, waitFor, within } from "@testing-library/react";
import { MemoryRouter } from "react-router-dom";
import { MockedProvider, MockedResponse } from "@apollo/client/testing";
import userEvent from "@testing-library/user-event";

import {
DeleteFacilityDocument,
Expand Down Expand Up @@ -34,9 +35,9 @@ describe("ManageFacility", () => {
const clearFiltersBtn = getClearFilterBtn();
expect(clearFiltersBtn).toBeDisabled();

const orgDropdown = screen.getByRole("combobox", { name: /organization/i });
const orgSelectionDiv = screen.getByText("Organization");
const orgDropdown = within(orgSelectionDiv).getByRole("combobox");
await waitFor(() => expect(orgDropdown).toBeEnabled());
fireEvent.change(orgDropdown, { target: { value: "" } }); // picks -Select- option

expect(clearFiltersBtn).toBeDisabled();
expect(screen.getByText(/No facility selected/)).toBeInTheDocument();
Expand All @@ -46,77 +47,110 @@ describe("ManageFacility", () => {
const clearFiltersBtn = getClearFilterBtn();
expect(clearFiltersBtn).toBeDisabled();

const orgDropdown = screen.getByRole("combobox", { name: /organization/i });
await waitFor(() => expect(orgDropdown).toBeEnabled());
fireEvent.change(orgDropdown, {
target: { value: "604f2e80-b4b7-4fff-806a-2a77973aa08f" },
}); // picks Dis Organization
const orgSelectionDiv = screen.getByText("Organization");
const orgComboBoxInput = within(orgSelectionDiv).getByRole("combobox");
const orgComboBoxList = within(orgSelectionDiv).getByTestId(
"combo-box-option-list"
);

const facilityDropdown = screen.getByRole("combobox", {
name: /facility/i,
await waitFor(() => expect(orgComboBoxInput).toBeEnabled());
await act(async () => {
await userEvent.type(orgComboBoxInput, "dis");
await userEvent.click(
within(orgComboBoxList).getByText("Dis Organization")
);
});
await waitFor(() => expect(facilityDropdown).toBeEnabled());
expect(orgComboBoxInput).toHaveValue("Dis Organization");
expect(clearFiltersBtn).toBeEnabled();
fireEvent.change(facilityDropdown, { target: { value: "" } }); // picks -Select-

await waitFor(() => expect(clearFiltersBtn).toBeEnabled());
expect(screen.getByText(/No facility selected/)).toBeInTheDocument();
await screen.findByText(/No facility selected/);
});

it("resets the controls after clicking clear filters", async () => {
const clearFiltersBtn = getClearFilterBtn();
expect(clearFiltersBtn).toBeDisabled();

const orgDropdown = screen.getByRole("combobox", { name: /organization/i });
await waitFor(() => expect(orgDropdown).toBeEnabled());
fireEvent.change(orgDropdown, {
target: { value: "604f2e80-b4b7-4fff-806a-2a77973aa08f" },
}); // picks Dis Organization
const orgSelectionDiv = screen.getByText("Organization");
const orgComboBoxInput = within(orgSelectionDiv).getByRole("combobox");
const orgComboBoxList = within(orgSelectionDiv).getByTestId(
"combo-box-option-list"
);
await waitFor(() => expect(orgComboBoxInput).toBeEnabled());

await act(async () => {
await userEvent.type(orgComboBoxInput, "dis");
await userEvent.click(
within(orgComboBoxList).getByText("Dis Organization")
);
});

await waitFor(() => expect(clearFiltersBtn).toBeEnabled());
fireEvent.click(clearFiltersBtn);
await act(async () => {
await userEvent.click(clearFiltersBtn);
});

await waitFor(() => expect(clearFiltersBtn).toBeDisabled());
expect(orgDropdown).toHaveValue("");
expect(orgComboBoxInput).toHaveValue("");
expect(screen.getByText(/No facility selected/)).toBeInTheDocument();
});

it("loads facility and deletes it", async () => {
const clearFiltersBtn = getClearFilterBtn();
expect(clearFiltersBtn).toBeDisabled();

const orgDropdown = screen.getByRole("combobox", { name: /organization/i });
await waitFor(() => expect(orgDropdown).toBeEnabled());
fireEvent.change(orgDropdown, {
target: { value: "604f2e80-b4b7-4fff-806a-2a77973aa08f" },
}); // picks Dis Organization
const orgSelectionDiv = screen.getByText("Organization");
const orgComboBoxInput = within(orgSelectionDiv).getByRole("combobox");
const orgComboBoxList = within(orgSelectionDiv).getByTestId(
"combo-box-option-list"
);

const facilityDropdown = screen.getByRole("combobox", {
name: /facility/i,
const facilitySelectionDiv = screen.getByText("Testing facility");
const facilityComboBoxInput =
within(facilitySelectionDiv).getByRole("combobox");
const facilityComboBoxList = within(facilitySelectionDiv).getByTestId(
"combo-box-option-list"
);

await waitFor(() => expect(orgComboBoxInput).toBeEnabled());
await act(async () => {
await userEvent.type(orgComboBoxInput, "dis");
await userEvent.click(
within(orgComboBoxList).getByText("Dis Organization")
);
});

await waitFor(() => expect(facilityComboBoxInput).toBeEnabled());
await waitFor(() => expect(clearFiltersBtn).toBeEnabled());
await act(async () => {
await userEvent.type(facilityComboBoxInput, "testing site");
await userEvent.click(
within(facilityComboBoxList).getByText("Testing Site")
);
});
await waitFor(() => expect(facilityDropdown).toBeEnabled());
expect(clearFiltersBtn).toBeEnabled();
fireEvent.change(facilityDropdown, {
target: { value: "1919865a-92eb-4c46-b73b-471b02b131b7" },
}); // picks testing site

const searchBtn = screen.getByRole("button", {
name: /search/i,
});
fireEvent.click(searchBtn);
await act(async () => {
await userEvent.click(searchBtn);
});

await screen.findByRole("heading", { name: /Testing Site/i });

const deleteFacilityBtn = screen.getByRole("button", {
name: /delete facility testing site/i,
});
fireEvent.click(deleteFacilityBtn);
await act(async () => {
await userEvent.click(deleteFacilityBtn);
});

await screen.findByRole("heading", { name: /delete testing site/i });
const yesDeleteBtn = screen.getByRole("button", {
name: /yes, delete facility/i,
});
fireEvent.click(yesDeleteBtn);
await act(async () => {
await userEvent.click(yesDeleteBtn);
});

await waitFor(() =>
expect(
Expand All @@ -126,34 +160,51 @@ describe("ManageFacility", () => {

// Facility testing site successfully deleted
// page resets
await waitFor(() => expect(orgDropdown).toHaveValue(""));
expect(facilityDropdown).toHaveValue("");
await waitFor(() => expect(orgComboBoxInput).toHaveValue(""));
expect(facilityComboBoxInput).toHaveValue("");
expect(clearFiltersBtn).toBeDisabled();
});

it("loads the page even when no facility is retrieved", async () => {
const clearFiltersBtn = getClearFilterBtn();
expect(clearFiltersBtn).toBeDisabled();

const orgDropdown = screen.getByRole("combobox", { name: /organization/i });
await waitFor(() => expect(orgDropdown).toBeEnabled());
fireEvent.change(orgDropdown, {
target: { value: "09cdf298-39b3-41b0-92f7-092c2bfe065e" },
}); // picks Dis Organization
const orgSelectionDiv = screen.getByText("Organization");
const orgComboBoxInput = within(orgSelectionDiv).getByRole("combobox");
const orgComboBoxList = within(orgSelectionDiv).getByTestId(
"combo-box-option-list"
);

const facilityDropdown = screen.getByRole("combobox", {
name: /facility/i,
await waitFor(() => expect(orgComboBoxInput).toBeEnabled());
await act(async () => {
await userEvent.type(orgComboBoxInput, "dat");
await userEvent.click(
within(orgComboBoxList).getByText("Dat Organization")
);
});
await waitFor(() => expect(facilityDropdown).toBeEnabled());

const facilitySelectionDiv = screen.getByText("Testing facility");
const facilityComboBoxInput =
within(facilitySelectionDiv).getByRole("combobox");
const facilityComboBoxList = within(facilitySelectionDiv).getByTestId(
"combo-box-option-list"
);

await waitFor(() => expect(facilityComboBoxInput).toBeEnabled());
expect(clearFiltersBtn).toBeEnabled();
fireEvent.change(facilityDropdown, {
target: { value: "1919865a-92eb-4c46-b73b-471b02b131b8" },
}); // picks testing site
await act(async () => {
await userEvent.type(facilityComboBoxInput, "incom");
await userEvent.click(
within(facilityComboBoxList).getByText("Incomplete Site")
);
});

const searchBtn = screen.getByRole("button", {
name: /search/i,
});
fireEvent.click(searchBtn);
await act(async () => {
await userEvent.click(searchBtn);
});

await screen.findByRole("heading", { name: /Incomplete Site/i });
});
Expand Down

0 comments on commit 64c115e

Please sign in to comment.