@truedat/dq 7.5.9 → 7.5.10

package/src/components/__tests__/NewRuleImplementation.spec.js

@@ -1,10 +1,10 @@
-import _ from "lodash/fp";
-import React from "react";
+import _ from "lodash";
+import userEvent from "@testing-library/user-event";
 import { waitFor, within } from "@testing-library/react";
-import { render } from "@truedat/test/render";
+import { render, waitForLoad } from "@truedat/test/render";
 import { DOMAIN_QUERY, DOMAINS_QUERY } from "@truedat/core/api/queries";
+import { REFERENCE_DATASETS_HEADERS_QUERY } from "@truedat/dd/api/queries";
 import { functionsMock, multipleTemplatesMock } from "@truedat/test/mocks";
-import userEvent from "@testing-library/user-event";
 import NewRuleImplementation, {
   NewRuleImplementation as NewRuleImplementationComponent,
 } from "../NewRuleImplementation";
@@ -40,6 +40,11 @@ const domainMock = {
   result: { data: { domain: { id: "2", actions: domainActions } } },
 };
 
+const referenceDatasetsMock = {
+  request: { query: REFERENCE_DATASETS_HEADERS_QUERY },
+  result: { data: { referenceDatasets: [] } },
+};
+
 describe("<NewRuleImplementation />", () => {
   const createRuleImplementation = jest.fn();
   const updateRuleImplementation = jest.fn();
@@ -56,6 +61,7 @@ describe("<NewRuleImplementation />", () => {
     createRuleImplementation,
     updateRuleImplementation,
   };
+
   const renderOpts = {
     mocks: [
       functionsMock,
@@ -63,44 +69,38 @@ describe("<NewRuleImplementation />", () => {
         scope: "ri",
         domainIds: null,
       }),
+      multipleTemplatesMock({
+        scope: "ri",
+        domainIds: [2],
+      }),
       domainsMock,
       domainMock,
+      referenceDatasetsMock,
     ],
     state: { ruleImplementationCreating: false },
-    fallback: "lazy",
   };
 
   it("matches the latest snapshot", async () => {
-    const { container, queryByText } = render(
-      <NewRuleImplementation {...props} />,
-      renderOpts
-    );
-
-    await waitFor(() => {
-      expect(queryByText(/lazy/i)).not.toBeInTheDocument();
-      expect(container.querySelector(".loader")).not.toBeInTheDocument();
-      expect(queryByText("Template")).toBeInTheDocument();
-    });
-    expect(container).toMatchSnapshot();
+    const rendered = render(<NewRuleImplementation {...props} />, renderOpts);
+    await waitForLoad(rendered);
+    await rendered.findByText(/template.selector.label/i);
+    expect(rendered.container).toMatchSnapshot();
   });
 
   it("calculate aliases when not informed", async () => {
-    const { container, queryByText } = render(
+    const rendered = render(
       <NewRuleImplementationComponent {...newRuleImplementationProps} />,
       renderOpts
     );
-    await waitFor(() => {
-      expect(queryByText(/lazy/i)).not.toBeInTheDocument();
-      expect(container.querySelector(".loader")).not.toBeInTheDocument();
-    });
-    expect(container).toMatchSnapshot();
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
   });
 });
 
 describe("<NewRuleImplementation> NewRuleImplementation doSubmit", () => {
   const dispatch = jest.fn();
 
-  const renderOptsImplementationEdit = {
+  const renderOpts = {
     mocks: [
       functionsMock,
       multipleTemplatesMock({
@@ -109,9 +109,9 @@ describe("<NewRuleImplementation> NewRuleImplementation doSubmit", () => {
       }),
       domainsMock,
       domainMock,
+      referenceDatasetsMock,
     ],
     state: ruleImplementationLoaderGlobalState,
-    fallback: "lazy",
     dispatch,
   };
 
@@ -169,75 +169,72 @@ describe("<NewRuleImplementation> NewRuleImplementation doSubmit", () => {
       ],
     };
 
-    const { queryByText, getByRole, findByRole, findByTestId } = render(
-      <NewRuleImplementation {...props} />,
-      renderOptsImplementationEdit
-    );
-
-    // Information Form
+    const rendered = render(<NewRuleImplementation {...props} />, renderOpts);
+    await waitForLoad(rendered);
+    await rendered.findByText(/template.selector.label/i);
 
-    await waitFor(() => {
-      expect(queryByText(/Template/)).toBeTruthy();
-    });
+    const user = userEvent.setup({ delay: null });
 
-    userEvent.click(await findByRole("option", { name: "template1" }));
+    await user.click(
+      await rendered.findByRole("option", { name: /template1/i })
+    );
 
     await waitFor(() => {
-      expect(getByRole("button", { name: "Next" })).toBeEnabled();
+      expect(rendered.getByRole("button", { name: /next/i })).toBeEnabled();
     });
-    userEvent.click(await getByRole("button", { name: "Next" }));
-
-    // Dataset Form
+    await user.click(rendered.getByRole("button", { name: /next/i }));
 
     await waitFor(() => {
-      expect(getByRole("button", { name: "Next" })).toBeEnabled();
+      expect(rendered.getByRole("button", { name: /next/i })).toBeEnabled();
     });
-    userEvent.click(await getByRole("button", { name: "Next" }));
-
-    // Population Form
+    await user.click(rendered.getByRole("button", { name: /next/i }));
 
     await waitFor(() => {
-      expect(getByRole("button", { name: "Next" })).toBeEnabled();
+      expect(rendered.getByRole("button", { name: /next/i })).toBeEnabled();
     });
-    userEvent.click(await getByRole("button", { name: "Next" }));
+    await user.click(rendered.getByRole("button", { name: /next/i }));
 
-    // Validations Form
-
-    userEvent.click(await findByRole("button", { name: "add-condition-row" }));
+    await user.click(
+      await rendered.findByRole("button", { name: /add-condition-row/i })
+    );
+    await waitForLoad(rendered);
 
-    const row = await findByTestId("row-0");
+    const row = await rendered.findByTestId("row-0");
 
-    const field = row.querySelector('div[label="Field"]');
-    const operator = row.querySelector('div[label="Operator"]');
+    const field = row.querySelector('div[label="filtersGrid.field.label"]');
+    const operator = row.querySelector(
+      'div[label="filtersGrid.field.operator"]'
+    );
 
-    userEvent.click(field);
+    await user.click(field);
     const fieldOptions = await within(field).findByRole("listbox");
     const emailFieldOption = within(fieldOptions).getByText("EMAIL");
-    userEvent.click(emailFieldOption);
+    await user.click(emailFieldOption);
     const selectedField = fieldOptions.querySelector(".selected>span");
     expect(within(selectedField).queryByText(/EMAIL/)).toBeInTheDocument();
 
-    userEvent.click(operator);
+    await user.click(operator);
     const operatorOptions = await within(operator).findByRole("listbox");
-    const emptyOperatorOption = within(operatorOptions).getByText("is empty");
-    userEvent.click(emptyOperatorOption);
+    const emptyOperatorOption =
+      within(operatorOptions).getByText(/operator.empty/);
+    await user.click(emptyOperatorOption);
     const selectedOperator = operatorOptions.querySelector(".selected>span");
     expect(
-      within(selectedOperator).queryByText(/is empty/)
+      within(selectedOperator).queryByText(/operator.empty/)
     ).toBeInTheDocument();
 
     // Segments
 
     await waitFor(() => {
-      expect(getByRole("button", { name: "Next" })).toBeEnabled();
+      expect(rendered.getByRole("button", { name: /next/i })).toBeEnabled();
     });
-    userEvent.click(await getByRole("button", { name: "Next" }));
+    await user.click(await rendered.getByRole("button", { name: /next/i }));
 
     await waitFor(() => {
-      expect(getByRole("button", { name: "Save" })).toBeEnabled();
+      expect(rendered.getByRole("button", { name: /save/i })).toBeEnabled();
     });
 
-    userEvent.click(await getByRole("button", { name: "Save" }));
+    await user.click(await rendered.getByRole("button", { name: /save/i }));
 
     expect(dispatch).toHaveBeenCalledWith({
       ...ruleImplementationLoaderActions.updateRuleImplementation(),
@@ -311,75 +308,78 @@ describe("<NewRuleImplementation> NewRuleImplementation doSubmit", () => {
       ],
     };
 
-    const { queryByText, getByRole, findByRole, findByTestId } = render(
-      <NewRuleImplementation {...props} />,
-      renderOptsImplementationEdit
-    );
-
-    // Information Form
+    const rendered = render(<NewRuleImplementation {...props} />, renderOpts);
+    await waitForLoad(rendered);
+    await rendered.findByText(/template.selector.label/i);
 
-    await waitFor(() => {
-      expect(queryByText(/Template/)).toBeTruthy();
-    });
+    const user = userEvent.setup({ delay: null });
 
-    userEvent.click(await findByRole("option", { name: "template1" }));
+    await user.click(
+      await rendered.findByRole("option", { name: /template1/i })
+    );
 
     await waitFor(() => {
-      expect(getByRole("button", { name: "Next" })).toBeEnabled();
+      expect(rendered.getByRole("button", { name: /next/i })).toBeEnabled();
     });
-    userEvent.click(await getByRole("button", { name: "Next" }));
-
-    // Dataset Form
+    await user.click(rendered.getByRole("button", { name: /next/i }));
 
     await waitFor(() => {
-      expect(getByRole("button", { name: "Next" })).toBeEnabled();
+      expect(rendered.getByRole("button", { name: /next/i })).toBeEnabled();
     });
-    userEvent.click(await getByRole("button", { name: "Next" }));
-
-    // Population Form
+    await user.click(rendered.getByRole("button", { name: /next/i }));
 
     await waitFor(() => {
-      expect(getByRole("button", { name: "Next" })).toBeEnabled();
+      expect(rendered.getByRole("button", { name: /next/i })).toBeEnabled();
     });
-    userEvent.click(await getByRole("button", { name: "Next" }));
+    await user.click(rendered.getByRole("button", { name: /next/i }));
 
-    // Validations Form
-
-    userEvent.click(await findByRole("button", { name: "add-condition-row" }));
+    await user.click(
+      await rendered.findByRole("button", { name: /add-condition-row/i })
+    );
 
-    const row = await findByTestId("row-0");
+    await waitForLoad(rendered);
 
-    const field = row.querySelector('div[label="Field"]');
-    const operator = row.querySelector('div[label="Operator"]');
+    const field = rendered.container.querySelector(
+      'div[label="filtersGrid.field.label"]'
+    );
+    const operator = rendered.container.querySelector(
+      'div[label="filtersGrid.field.operator"]'
+    );
 
-    userEvent.click(field);
+    await user.click(field);
     const fieldOptions = await within(field).findByRole("listbox");
     const emailFieldOption = within(fieldOptions).getByText("EMAIL");
-    userEvent.click(emailFieldOption);
+    await user.click(emailFieldOption);
     const selectedField = fieldOptions.querySelector(".selected>span");
     expect(within(selectedField).queryByText(/EMAIL/)).toBeInTheDocument();
 
-    userEvent.click(operator);
+    await user.click(operator);
     const operatorOptions = await within(operator).findByRole("listbox");
     const uniqueAcrossFieldsOperatorOption = within(operatorOptions).getByText(
-      "unique across fields"
+      /operator.unique.field_list/
     );
-    userEvent.click(uniqueAcrossFieldsOperatorOption);
+    await user.click(uniqueAcrossFieldsOperatorOption);
+    await waitForLoad(rendered);
     const selectedOperator = operatorOptions.querySelector(".selected>span");
+
     expect(
-      within(selectedOperator).queryByText(/unique across fields/)
+      within(selectedOperator).queryByText(/operator.unique.field_list/)
     ).toBeInTheDocument();
 
-    const updatedRow = await findByTestId("row-0");
-    const value = updatedRow.querySelector('div[label="Value"]');
-    userEvent.click(value);
+    await waitForLoad(rendered);
+
+    const updatedRow = await rendered.findByTestId("row-0");
+    const value = updatedRow.querySelector(
+      'div[label="filtersGrid.field.value"]'
+    );
+    await user.click(value);
     const valueOptions = await within(value).findByRole("listbox");
     const valueEmailFieldOption = within(valueOptions).getByText("EMAIL");
     const valuePhoneNumberFieldOption =
       within(valueOptions).getByText("PHONE_NUMBER");
 
-    userEvent.click(valueEmailFieldOption);
-    userEvent.click(valuePhoneNumberFieldOption);
+    await user.click(valueEmailFieldOption);
+    await user.click(valuePhoneNumberFieldOption);
 
     const selectedFieldValues = updatedRow.querySelectorAll(".label");
 
@@ -394,14 +394,14 @@ describe("<NewRuleImplementation> NewRuleImplementation doSubmit", () => {
     // Segments
 
     await waitFor(() => {
-      expect(getByRole("button", { name: "Next" })).toBeEnabled();
+      expect(rendered.getByRole("button", { name: /next/i })).toBeEnabled();
     });
-    userEvent.click(await getByRole("button", { name: "Next" }));
+    await user.click(await rendered.getByRole("button", { name: /next/i }));
 
     await waitFor(() => {
-      expect(getByRole("button", { name: "Save" })).toBeEnabled();
+      expect(rendered.getByRole("button", { name: /save/i })).toBeEnabled();
     });
-    userEvent.click(await getByRole("button", { name: "Save" }));
+    await user.click(rendered.getByRole("button", { name: /save/i }));
 
     expect(dispatch).toHaveBeenCalledWith({
       ...ruleImplementationLoaderActions.updateRuleImplementation(),

package/src/components/__tests__/QualityEventError.spec.js

@@ -1,5 +1,4 @@
-import React from "react";
-import { shallow } from "enzyme";
+import { render, waitForLoad } from "@truedat/test/render";
 import { QualityEventError } from "../QualityEventError";
 
 describe("<QualityEventError />", () => {
@@ -9,7 +8,8 @@ describe("<QualityEventError />", () => {
       message: "foo",
       type: "FAILED",
     };
-    const wrapper = shallow(<QualityEventError {...props} />);
-    expect(wrapper).toMatchSnapshot();
+    const rendered = render(<QualityEventError {...props} />);
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
   });
 });

package/src/components/__tests__/QualityRoutes.spec.js

@@ -0,0 +1,86 @@
+import React from "react";
+import { render, waitForLoad } from "@truedat/test/render";
+import QualityRoutes from "../QualityRoutes";
+import { useAuthorized } from "@truedat/core/hooks/useAuthorized";
+import {
+  EXECUTION_GROUPS,
+  RULES,
+  IMPLEMENTATIONS,
+  IMPLEMENTATIONS_PENDING,
+  IMPLEMENTATIONS_DEPRECATED,
+} from "@truedat/core/routes";
+
+jest.mock("@truedat/core/hooks/useAuthorized", () => ({
+  useAuthorized: jest.fn(() => true),
+}));
+
+// Mock all child components
+jest.mock("../ExecutionGroup", () => () => <div>ExecutionGroup</div>);
+jest.mock("../ExecutionGroupLoader", () => () => (
+  <div>ExecutionGroupLoader</div>
+));
+jest.mock("../ExecutionGroups", () => () => <div>ExecutionGroups</div>);
+jest.mock("../ImplementationsRoutes", () => () => (
+  <div>ImplementationsRoutes</div>
+));
+jest.mock("../RulesRoutes", () => () => <div>RulesRoutes</div>);
+jest.mock("@truedat/core/router/Unauthorized", () => () => (
+  <div>Unauthorized</div>
+));
+
+describe("<QualityRoutes />", () => {
+  it("renders correctly with default route", async () => {
+    const rendered = render(<QualityRoutes />);
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("renders correctly with execution groups route", async () => {
+    const rendered = render(<QualityRoutes />, {
+      routes: [EXECUTION_GROUPS],
+    });
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("renders correctly with rules route", async () => {
+    const rendered = render(<QualityRoutes />, {
+      routes: [RULES],
+    });
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("renders correctly with implementations route", async () => {
+    const rendered = render(<QualityRoutes />, {
+      routes: [IMPLEMENTATIONS],
+    });
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("renders correctly with pending implementations route", async () => {
+    const rendered = render(<QualityRoutes />, {
+      routes: [IMPLEMENTATIONS_PENDING],
+    });
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("renders correctly with deprecated implementations route", async () => {
+    const rendered = render(<QualityRoutes />, {
+      routes: [IMPLEMENTATIONS_DEPRECATED],
+    });
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("renders unauthorized component when not authorized", async () => {
+    useAuthorized.mockReturnValueOnce(false);
+    const rendered = render(<QualityRoutes />, {
+      routes: [EXECUTION_GROUPS],
+    });
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+});

package/src/components/__tests__/RawContent.spec.js

@@ -1,4 +1,3 @@
-import React from "react";
 import { render } from "@truedat/test/render";
 import { RawContent } from "../RawContent";
 

package/src/components/__tests__/RemediationForm.spec.js

@@ -1,4 +1,3 @@
-import React from "react";
 import { waitFor } from "@testing-library/react";
 import { render } from "@truedat/test/render";
 import { multipleTemplatesMock } from "@truedat/test/mocks";
@@ -7,7 +6,6 @@ import RemediationForm from "../RemediationForm";
 const renderOpts = {
   mocks: [multipleTemplatesMock({ scope: "remediation", domainIds: [1] })],
   state: { remediation: {}, ruleImplementation: { domain_id: 1 } },
-  fallback: "lazy",
 };
 
 describe("<RemediationForm />", () => {

package/src/components/__tests__/RemediationPlan.spec.js

@@ -1,12 +1,11 @@
-import React from "react";
 import { waitFor } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
-import { render } from "@truedat/test/render";
+import { render, waitForLoad } from "@truedat/test/render";
 import { multipleTemplatesMock } from "@truedat/test/mocks";
 import RemediationPlan from "../RemediationPlan";
 
-jest.mock("react-router-dom", () => ({
-  ...jest.requireActual("react-router-dom"),
+jest.mock("react-router", () => ({
+  ...jest.requireActual("react-router"),
   useParams: () => ({
     id: 777,
     implementation_id: 862,
@@ -31,18 +30,14 @@ const state = {
 const renderOpts = {
   state,
   routes: ["/rules/777/implementations/862/results/66322"],
-  fallback: "lazy",
-  mocks: [multipleTemplatesMock({ scope: "remediation", domainIds: [1] })],
+  mocks: [multipleTemplatesMock({ scope: "remediation", domainIds: null })],
 };
 
 describe("<RemediationPlan />", () => {
   it("matches the latest snapshot", async () => {
-    const { container, queryByText } = render(<RemediationPlan />, renderOpts);
-    await waitFor(() => expect(queryByText(/lazy/i)).not.toBeInTheDocument());
-    await waitFor(() =>
-      expect(queryByText(/loading/i)).not.toBeInTheDocument()
-    );
-    expect(container).toMatchSnapshot();
+    const rendered = render(<RemediationPlan />, renderOpts);
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
   });
 
   it("New remediation component is shown if there is no existing remediation", async () => {
@@ -50,33 +45,32 @@ describe("<RemediationPlan />", () => {
       remediationActions: { create: true },
       templates: [{ id: 1 }],
     };
-    const { queryByText } = render(<RemediationPlan />, {
+    const rendered = render(<RemediationPlan />, {
       ...renderOpts,
       state,
     });
-    await waitFor(() =>
-      expect(queryByText(/Create Remediation Plan/)).toBeInTheDocument()
-    );
+    await waitForLoad(rendered);
+    expect(
+      rendered.getByText(/remediation.actions.create/i)
+    ).toBeInTheDocument();
   });
 
   it("Remediation view is shown if there is an existing remediation", async () => {
-    const { queryByText } = render(<RemediationPlan />, renderOpts);
-
-    await waitFor(() => expect(queryByText(/Edit/)).toBeInTheDocument());
+    const rendered = render(<RemediationPlan />, renderOpts);
+    await waitForLoad(rendered);
+    expect(rendered.getByText(/edit/i)).toBeInTheDocument();
   });
 
   it("Remediation form is shown if edit button is clicked", async () => {
-    const { queryByText, queryByRole } = render(
-      <RemediationPlan />,
-      renderOpts
-    );
+    const rendered = render(<RemediationPlan />, renderOpts);
+    await waitForLoad(rendered);
+
+    userEvent.click(rendered.getByText(/edit/i));
 
-    await waitFor(() => expect(queryByText("loading")).not.toBeInTheDocument());
-    userEvent.click(await queryByText(/Edit/));
-    await waitFor(() =>
+    await waitFor(() => {
       expect(
-        queryByRole("form", { name: "remediation-form" })
-      ).toBeInTheDocument()
-    );
+        rendered.getByRole("form", { name: "remediation-form" })
+      ).toBeInTheDocument();
+    });
   });
 });

package/src/components/__tests__/Rule.spec.js

@@ -1,7 +1,20 @@
-import React from "react";
-import { shallow } from "enzyme";
+import { render, waitForLoad } from "@truedat/test/render";
 import { Rule } from "../Rule";
 
+// Mock the imported components
+jest.mock("../RuleTabs", () => () => (
+  <div data-testid="rule-tabs">RuleTabs</div>
+));
+jest.mock("../RuleActions", () => () => (
+  <div data-testid="rule-actions">RuleActions</div>
+));
+jest.mock("../Subscription", () => () => (
+  <div data-testid="subscription">Subscription</div>
+));
+jest.mock("../RuleSummary", () => () => (
+  <div data-testid="rule-summary">RuleSummary</div>
+));
+
 describe("<Rule />", () => {
   const props = {
     rule: { id: 1, name: "foo" },
@@ -13,8 +26,9 @@ describe("<Rule />", () => {
     implementations: [{ id: 100, implementation_key: "bar" }],
   };
 
-  it("matches the latest snapshot", () => {
-    const wrapper = shallow(<Rule {...props} />);
-    expect(wrapper).toMatchSnapshot();
+  it("matches the latest snapshot", async () => {
+    const rendered = render(<Rule {...props} />);
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
   });
 });

package/src/components/__tests__/RuleActions.spec.js

@@ -1,5 +1,4 @@
-import React from "react";
-import { shallow } from "enzyme";
+import { render, waitForLoad } from "@truedat/test/render";
 import { RuleActions } from "../RuleActions";
 
 describe("<RuleActions />", () => {
@@ -8,13 +7,17 @@ describe("<RuleActions />", () => {
   const manageRule = true;
   const props = { rule, deleteRule, manageRule };
 
-  it("matches the latest snapshot", () => {
-    const wrapper = shallow(<RuleActions {...props} />);
-    expect(wrapper).toMatchSnapshot();
+  it("matches the latest snapshot", async () => {
+    const rendered = render(<RuleActions {...props} />);
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
   });
 
-  it("contains a <GroupActions />", () => {
-    const wrapper = shallow(<RuleActions {...props} />);
-    expect(wrapper.find("GroupActions")).toHaveLength(1);
+  it("contains a GroupActions component", async () => {
+    const rendered = render(<RuleActions {...props} />);
+    await waitForLoad(rendered);
+    expect(
+      rendered.container.querySelector(".group-actions")
+    ).toBeInTheDocument();
   });
 });