refactoring tests to remove duplication

react-app/src/components/Inputs/upload.test.tsx

@@ -1,7 +1,7 @@
 import { Upload } from "./upload";
 import { screen, fireEvent, waitFor } from "@testing-library/react";
 import { describe, it, expect, vi, beforeEach } from "vitest";
-import { renderWithQueryClient } from "@/utils/test-helpers/renderForm";
+import { renderWithQueryClient } from "@/utils/test-helpers";
 
 const defaultProps = {
   dataTestId: "upload-component",

react-app/src/components/Layout/index.test.tsx

@@ -5,7 +5,7 @@ import userEvent from "@testing-library/user-event";
 import { Auth } from "aws-amplify";
 import * as hooks from "@/hooks";
 import * as api from "@/api";
-import { renderWithQueryClientAndMemoryRouter } from "@/utils/test-helpers/renderForm";
+import { renderWithQueryClientAndMemoryRouter } from "@/utils/test-helpers";
 import { setMockUsername, makoStateSubmitter, noRoleUser, AUTH_CONFIG } from "mocks";
 
 /**

react-app/src/components/Opensearch/main/Filtering/Chipbar/index.test.tsx

@@ -1,10 +1,9 @@
 import { describe, expect, it, vi, afterEach } from "vitest";
 import { screen, render } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
-import LZ from "lz-string";
 import { ChipBool, ChipDate, ChipTerms, FilterChips } from "./index";
-import { renderWithQueryClientAndMemoryRouter } from "@/utils/test-helpers/renderForm";
-import { FilterDrawerProvider } from "../FilterProvider";
+import { opensearch } from "shared-types";
+import { renderFilterDrawer, getDashboardQueryString, DEFAULT_FILTERS } from "@/utils/test-helpers";
 
 describe("FilterChips", () => {
   const openDrawer = vi.fn();
@@ -348,80 +347,17 @@ describe("FilterChips", () => {
   });
 
   describe("FilterChips", () => {
-    const code = "094230fe-a02f-45d7-a675-05876ab5d76a";
-    const queryString = LZ.compressToEncodedURIComponent(
-      JSON.stringify({
-        filters: [
-          {
-            label: "State",
-            field: "state.keyword",
-            component: "multiSelect",
-            prefix: "must",
-            type: "terms",
-            value: ["MD"],
-          },
-          {
-            label: "Authority",
-            field: "authority.keyword",
-            component: "multiCheck",
-            prefix: "must",
-            type: "terms",
-            value: ["CHIP SPA"],
-          },
-          {
-            label: "RAI Withdraw Enabled",
-            field: "raiWithdrawEnabled",
-            component: "boolean",
-            prefix: "must",
-            type: "match",
-            value: true,
-          },
-          {
-            label: "Final Disposition",
-            field: "finalDispositionDate",
-            component: "dateRange",
-            prefix: "must",
-            type: "range",
-            value: {
-              gte: "2025-01-01T00:00:00.000Z",
-              lte: "2025-01-01T23:59:59.999Z",
-            },
-          },
-        ],
-        search: "",
-        tab: "spas",
-        pagination: {
-          number: 0,
-          size: 25,
-        },
-        sort: {
-          field: "submissionDate",
-          order: "desc",
-        },
-        code,
-      }),
-    );
-    const routes = [
-      {
-        path: "/dashboard",
-        element: (
-          <FilterDrawerProvider>
-            <FilterChips />
-          </FilterDrawerProvider>
-        ),
-      },
-    ];
-    const routeOptions = {
-      initialEntries: [
-        {
-          pathname: "/dashboard",
-          search: `code=${code}&os=${queryString}`,
-        },
-      ],
+    const setup = (filters: opensearch.Filterable<opensearch.main.Field>[]) => {
+      const user = userEvent.setup();
+      const rendered = renderFilterDrawer(<FilterChips />, getDashboardQueryString({ filters }));
+      return {
+        user,
+        ...rendered,
+      };
     };
 
     it("should display multiple chips", () => {
-      renderWithQueryClientAndMemoryRouter(<FilterChips />, routes, routeOptions);
+      setup(DEFAULT_FILTERS);
       expect(screen.getByText("State: Maryland, MD")).toBeInTheDocument();
       expect(screen.getByText("Authority: CHIP SPA")).toBeInTheDocument();
       expect(screen.getByText("RAI Withdraw Enabled:")).toBeInTheDocument();
@@ -432,115 +368,45 @@ describe("FilterChips", () => {
     });
 
     it("should display filters with multiple values", () => {
-      const queryStringMV = LZ.compressToEncodedURIComponent(
-        JSON.stringify({
-          filters: [
-            {
-              label: "State",
-              field: "state.keyword",
-              component: "multiSelect",
-              prefix: "must",
-              type: "terms",
-              value: ["MD", "OH"],
-            },
-          ],
-          search: "",
-          tab: "spas",
-          pagination: {
-            number: 0,
-            size: 25,
-          },
-          sort: {
-            field: "submissionDate",
-            order: "desc",
-          },
-          code,
-        }),
-      );
-      renderWithQueryClientAndMemoryRouter(<FilterChips />, routes, {
-        initialEntries: [
-          {
-            pathname: "/dashboard",
-            search: `code=${code}&os=${queryStringMV}`,
-          },
-        ],
-      });
+      setup([
+        {
+          label: "State",
+          field: "state.keyword",
+          component: "multiSelect",
+          prefix: "must",
+          type: "terms",
+          value: ["MD", "OH"],
+        },
+      ]);
       expect(screen.getByText("State: Maryland, MD")).toBeInTheDocument();
       expect(screen.getByText("State: Ohio, OH")).toBeInTheDocument();
     });
 
     it("should display no chips if there are no supported filters", () => {
-      const queryStringMV = LZ.compressToEncodedURIComponent(
-        JSON.stringify({
-          filters: [
-            {
-              label: "RAI Withdraw Enabled",
-              field: "raiWithdrawEnabled",
-              component: "boolean",
-              prefix: "must",
-              type: "exists",
-              value: true,
-            },
-          ],
-          search: "",
-          tab: "spas",
-          pagination: {
-            number: 0,
-            size: 25,
-          },
-          sort: {
-            field: "submissionDate",
-            order: "desc",
-          },
-          code,
-        }),
-      );
-      const { container } = renderWithQueryClientAndMemoryRouter(<FilterChips />, routes, {
-        initialEntries: [
-          {
-            pathname: "/dashboard",
-            search: `code=${code}&os=${queryStringMV}`,
-          },
-        ],
-      });
+      const { container } = setup([
+        {
+          label: "RAI Withdraw Enabled",
+          field: "raiWithdrawEnabled",
+          component: "boolean",
+          prefix: "must",
+          type: "exists",
+          value: true,
+        },
+      ]);
       expect(container.childNodes.length).toEqual(1);
       expect(container.firstChild.childNodes.length).toEqual(0);
       expect(screen.queryAllByRole("button")).toEqual([]);
     });
 
     it("should display no chips if there are filters", () => {
-      const queryStringMV = LZ.compressToEncodedURIComponent(
-        JSON.stringify({
-          filters: [],
-          search: "",
-          tab: "spas",
-          pagination: {
-            number: 0,
-            size: 25,
-          },
-          sort: {
-            field: "submissionDate",
-            order: "desc",
-          },
-          code,
-        }),
-      );
-      const { container } = renderWithQueryClientAndMemoryRouter(<FilterChips />, routes, {
-        initialEntries: [
-          {
-            pathname: "/dashboard",
-            search: `code=${code}&os=${queryStringMV}`,
-          },
-        ],
-      });
+      const { container } = setup([]);
       expect(container.childNodes.length).toEqual(1);
       expect(container.firstChild.childNodes.length).toEqual(0);
       expect(screen.queryAllByRole("button")).toEqual([]);
     });
 
     it("should handle deleting a chip", async () => {
-      const user = userEvent.setup();
-      renderWithQueryClientAndMemoryRouter(<FilterChips />, routes, routeOptions);
+      const { user } = setup(DEFAULT_FILTERS);
       await user.click(screen.getAllByRole("button")[0]);
       expect(screen.queryByText("State: Maryland, MD")).toBeNull();
       expect(screen.getByText("Authority: CHIP SPA")).toBeInTheDocument();
@@ -552,48 +418,24 @@ describe("FilterChips", () => {
     });
 
     it("should handle deleting a chip when the filter has multiple values", async () => {
-      const user = userEvent.setup();
-      const queryStringMV = LZ.compressToEncodedURIComponent(
-        JSON.stringify({
-          filters: [
-            {
-              label: "State",
-              field: "state.keyword",
-              component: "multiSelect",
-              prefix: "must",
-              type: "terms",
-              value: ["MD", "OH"],
-            },
-          ],
-          search: "",
-          tab: "spas",
-          pagination: {
-            number: 0,
-            size: 25,
-          },
-          sort: {
-            field: "submissionDate",
-            order: "desc",
-          },
-          code,
-        }),
-      );
-      renderWithQueryClientAndMemoryRouter(<FilterChips />, routes, {
-        initialEntries: [
-          {
-            pathname: "/dashboard",
-            search: `code=${code}&os=${queryStringMV}`,
-          },
-        ],
-      });
+      const { user } = setup([
+        {
+          label: "State",
+          field: "state.keyword",
+          component: "multiSelect",
+          prefix: "must",
+          type: "terms",
+          value: ["MD", "OH"],
+        },
+      ]);
       await user.click(screen.getAllByRole("button")[1]);
       expect(screen.getByText("State: Maryland, MD")).toBeInTheDocument();
       expect(screen.queryByText("State: Ohio, OH")).toBeNull();
     });
 
     it("should handle clearing all", async () => {
-      const user = userEvent.setup();
-      renderWithQueryClientAndMemoryRouter(<FilterChips />, routes, routeOptions);
+      const { user } = setup(DEFAULT_FILTERS);
+      screen.debug();
       await user.click(screen.getByText("Clear All").parentElement);
       expect(screen.queryByText("State: Maryland, MD")).toBeNull();
       expect(screen.queryByText("Authority: CHIP SPA")).toBeNull();

react-app/src/components/Opensearch/main/Filtering/Drawer/index.test.tsx

@@ -1,53 +1,19 @@
 import { describe, expect, it } from "vitest";
 import { screen, within } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
-import { renderWithQueryClientAndMemoryRouter } from "@/utils/test-helpers/renderForm";
-import LZ from "lz-string";
 import { OsFilterDrawer } from "./index";
-import { FilterDrawerProvider } from "../FilterProvider";
 import { opensearch } from "shared-types";
-
-const routes = [
-  {
-    path: "/dashboard",
-    element: (
-      <FilterDrawerProvider>
-        <OsFilterDrawer />
-      </FilterDrawerProvider>
-    ),
-  },
-];
-const code = "094230fe-a02f-45d7-a675-05876ab5d76a";
+import { renderFilterDrawer, getDashboardQueryString } from "@/utils/test-helpers";
 
 const setup = (
   filters: opensearch.Filterable<opensearch.main.Field>[],
   tab: "spas" | "waivers",
 ) => {
   const user = userEvent.setup();
-  const queryString = LZ.compressToEncodedURIComponent(
-    JSON.stringify({
-      filters,
-      search: "",
-      tab,
-      pagination: {
-        number: 0,
-        size: 25,
-      },
-      sort: {
-        field: "submissionDate",
-        order: "desc",
-      },
-      code,
-    }),
+  const rendered = renderFilterDrawer(
+    <OsFilterDrawer />,
+    getDashboardQueryString({ filters, tab }),
   );
-  const rendered = renderWithQueryClientAndMemoryRouter(<OsFilterDrawer />, routes, {
-    initialEntries: [
-      {
-        pathname: "/dashboard",
-        search: `code=${code}&os=${queryString}`,
-      },
-    ],
-  });
   return {
     user,
     ...rendered,