Merge pull request #3402 from github/koesie10/simplify-multiple-modeled-methods-panel-spec

Reduce repetition in `MultipleModeledMethodsPanel.spec.tsx`

extensions/ql-vscode/src/view/method-modeling/__tests__/MultipleModeledMethodsPanel.spec.tsx

@@ -10,31 +10,43 @@ import { MultipleModeledMethodsPanel } from "../MultipleModeledMethodsPanel";
 import { userEvent } from "@testing-library/user-event";
 import type { ModeledMethod } from "../../../model-editor/modeled-method";
 import { QueryLanguage } from "../../../common/query-language";
+import type { ModelingStatus } from "../../../model-editor/shared/modeling-status";
 
 describe(MultipleModeledMethodsPanel.name, () => {
-  const render = (props: MultipleModeledMethodsPanelProps) =>
-    reactRender(<MultipleModeledMethodsPanel {...props} />);
-
   const language = QueryLanguage.Java;
   const method = createMethod();
   const isModelingInProgress = false;
   const isProcessedByAutoModel = false;
-  const modelingStatus = "unmodeled";
+  const modelingStatus: ModelingStatus = "unmodeled";
   const onChange = jest.fn<void, [string, ModeledMethod[]]>();
 
+  const baseProps = {
+    language,
+    method,
+    modelingStatus,
+    isModelingInProgress,
+    isProcessedByAutoModel,
+    onChange,
+  };
+
+  const createRender =
+    (modeledMethods: ModeledMethod[]) =>
+    (props: Partial<MultipleModeledMethodsPanelProps> = {}) =>
+      reactRender(
+        <MultipleModeledMethodsPanel
+          {...baseProps}
+          modeledMethods={modeledMethods}
+          {...props}
+        />,
+      );
+
   describe("with no modeled methods", () => {
     const modeledMethods: ModeledMethod[] = [];
 
+    const render = createRender(modeledMethods);
+
     it("renders the method modeling inputs once", () => {
-      render({
+      render();
-        language,
-        method,
-        modeledMethods,
-        modelingStatus,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        onChange,
-      });
 
       expect(screen.getAllByRole("combobox")).toHaveLength(4);
       expect(
@@ -45,15 +57,7 @@ describe(MultipleModeledMethodsPanel.name, () => {
     });
 
     it("disables all pagination", () => {
-      render({
+      render();
-        language,
-        method,
-        modeledMethods,
-        modelingStatus,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        onChange,
-      });
 
       expect(
         screen
@@ -68,15 +72,7 @@ describe(MultipleModeledMethodsPanel.name, () => {
     });
 
     it("cannot add or delete modeling", () => {
-      render({
+      render();
-        language,
-        method,
-        modeledMethods,
-        modelingStatus,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        onChange,
-      });
 
       expect(
         screen
@@ -99,16 +95,10 @@ describe(MultipleModeledMethodsPanel.name, () => {
       }),
     ];
 
+    const render = createRender(modeledMethods);
+
     it("renders the method modeling inputs once", () => {
-      render({
+      render();
-        language,
-        method,
-        modeledMethods,
-        modelingStatus,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        onChange,
-      });
 
       expect(screen.getAllByRole("combobox")).toHaveLength(4);
       expect(
@@ -119,15 +109,7 @@ describe(MultipleModeledMethodsPanel.name, () => {
     });
 
     it("disables all pagination", () => {
-      render({
+      render();
-        language,
-        method,
-        modeledMethods,
-        modelingStatus,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        onChange,
-      });
 
       expect(
         screen
@@ -141,15 +123,7 @@ describe(MultipleModeledMethodsPanel.name, () => {
     });
 
     it("cannot delete modeling", () => {
-      render({
+      render();
-        language,
-        method,
-        modeledMethods,
-        modelingStatus,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        onChange,
-      });
 
       expect(
         screen
@@ -159,15 +133,7 @@ describe(MultipleModeledMethodsPanel.name, () => {
     });
 
     it("can add modeling", async () => {
-      render({
+      render();
-        language,
-        method,
-        modeledMethods,
-        modelingStatus,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        onChange,
-      });
 
       await userEvent.click(screen.getByLabelText("Add modeling"));
 
@@ -186,29 +152,16 @@ describe(MultipleModeledMethodsPanel.name, () => {
     });
 
     it("changes selection to the newly added modeling", async () => {
-      const { rerender } = render({
+      const { rerender } = render();
-        language,
-        method,
-        modeledMethods,
-        modelingStatus,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        onChange,
-      });
 
       await userEvent.click(screen.getByLabelText("Add modeling"));
 
       rerender(
         <MultipleModeledMethodsPanel
-          language={language}
+          {...baseProps}
-          method={method}
           modeledMethods={
             onChange.mock.calls[onChange.mock.calls.length - 1][1]
           }
-          isModelingInProgress={isModelingInProgress}
-          isProcessedByAutoModel={isProcessedByAutoModel}
-          modelingStatus={modelingStatus}
-          onChange={onChange}
         />,
       );
 
@@ -226,16 +179,10 @@ describe(MultipleModeledMethodsPanel.name, () => {
       }),
     ];
 
+    const render = createRender(modeledMethods);
+
     it("renders the method modeling inputs once", () => {
-      render({
+      render();
-        language,
-        method,
-        modeledMethods,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        modelingStatus,
-        onChange,
-      });
 
       expect(screen.getAllByRole("combobox")).toHaveLength(4);
       expect(
@@ -246,15 +193,7 @@ describe(MultipleModeledMethodsPanel.name, () => {
     });
 
     it("renders the pagination", () => {
-      render({
+      render();
-        language,
-        method,
-        modeledMethods,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        modelingStatus,
-        onChange,
-      });
 
       expect(screen.getByLabelText("Previous modeling")).toBeInTheDocument();
       expect(screen.getByLabelText("Next modeling")).toBeInTheDocument();
@@ -262,15 +201,7 @@ describe(MultipleModeledMethodsPanel.name, () => {
     });
 
     it("disables the correct pagination", async () => {
-      render({
+      render();
-        language,
-        method,
-        modeledMethods,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        modelingStatus,
-        onChange,
-      });
 
       expect(
         screen
@@ -283,15 +214,7 @@ describe(MultipleModeledMethodsPanel.name, () => {
     });
 
     it("can use the pagination", async () => {
-      render({
+      render();
-        language,
-        method,
-        modeledMethods,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        modelingStatus,
-        onChange,
-      });
 
       await userEvent.click(screen.getByLabelText("Next modeling"));
 
@@ -321,27 +244,14 @@ describe(MultipleModeledMethodsPanel.name, () => {
     });
 
     it("correctly updates selected pagination index when the number of models decreases", async () => {
-      const { rerender } = render({
+      const { rerender } = render();
-        language,
-        method,
-        modeledMethods,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        modelingStatus,
-        onChange,
-      });
 
       await userEvent.click(screen.getByLabelText("Next modeling"));
 
       rerender(
         <MultipleModeledMethodsPanel
-          language={language}
+          {...baseProps}
-          method={method}
           modeledMethods={[modeledMethods[1]]}
-          isModelingInProgress={isModelingInProgress}
-          isProcessedByAutoModel={isProcessedByAutoModel}
-          modelingStatus={modelingStatus}
-          onChange={onChange}
         />,
       );
 
@@ -354,29 +264,13 @@ describe(MultipleModeledMethodsPanel.name, () => {
     });
 
     it("does not show errors", () => {
-      render({
+      render();
-        language,
-        method,
-        modeledMethods,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        modelingStatus,
-        onChange,
-      });
 
       expect(screen.queryByRole("alert")).not.toBeInTheDocument();
     });
 
     it("can update the first modeling", async () => {
-      render({
+      render();
-        language,
-        method,
-        modeledMethods,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        modelingStatus,
-        onChange,
-      });
 
       const modelTypeDropdown = screen.getByRole("combobox", {
         name: "Model type",
@@ -402,15 +296,7 @@ describe(MultipleModeledMethodsPanel.name, () => {
     });
 
     it("can update the second modeling", async () => {
-      render({
+      render();
-        language,
-        method,
-        modeledMethods,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        modelingStatus,
-        onChange,
-      });
 
       await userEvent.click(screen.getByLabelText("Next modeling"));
 
@@ -438,15 +324,7 @@ describe(MultipleModeledMethodsPanel.name, () => {
     });
 
     it("can delete modeling", async () => {
-      render({
+      render();
-        language,
-        method,
-        modeledMethods,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        modelingStatus,
-        onChange,
-      });
 
       await userEvent.click(screen.getByLabelText("Delete modeling"));
 
@@ -457,15 +335,7 @@ describe(MultipleModeledMethodsPanel.name, () => {
     });
 
     it("can add modeling", async () => {
-      render({
+      render();
-        language,
-        method,
-        modeledMethods,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        modelingStatus,
-        onChange,
-      });
 
       await userEvent.click(screen.getByLabelText("Add modeling"));
 
@@ -484,29 +354,16 @@ describe(MultipleModeledMethodsPanel.name, () => {
     });
 
     it("shows an error when adding a neutral modeling", async () => {
-      const { rerender } = render({
+      const { rerender } = render();
-        language,
-        method,
-        modeledMethods,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        modelingStatus,
-        onChange,
-      });
 
       await userEvent.click(screen.getByLabelText("Add modeling"));
 
       rerender(
         <MultipleModeledMethodsPanel
-          language={language}
+          {...baseProps}
-          method={method}
           modeledMethods={
             onChange.mock.calls[onChange.mock.calls.length - 1][1]
           }
-          isModelingInProgress={isModelingInProgress}
-          isProcessedByAutoModel={isProcessedByAutoModel}
-          modelingStatus={modelingStatus}
-          onChange={onChange}
         />,
       );
 
@@ -520,15 +377,10 @@ describe(MultipleModeledMethodsPanel.name, () => {
 
       rerender(
         <MultipleModeledMethodsPanel
-          language={language}
+          {...baseProps}
-          method={method}
           modeledMethods={
             onChange.mock.calls[onChange.mock.calls.length - 1][1]
           }
-          isModelingInProgress={isModelingInProgress}
-          isProcessedByAutoModel={isProcessedByAutoModel}
-          modelingStatus={modelingStatus}
-          onChange={onChange}
         />,
       );
 
@@ -540,15 +392,10 @@ describe(MultipleModeledMethodsPanel.name, () => {
 
       rerender(
         <MultipleModeledMethodsPanel
-          language={language}
+          {...baseProps}
-          method={method}
           modeledMethods={
             onChange.mock.calls[onChange.mock.calls.length - 1][1]
           }
-          isModelingInProgress={isModelingInProgress}
-          isProcessedByAutoModel={isProcessedByAutoModel}
-          modelingStatus={modelingStatus}
-          onChange={onChange}
         />,
       );
 
@@ -559,15 +406,7 @@ describe(MultipleModeledMethodsPanel.name, () => {
     });
 
     it("changes selection to the newly added modeling", async () => {
-      const { rerender } = render({
+      const { rerender } = render();
-        language,
-        method,
-        modeledMethods,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        modelingStatus,
-        onChange,
-      });
 
       expect(screen.getByText("1/2")).toBeInTheDocument();
 
@@ -575,15 +414,10 @@ describe(MultipleModeledMethodsPanel.name, () => {
 
       rerender(
         <MultipleModeledMethodsPanel
-          language={language}
+          {...baseProps}
-          method={method}
           modeledMethods={
             onChange.mock.calls[onChange.mock.calls.length - 1][1]
           }
-          isModelingInProgress={isModelingInProgress}
-          isProcessedByAutoModel={isProcessedByAutoModel}
-          modelingStatus={modelingStatus}
-          onChange={onChange}
         />,
       );
 
@@ -610,16 +444,10 @@ describe(MultipleModeledMethodsPanel.name, () => {
       }),
     ];
 
+    const render = createRender(modeledMethods);
+
     it("can use the pagination", async () => {
-      render({
+      render();
-        language,
-        method,
-        modeledMethods,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        modelingStatus,
-        onChange,
-      });
 
       expect(
         screen
@@ -703,27 +531,14 @@ describe(MultipleModeledMethodsPanel.name, () => {
     });
 
     it("preserves selection when a modeling other than the selected modeling is removed", async () => {
-      const { rerender } = render({
+      const { rerender } = render();
-        language,
-        method,
-        modeledMethods,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        modelingStatus,
-        onChange,
-      });
 
       expect(screen.getByText("1/3")).toBeInTheDocument();
 
       rerender(
         <MultipleModeledMethodsPanel
-          language={language}
+          {...baseProps}
-          method={method}
           modeledMethods={modeledMethods.slice(0, 2)}
-          isModelingInProgress={isModelingInProgress}
-          isProcessedByAutoModel={isProcessedByAutoModel}
-          modelingStatus={modelingStatus}
-          onChange={onChange}
         />,
       );
 
@@ -731,15 +546,7 @@ describe(MultipleModeledMethodsPanel.name, () => {
     });
 
     it("reduces selection when the selected modeling is removed", async () => {
-      const { rerender } = render({
+      const { rerender } = render();
-        language,
-        method,
-        modeledMethods,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        modelingStatus,
-        onChange,
-      });
 
       await userEvent.click(screen.getByLabelText("Next modeling"));
       await userEvent.click(screen.getByLabelText("Next modeling"));
@@ -747,13 +554,8 @@ describe(MultipleModeledMethodsPanel.name, () => {
 
       rerender(
         <MultipleModeledMethodsPanel
-          language={language}
+          {...baseProps}
-          method={method}
           modeledMethods={modeledMethods.slice(0, 2)}
-          isModelingInProgress={isModelingInProgress}
-          isProcessedByAutoModel={isProcessedByAutoModel}
-          modelingStatus={modelingStatus}
-          onChange={onChange}
         />,
       );
 
@@ -774,16 +576,10 @@ describe(MultipleModeledMethodsPanel.name, () => {
       }),
     ];
 
+    const render = createRender(modeledMethods);
+
     it("can add modeling", () => {
-      render({
+      render();
-        language,
-        method,
-        modeledMethods,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        modelingStatus,
-        onChange,
-      });
 
       expect(
         screen.getByLabelText("Add modeling").getElementsByTagName("input")[0],
@@ -791,15 +587,7 @@ describe(MultipleModeledMethodsPanel.name, () => {
     });
 
     it("can delete first modeling", async () => {
-      render({
+      render();
-        language,
-        method,
-        modeledMethods,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        modelingStatus,
-        onChange,
-      });
 
       await userEvent.click(screen.getByLabelText("Delete modeling"));
 
@@ -810,15 +598,7 @@ describe(MultipleModeledMethodsPanel.name, () => {
     });
 
     it("can delete second modeling", async () => {
-      render({
+      render();
-        language,
-        method,
-        modeledMethods,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        modelingStatus,
-        onChange,
-      });
 
       await userEvent.click(screen.getByLabelText("Next modeling"));
       await userEvent.click(screen.getByLabelText("Delete modeling"));
@@ -830,15 +610,7 @@ describe(MultipleModeledMethodsPanel.name, () => {
     });
 
     it("can add modeling after deleting second modeling", async () => {
-      const { rerender } = render({
+      const { rerender } = render();
-        language,
-        method,
-        modeledMethods,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        modelingStatus,
-        onChange,
-      });
 
       await userEvent.click(screen.getByLabelText("Next modeling"));
       await userEvent.click(screen.getByLabelText("Delete modeling"));
@@ -850,13 +622,8 @@ describe(MultipleModeledMethodsPanel.name, () => {
 
       rerender(
         <MultipleModeledMethodsPanel
-          language={language}
+          {...baseProps}
-          method={method}
           modeledMethods={modeledMethods.slice(0, 1)}
-          isModelingInProgress={isModelingInProgress}
-          isProcessedByAutoModel={isProcessedByAutoModel}
-          modelingStatus={modelingStatus}
-          onChange={onChange}
         />,
       );
 
@@ -888,30 +655,16 @@ describe(MultipleModeledMethodsPanel.name, () => {
       }),
     ];
 
+    const render = createRender(modeledMethods);
+
     it("shows errors", () => {
-      render({
+      render();
-        language,
-        method,
-        modeledMethods,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        modelingStatus,
-        onChange,
-      });
 
       expect(screen.getByRole("alert")).toBeInTheDocument();
     });
 
     it("shows the correct error message", async () => {
-      render({
+      render();
-        language,
-        method,
-        modeledMethods,
-        isModelingInProgress,
-        isProcessedByAutoModel,
-        modelingStatus,
-        onChange,
-      });
 
       expect(
         screen.getByText("Error: Duplicated classification"),