From 1cf68356b1fe2ea8c0e450a95faee3ebfa563afa Mon Sep 17 00:00:00 2001 From: jacobshandling <61553566+jacobshandling@users.noreply.github.com> Date: Thu, 8 May 2025 10:01:02 -0700 Subject: [PATCH] Update test structure (#28874) Organizational improvement to a test, no functional changes to the product Co-authored-by: Jacob Shandling --- .../RunScriptBatchPaginatedList.tests.tsx | 32 ++++++++----------- frontend/test/handlers/script-handlers.ts | 22 +++++++++++++ 2 files changed, 36 insertions(+), 18 deletions(-) create mode 100644 frontend/test/handlers/script-handlers.ts diff --git a/frontend/pages/hosts/ManageHostsPage/components/RunScriptBatchPaginatedList/RunScriptBatchPaginatedList.tests.tsx b/frontend/pages/hosts/ManageHostsPage/components/RunScriptBatchPaginatedList/RunScriptBatchPaginatedList.tests.tsx index 0a1c5701b4..97349a3b01 100644 --- a/frontend/pages/hosts/ManageHostsPage/components/RunScriptBatchPaginatedList/RunScriptBatchPaginatedList.tests.tsx +++ b/frontend/pages/hosts/ManageHostsPage/components/RunScriptBatchPaginatedList/RunScriptBatchPaginatedList.tests.tsx @@ -1,11 +1,12 @@ import React from "react"; -import { http, HttpResponse } from "msw"; import { screen, waitFor, within } from "@testing-library/react"; import userEvent from "@testing-library/user-event"; -import { baseUrl, createCustomRenderer } from "test/test-utils"; +import { createCustomRenderer } from "test/test-utils"; import mockServer from "test/mock-server"; +import getTeamScriptsHandler from "test/handlers/script-handlers"; + import { createMockScript } from "__mocks__/scriptMock"; import RunScriptBatchPaginatedList from "./RunScriptBatchPaginatedList"; @@ -16,17 +17,12 @@ const waitForLoadingToFinish = async (container: HTMLElement) => { }); }; -const team1Scripts = [ - createMockScript({ team_id: 1, name: "Team script 1" }), +const team1ScriptOverrides = [ + createMockScript({ id: 1, team_id: 1, name: "Team script 1" }), createMockScript({ id: 2, team_id: 1, name: "Team script 2" }), ]; -const teamScriptsHandler = http.get(baseUrl(`/scripts?team_id=1`), () => { - // The case where a team has no scripts is handled by the parent - return HttpResponse.json({ - scripts: team1Scripts, - }); -}); +const team1ScriptsHandler = getTeamScriptsHandler(1, team1ScriptOverrides); describe("RunScriptBatchPaginatedList - component", () => { const render = createCustomRenderer({ @@ -34,7 +30,7 @@ describe("RunScriptBatchPaginatedList - component", () => { }); it("Lists a team's scripts", async () => { - mockServer.use(teamScriptsHandler); + mockServer.use(team1ScriptsHandler); const { container } = render( { await waitForLoadingToFinish(container); const listedScripts = screen.getAllByRole("listitem"); - expect(listedScripts).toHaveLength(team1Scripts.length); - team1Scripts.forEach((item, index) => { + expect(listedScripts).toHaveLength(team1ScriptOverrides.length); + team1ScriptOverrides.forEach((item, index) => { expect(listedScripts[index]).toHaveTextContent(item.name); }); }); // }); it("Calls `onRunScript` with the appropriate script when `Run script`/`Run again` is clicked", async () => { - mockServer.use(teamScriptsHandler); + mockServer.use(team1ScriptsHandler); const onRunScript = jest.fn(); const { container } = render( { // modifying the incoming scripst without breaking this test // const changedItems = onSubmit.mock.calls[0][0]; const ranScript = onRunScript.mock.calls[0][0]; // the second arg is a callback - expect(ranScript.id).toEqual(team1Scripts[0].id); + expect(ranScript.id).toEqual(team1ScriptOverrides[0].id); }); it("Sets the right script for details when clicking on the script's name", async () => { - mockServer.use(teamScriptsHandler); + mockServer.use(team1ScriptsHandler); const onSetScriptForDetails = jest.fn(); const { container } = render( { const listedScripts = screen.getAllByRole("listitem"); // click on the script's name await userEvent.click( - within(listedScripts[0]).getByText(team1Scripts[0].name) + within(listedScripts[0]).getByText(team1ScriptOverrides[0].name) ); await waitFor(() => { expect(onSetScriptForDetails.mock.calls.length).toEqual(1); // @@ -104,6 +100,6 @@ describe("RunScriptBatchPaginatedList - component", () => { // checking ids rather than full equality allows extending the components `fetchPage` to // modifying the incoming scripst without breaking this test const detailsScript = onSetScriptForDetails.mock.calls[0][0]; // the second arg is a callback - expect(detailsScript.id).toEqual(team1Scripts[0].id); + expect(detailsScript.id).toEqual(team1ScriptOverrides[0].id); }); }); diff --git a/frontend/test/handlers/script-handlers.ts b/frontend/test/handlers/script-handlers.ts new file mode 100644 index 0000000000..74bb70882f --- /dev/null +++ b/frontend/test/handlers/script-handlers.ts @@ -0,0 +1,22 @@ +import { http, HttpResponse } from "msw"; + +import { baseUrl } from "test/test-utils"; +import { IScript } from "interfaces/script"; +import { createMockScript } from "__mocks__/scriptMock"; + +// not supported for all teams +const getTeamScriptsHandler = ( + teamId: number, + overrides: Partial[] +) => { + const scripts = overrides.map((scriptOverride) => + createMockScript(scriptOverride) + ); + return http.get(baseUrl(`/scripts?team_id=${teamId}`), () => + HttpResponse.json({ + scripts, + }) + ); +}; + +export default getTeamScriptsHandler;