@truedat/qx 8.5.1 → 8.5.2

package/src/components/qualityControls/__tests__/QualityControlEditor.spec.js

@@ -1,4 +1,4 @@
-import { waitFor, fireEvent } from "@testing-library/react";
+import { act, waitFor, fireEvent } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { render, waitForLoad } from "@truedat/test/render";
 import { DOMAINS_QUERY } from "@truedat/core/api/queries";
@@ -15,15 +15,23 @@ import {
 } from "./__fixtures__/qualityControlHelper";
 
 jest.mock("@truedat/core/hooks/useUserFilters");
-jest.mock("@truedat/qx/hooks/useFunctions", () => {
-  const originalModule = jest.requireActual("@truedat/qx/hooks/useFunctions");
-
-  return {
-    __esModule: true,
-    ...originalModule,
-    useFunctions: jest.fn(() => ({})),
-  };
-});
+jest.mock("@truedat/qx/hooks/useFunctions", () => ({
+  useFunctions: jest.fn(() => ({
+    data: {
+      data: [
+        {
+          name: "eq",
+          type: "boolean",
+          params: [
+            { name: "arg1", type: "any" },
+            { name: "arg2", type: "any" },
+          ],
+        },
+      ],
+    },
+    loading: false,
+  })),
+}));
 jest.mock("@truedat/qx/hooks/useDataViews", () => {
   const originalModule = jest.requireActual("@truedat/qx/hooks/useDataViews");
 
@@ -117,7 +125,7 @@ describe("<QualityControlEditor />", () => {
         isModification={false}
         value={defaultQualityControl}
       />,
-      renderOpts
+      renderOpts,
     );
     await waitForLoad(rendered);
     // Wait for async state updates from GraphQL queries to complete
@@ -126,7 +134,9 @@ describe("<QualityControlEditor />", () => {
     });
     // Save/Publish buttons only appear on step 2 (last step)
     await waitFor(() =>
-      expect(rendered.queryByRole("button", { name: /save/i })).not.toBeInTheDocument()
+      expect(
+        rendered.queryByRole("button", { name: /save/i }),
+      ).not.toBeInTheDocument(),
     );
     expect(rendered.container).toMatchSnapshot();
   });
@@ -163,7 +173,7 @@ describe("<QualityControlEditor />", () => {
     await user.click(rendered.getByRole("button", { name: /cancel/i }));
 
     await waitFor(() =>
-      expect(rendered.queryByText(/confirm_yes/i)).toBeInTheDocument()
+      expect(rendered.queryByText(/confirm_yes/i)).toBeInTheDocument(),
     );
     await user.click(rendered.getByText(/confirm_yes/i));
     expect(onCancel).toHaveBeenCalledTimes(1);
@@ -174,7 +184,7 @@ describe("<QualityControlEditor />", () => {
     const onSave = jest.fn();
     const rendered = render(
       <QualityControlEditor {...props} onSave={onSave} />,
-      renderOpts
+      renderOpts,
     );
     await waitForLoad(rendered);
     // Wait for async state updates from GraphQL queries to complete
@@ -183,7 +193,9 @@ describe("<QualityControlEditor />", () => {
     });
 
     // Save button only appears on step 2 (last step)
-    expect(rendered.queryByRole("button", { name: /save/i })).not.toBeInTheDocument();
+    expect(
+      rendered.queryByRole("button", { name: /save/i }),
+    ).not.toBeInTheDocument();
 
     // Make a change on step 0 to enable save later
     await user.type(rendered.getByPlaceholderText(/name/i), "_modified");
@@ -191,13 +203,17 @@ describe("<QualityControlEditor />", () => {
     // Navigate to step 1
     await user.click(rendered.getByRole("button", { name: /forward/i }));
     await waitFor(() =>
-      expect(rendered.getByRole("button", { name: /back/i })).toBeInTheDocument()
+      expect(
+        rendered.getByRole("button", { name: /back/i }),
+      ).toBeInTheDocument(),
     );
 
     // Navigate to step 2
     await user.click(rendered.getByRole("button", { name: /forward/i }));
     await waitFor(() =>
-      expect(rendered.getByRole("button", { name: /save/i })).toBeInTheDocument()
+      expect(
+        rendered.getByRole("button", { name: /save/i }),
+      ).toBeInTheDocument(),
     );
 
     expect(rendered.getByRole("button", { name: /save/i })).toBeEnabled();
@@ -209,7 +225,7 @@ describe("<QualityControlEditor />", () => {
     await user.click(rendered.getByRole("button", { name: /save/i }));
 
     await waitFor(() =>
-      expect(onSave).toHaveBeenCalledWith(expectedQualityControl)
+      expect(onSave).toHaveBeenCalledWith(expectedQualityControl),
     );
   });
 
@@ -218,7 +234,7 @@ describe("<QualityControlEditor />", () => {
     const onPublish = jest.fn();
     const rendered = render(
       <QualityControlEditor {...props} onPublish={onPublish} />,
-      renderOpts
+      renderOpts,
     );
     await waitForLoad(rendered);
     // Wait for async state updates from GraphQL queries to complete
@@ -227,7 +243,9 @@ describe("<QualityControlEditor />", () => {
     });
 
     // Publish button only appears on step 2 (last step)
-    expect(rendered.queryByRole("button", { name: /publish/i })).not.toBeInTheDocument();
+    expect(
+      rendered.queryByRole("button", { name: /publish/i }),
+    ).not.toBeInTheDocument();
 
     // Make a change on step 0 to enable publish later
     await user.type(rendered.getByPlaceholderText(/name/i), "_modified");
@@ -235,13 +253,17 @@ describe("<QualityControlEditor />", () => {
     // Navigate to step 1
     await user.click(rendered.getByRole("button", { name: /forward/i }));
     await waitFor(() =>
-      expect(rendered.getByRole("button", { name: /back/i })).toBeInTheDocument()
+      expect(
+        rendered.getByRole("button", { name: /back/i }),
+      ).toBeInTheDocument(),
     );
 
     // Navigate to step 2
     await user.click(rendered.getByRole("button", { name: /forward/i }));
     await waitFor(() =>
-      expect(rendered.getByRole("button", { name: /publish/i })).toBeInTheDocument()
+      expect(
+        rendered.getByRole("button", { name: /publish/i }),
+      ).toBeInTheDocument(),
     );
 
     expect(rendered.getByRole("button", { name: /publish/i })).toBeEnabled();
@@ -253,7 +275,7 @@ describe("<QualityControlEditor />", () => {
     await user.click(rendered.getByRole("button", { name: /publish/i }));
 
     await waitFor(() =>
-      expect(onPublish).toHaveBeenCalledWith(expectedQualityControl)
+      expect(onPublish).toHaveBeenCalledWith(expectedQualityControl),
     );
   });
 
@@ -269,7 +291,7 @@ describe("<QualityControlEditor />", () => {
         value={defaultQualityControl}
         isModification={false}
       />,
-      renderOpts
+      renderOpts,
     );
     await waitForLoad(rendered);
     // Wait for async state updates from GraphQL queries to complete
@@ -279,8 +301,12 @@ describe("<QualityControlEditor />", () => {
 
     // Save/Publish buttons only appear on step 2
     await waitFor(() => {
-      expect(rendered.queryByRole("button", { name: /publish/i })).not.toBeInTheDocument();
-      expect(rendered.queryByRole("button", { name: /save/i })).not.toBeInTheDocument();
+      expect(
+        rendered.queryByRole("button", { name: /publish/i }),
+      ).not.toBeInTheDocument();
+      expect(
+        rendered.queryByRole("button", { name: /save/i }),
+      ).not.toBeInTheDocument();
     });
 
     // Fill step 0 (Information)
@@ -289,53 +315,90 @@ describe("<QualityControlEditor />", () => {
 
     await user.type(
       rendered.getByPlaceholderText(/field1/i),
-      "field_template_modified"
+      "field_template_modified",
     );
     // Wait for SelectableDynamicForm to finish updating state (prevents act() warning)
-    await waitFor(() => {
-      const input = rendered.getByPlaceholderText(/field1/i);
-      expect(input).toHaveValue("field_template_modified");
-    }, { timeout: 2000 });
+    await waitFor(
+      () => {
+        const input = rendered.getByPlaceholderText(/field1/i);
+        expect(input).toHaveValue("field_template_modified");
+      },
+      { timeout: 2000 },
+    );
 
     await user.click(rendered.getByText(/select domains/i));
     await user.click(rendered.getByText(/bardomain/i));
 
     await user.click(
       rendered.getByRole("option", {
-        name: "count",
-      })
+        name: /quality_control.control_mode.error_count/i,
+      }),
     );
 
-    await user.type(rendered.getByPlaceholderText("Goal"), "25");
-    await user.type(rendered.getByPlaceholderText("Threshold"), "50");
+    await user.type(
+      rendered.getByPlaceholderText(
+        /quality_control.score_criteria.error_count.goal/i,
+      ),
+      "25",
+    );
+    await user.type(
+      rendered.getByPlaceholderText(
+        /quality_control.score_criteria.error_count.maximum/i,
+      ),
+      "50",
+    );
 
     // Navigate to step 1 (Control Properties)
     await user.click(rendered.getByRole("button", { name: /forward/i }));
     await waitFor(() =>
-      expect(rendered.getByRole("button", { name: /back/i })).toBeInTheDocument()
+      expect(
+        rendered.getByRole("button", { name: /back/i }),
+      ).toBeInTheDocument(),
     );
 
     // Fill step 1 - Source selector is now in step 1
     await user.click(rendered.getByText(/select source/i));
     await user.click(
-      rendered.getByRole("option", { name: /external_source_id/i })
+      rendered.getByRole("option", { name: /external_source_id/i }),
     );
 
     await user.click(rendered.getByText(/resource type/i));
     await user.click(rendered.getByText(/reference datasets/i));
     await user.click(rendered.getByRole("option", { name: /dataset1/i }));
 
+    await waitFor(() =>
+      expect(
+        rendered.getAllByRole("option", { name: /campo1/ }).length,
+      ).toBeGreaterThan(0),
+    );
+
+    await act(async () => {
+      await user.click(rendered.getAllByRole("option", { name: /campo1/ })[0]);
+      await user.click(rendered.getByRole("option", { name: /eq/i }));
+      await user.click(rendered.getAllByRole("option", { name: /campo2/ })[1]);
+    });
+
+    await waitFor(() =>
+      expect(rendered.getByRole("button", { name: /forward/i })).toBeEnabled(),
+    );
+
     // Navigate to step 2 (Segmentation)
     await user.click(rendered.getByRole("button", { name: /forward/i }));
+
     await waitFor(() =>
-      expect(rendered.queryByRole("button", { name: /forward/i })).not.toBeInTheDocument()
+      expect(
+        rendered.queryByRole("button", { name: /forward/i }),
+      ).not.toBeInTheDocument(),
     );
+
     await waitFor(() =>
-      expect(rendered.getByRole("button", { name: /publish/i })).toBeInTheDocument()
+      expect(
+        rendered.getByRole("button", { name: /publish/i }),
+      ).toBeInTheDocument(),
     );
 
     await waitFor(() =>
-      expect(rendered.getByRole("button", { name: /publish/i })).toBeEnabled()
+      expect(rendered.getByRole("button", { name: /publish/i })).toBeEnabled(),
     );
   });
 
@@ -357,7 +420,9 @@ describe("<QualityControlEditor />", () => {
     await waitFor(() => {
       expect(rendered.queryByText(/publish/i)).not.toBeInTheDocument();
       // Save button only appears on step 2
-      expect(rendered.queryByRole("button", { name: /save/i })).not.toBeInTheDocument();
+      expect(
+        rendered.queryByRole("button", { name: /save/i }),
+      ).not.toBeInTheDocument();
     });
 
     // Make a change on step 0
@@ -367,20 +432,192 @@ describe("<QualityControlEditor />", () => {
     // Navigate to step 1
     await user.click(rendered.getByRole("button", { name: /forward/i }));
     await waitFor(() =>
-      expect(rendered.getByRole("button", { name: /back/i })).toBeInTheDocument()
+      expect(
+        rendered.getByRole("button", { name: /back/i }),
+      ).toBeInTheDocument(),
     );
 
     // Navigate to step 2 to see save button
     await user.click(rendered.getByRole("button", { name: /forward/i }));
     await waitFor(() =>
-      expect(rendered.queryByRole("button", { name: /forward/i })).not.toBeInTheDocument()
+      expect(
+        rendered.queryByRole("button", { name: /forward/i }),
+      ).not.toBeInTheDocument(),
+    );
+    await waitFor(() =>
+      expect(
+        rendered.getByRole("button", { name: /save/i }),
+      ).toBeInTheDocument(),
+    );
+
+    await waitFor(() =>
+      expect(rendered.getByRole("button", { name: /save/i })).toBeEnabled(),
+    );
+  });
+
+  it("shows error status icon when first step is invalid", async () => {
+    const user = userEvent.setup({ delay: null });
+    const rendered = render(
+      <QualityControlEditor
+        {...props}
+        isModification={false}
+        value={defaultQualityControl}
+      />,
+      renderOpts,
+    );
+
+    await waitForLoad(rendered);
+    await waitFor(() => {
+      expect(rendered.getByPlaceholderText(/name/i)).toBeInTheDocument();
+    });
+
+    await user.click(rendered.getByRole("button", { name: /forward/i }));
+
+    await waitFor(() => {
+      expect(
+        rendered.queryByRole("button", { name: /back/i }),
+      ).not.toBeInTheDocument();
+      expect(rendered.container.querySelector("i.red.x.icon")).toBeInTheDocument();
+    });
+  });
+
+  it("test back button returns to previous step", async () => {
+    const user = userEvent.setup({ delay: null });
+    const rendered = render(<QualityControlEditor {...props} />, renderOpts);
+
+    await waitForLoad(rendered);
+    await waitFor(() => {
+      expect(rendered.getByPlaceholderText(/name/i)).toBeInTheDocument();
+    });
+
+    await user.click(rendered.getByRole("button", { name: /forward/i }));
+
+    await waitFor(() =>
+      expect(
+        rendered.getByRole("button", { name: /back/i }),
+      ).toBeInTheDocument(),
+    );
+
+    await user.click(rendered.getByRole("button", { name: /back/i }));
+
+    await waitFor(() => {
+      expect(
+        rendered.queryByRole("button", { name: /back/i }),
+      ).not.toBeInTheDocument();
+      expect(rendered.getByRole("button", { name: /forward/i })).toBeInTheDocument();
+    });
+  });
+
+  it("renders nothing when value is not provided", () => {
+    const newProps = {
+      ...props,
+      value: undefined,
+    };
+    const rendered = render(<QualityControlEditor {...newProps} />, renderOpts);
+    expect(rendered.container.firstChild).toBeNull();
+  });
+
+  it("does not render save button when onSave is undefined on last step", async () => {
+    const user = userEvent.setup({ delay: null });
+    const newProps = {
+      ...props,
+      onSave: undefined,
+    };
+    const rendered = render(<QualityControlEditor {...newProps} />, renderOpts);
+
+    await waitForLoad(rendered);
+    await waitFor(() => {
+      expect(rendered.getByPlaceholderText(/name/i)).toBeInTheDocument();
+    });
+
+    await user.click(rendered.getByRole("button", { name: /forward/i }));
+    await waitFor(() =>
+      expect(
+        rendered.getByRole("button", { name: /back/i }),
+      ).toBeInTheDocument(),
+    );
+    await user.click(rendered.getByRole("button", { name: /forward/i }));
+
+    await waitFor(() =>
+      expect(
+        rendered.queryByRole("button", { name: /forward/i }),
+      ).not.toBeInTheDocument(),
+    );
+
+    await waitFor(() =>
+      expect(
+        rendered.queryByRole("button", { name: /save/i }),
+      ).not.toBeInTheDocument(),
+    );
+  });
+
+  it("does not render publish button when onPublish is undefined on last step", async () => {
+    const user = userEvent.setup({ delay: null });
+    const newProps = {
+      ...props,
+      onPublish: undefined,
+    };
+    const rendered = render(<QualityControlEditor {...newProps} />, renderOpts);
+
+    await waitForLoad(rendered);
+    await waitFor(() => {
+      expect(rendered.getByPlaceholderText(/name/i)).toBeInTheDocument();
+    });
+
+    await user.click(rendered.getByRole("button", { name: /forward/i }));
+    await waitFor(() =>
+      expect(
+        rendered.getByRole("button", { name: /back/i }),
+      ).toBeInTheDocument(),
+    );
+    await user.click(rendered.getByRole("button", { name: /forward/i }));
+
+    await waitFor(() =>
+      expect(
+        rendered.queryByRole("button", { name: /forward/i }),
+      ).not.toBeInTheDocument(),
+    );
+
+    await waitFor(() =>
+      expect(
+        rendered.queryByRole("button", { name: /publish/i }),
+      ).not.toBeInTheDocument(),
+    );
+  });
+
+  it("does not call onSave when full form validation fails", async () => {
+    const user = userEvent.setup({ delay: null });
+    const onSave = jest.fn();
+    const rendered = render(
+      <QualityControlEditor {...props} onSave={onSave} />,
+      renderOpts,
     );
+
+    await waitForLoad(rendered);
+    await waitFor(() => {
+      expect(rendered.getByPlaceholderText(/name/i)).toBeInTheDocument();
+    });
+
+    await user.type(rendered.getByPlaceholderText(/name/i), "_modified");
+    await user.click(rendered.getByRole("button", { name: /forward/i }));
     await waitFor(() =>
-      expect(rendered.getByRole("button", { name: /save/i })).toBeInTheDocument()
+      expect(
+        rendered.getByRole("button", { name: /back/i }),
+      ).toBeInTheDocument(),
     );
+    await user.click(rendered.getByRole("button", { name: /forward/i }));
 
     await waitFor(() =>
-      expect(rendered.getByRole("button", { name: /save/i })).toBeEnabled()
+      expect(
+        rendered.getByRole("button", { name: /save/i }),
+      ).toBeInTheDocument(),
     );
+
+    fireEvent.change(rendered.getByPlaceholderText(/name/i), {
+      target: { value: "" },
+    });
+
+    await user.click(rendered.getByRole("button", { name: /save/i }));
+    await waitFor(() => expect(onSave).not.toHaveBeenCalled());
   });
 });

package/src/components/qualityControls/__tests__/ScoreCriteria.spec.js

@@ -20,9 +20,9 @@ describe("<ScoreCriteria />", () => {
     expect(container).toMatchSnapshot();
   });
 
-  it("matches the latest snapshot for count", () => {
+  it("matches the latest snapshot for error_count", () => {
     const defaultValues = {
-      control_mode: "count",
+      control_mode: "error_count",
     };
     const { container } = render(
       <TestFormWrapper defaultValues={defaultValues}>
@@ -62,7 +62,7 @@ describe("<ScoreCriteria />", () => {
   [
     { controlMode: "deviation", expectedValue: { goal: null, maximum: null } },
     {
-      controlMode: "count",
+      controlMode: "error_count",
       expectedValue: { goal: null, maximum: null },
     },
     { controlMode: "percentage", expectedValue: { goal: null, minimum: null } },
@@ -73,4 +73,26 @@ describe("<ScoreCriteria />", () => {
       expect(defaultForMode(controlMode)).toEqual(expectedValue);
     })
   );
+
+  it("matches the latest snapshot for unsupported controlMode", () => {
+    const defaultValues = {
+      control_mode: "unsupported",
+    };
+    const rendered = render(
+      <TestFormWrapper defaultValues={defaultValues}>
+        <ScoreCriteria />
+      </TestFormWrapper>,
+      renderOpts
+    );
+
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("returns undefined for unsupported controlMode", () => {
+    expect(defaultForMode("unsupported")).toBeUndefined();
+  });
+
+  it("returns undefined when controlMode is not provided", () => {
+    expect(defaultForMode()).toBeUndefined();
+  });
 });

package/src/components/qualityControls/__tests__/ScoreCriteriaView.spec.js

@@ -47,9 +47,9 @@ describe("<ScoreCriteriaView />", () => {
     expect(queryByText(/5/i)).toBeInTheDocument();
   });
 
-  it("view for count", () => {
+  it("view for error_count with goal and maximum", () => {
     const qc = qualityControlData({
-      control_mode: "count",
+      control_mode: "error_count",
       score_criteria: {
         goal: 15,
         maximum: 40,
@@ -64,7 +64,7 @@ describe("<ScoreCriteriaView />", () => {
 
   it("view for empty score_criteria", () => {
     const qc = qualityControlData({
-      control_mode: "count",
+      control_mode: "error_count",
       score_criteria: undefined,
     });
     const { queryByText } = render(
@@ -74,4 +74,20 @@ describe("<ScoreCriteriaView />", () => {
 
     expect(queryByText(/No result criteria defined/i)).toBeInTheDocument();
   });
+
+  it("view for unsupported control_mode", () => {
+    const qc = qualityControlData({
+      control_mode: "unsupported",
+      score_criteria: {
+        goal: 10,
+        minimum: 5,
+      },
+    });
+    const { queryByText } = render(
+      <ScoreCriteriaView qualityControl={qc} />,
+      renderOpts
+    );
+
+    expect(queryByText(/No result criteria defined/i)).toBeInTheDocument();
+  });
 });

package/src/components/qualityControls/__tests__/__fixtures__/qualityControlHelper.js

@@ -156,7 +156,7 @@ const qualityControl = {
           type: "data_structure",
         },
       },
-      control_mode: "count",
+      control_mode: "error_count",
       dynamic_content: {
         control_de_calidad: {
           origin: "user",

package/src/components/qualityControls/__tests__/__snapshots__/ControlProperties.spec.js.snap

@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`<ControlProperties /> matches the latest snapshot with count 1`] = `
+exports[`<ControlProperties /> matches the latest snapshot with error_count 1`] = `
 <div>
   <div
     class="ui segment"
@@ -11,6 +11,12 @@ exports[`<ControlProperties /> matches the latest snapshot with count 1`] = `
       <label>
         Source
       </label>
+      <button
+        data-testid="mock-source-selector"
+        type="button"
+      >
+        181
+      </button>
     </div>
     <div
       class="required field"
@@ -88,6 +94,12 @@ exports[`<ControlProperties /> matches the latest snapshot with ratio 1`] = `
       <label>
         Source
       </label>
+      <button
+        data-testid="mock-source-selector"
+        type="button"
+      >
+        181
+      </button>
     </div>
     <div
       class="required field"