@truedat/dq 7.5.9 → 7.5.11

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

@@ -1,23 +1,99 @@
 import React from "react";
-import { render } from "@truedat/test/render";
+import { render, waitForLoad } from "@truedat/test/render";
 import { RuleRoutes } from "../RuleRoutes";
+import { useAuthorized } from "@truedat/core/hooks/useAuthorized";
+import {
+  RULE,
+  RULE_EDIT,
+  RULE_EVENTS,
+  RULE_IMPLEMENTATION_NEW,
+  RULE_IMPLEMENTATION_NEW_RAW,
+  RULE_IMPLEMENTATIONS,
+} from "@truedat/core/routes";
 
-describe("<RuleRoutes>", () => {
-  const props = {
-    rule: {},
-    implementationStructures: [],
+jest.mock("@truedat/core/hooks/useAuthorized", () => ({
+  useAuthorized: jest.fn(() => true),
+}));
+
+// Mock child components
+jest.mock("../EditRule", () => () => <div>EditRule</div>);
+jest.mock("../NewRuleImplementation", () => () => (
+  <div>NewRuleImplementation</div>
+));
+jest.mock("../Rule", () => () => <div>Rule</div>);
+jest.mock("../RuleCrumbs", () => () => <div>RuleCrumbs</div>);
+jest.mock("../RuleEvents", () => () => <div>RuleEvents</div>);
+jest.mock("../RuleFormImplementations", () => () => (
+  <div>RuleFormImplementations</div>
+));
+jest.mock("../RuleProperties", () => () => <div>RuleProperties</div>);
+
+jest.mock("@truedat/df/components/DynamicFormViewer", () => () => (
+  <div>DynamicFormViewer</div>
+));
+
+describe("<RuleRoutes />", () => {
+  const defaultProps = {
+    rule: { name: "Test Rule", df_name: "test" },
     ruleLoaded: true,
-    template: {},
-    ruleImplementation: {},
-    ruleImplementationLoaded: true,
-    implementationStructuresLoaded: true,
-    systemsLoading: true,
+    structuresAliasesLoading: false,
+    systemsLoading: false,
+    template: { name: "test" },
     templatesLoaded: true,
-    structuresAliasesLoading: true,
   };
 
-  it("matches the latest snapshot", () => {
-    const { container } = render(<RuleRoutes {...props} />, {});
-    expect(container).toMatchSnapshot();
+  it("renders correctly with default route", async () => {
+    const rendered = render(<RuleRoutes {...defaultProps} />);
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("renders correctly with edit route", async () => {
+    const rendered = render(<RuleRoutes {...defaultProps} />, {
+      routes: [RULE_EDIT.replace(":id", "123")],
+    });
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("renders correctly with events route", async () => {
+    const rendered = render(<RuleRoutes {...defaultProps} />, {
+      routes: [RULE_EVENTS.replace(":id", "123")],
+    });
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("renders correctly with implementations route", async () => {
+    const rendered = render(<RuleRoutes {...defaultProps} />, {
+      routes: [RULE_IMPLEMENTATIONS.replace(":id", "123")],
+    });
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("renders correctly with new implementation route", async () => {
+    const rendered = render(<RuleRoutes {...defaultProps} />, {
+      routes: [RULE_IMPLEMENTATION_NEW.replace(":id", "123")],
+    });
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("renders correctly with new raw implementation route", async () => {
+    const rendered = render(<RuleRoutes {...defaultProps} />, {
+      routes: [RULE_IMPLEMENTATION_NEW_RAW.replace(":id", "123")],
+    });
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("renders unauthorized component when not authorized", async () => {
+    useAuthorized.mockReturnValueOnce(false);
+    const rendered = render(<RuleRoutes {...defaultProps} />, {
+      routes: [RULE_EDIT.replace(":id", "123")],
+    });
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
   });
 });

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

@@ -1,4 +1,3 @@
-import React from "react";
 import _ from "lodash/fp";
 import { render } from "@truedat/test/render";
 import { RuleRow } from "../RuleRow";
@@ -35,7 +34,6 @@ describe("<RuleRow />", () => {
       </table>,
       renderOpts
     );
-    //   const wrapper = shallow(<RuleRow {...props} />);
     expect(container).toMatchSnapshot();
   });
 

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

@@ -1,20 +1,15 @@
-import React from "react";
-import { shallow } from "enzyme";
-import { intl } from "@truedat/test/intl-stub";
+import { render, waitForLoad } from "@truedat/test/render";
 import { RulesSearch } from "../RulesSearch";
 
-// workaround for enzyme issue with React.useContext
-// see https://github.com/airbnb/enzyme/issues/2176#issuecomment-532361526
-jest.spyOn(React, "useContext").mockImplementation(() => intl);
-
 describe("<RulesSearch />", () => {
-  const loading = false;
-  const query = "";
-  const fetchRules = jest.fn();
-  const props = { loading, query, fetchRules };
-
-  it("matches the latest snapshot", () => {
-    const wrapper = shallow(<RulesSearch {...props} />);
-    expect(wrapper).toMatchSnapshot();
+  it("matches the latest snapshot", async () => {
+    const props = {
+      loading: false,
+      query: "",
+      fetchRules: jest.fn(),
+    };
+    const rendered = render(<RulesSearch {...props} />);
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
   });
 });

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

@@ -1,4 +1,3 @@
-import React from "react";
 import { waitFor } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
 import { render } from "@truedat/test/render";

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

@@ -1,23 +1,23 @@
-import React from "react";
-import { shallow, mount } from "enzyme";
+import { render, waitForLoad } from "@truedat/test/render";
 import { RuleSubscriptionLoader } from "../RuleSubscriptionLoader";
 
-jest.mock("react-router-dom", () => ({
-  ...jest.requireActual("react-router-dom"),
+jest.mock("react-router", () => ({
+  ...jest.requireActual("react-router"),
   useParams: () => ({ id: 1 }),
 }));
 
 describe("<RuleSubscriptionLoader />", () => {
-  const searchSubscriptions = jest.fn();
-  const clearSubscriptionsSearch = jest.fn();
-
-  it("matches the latest snapshot", () => {
-    const props = { clearSubscriptionsSearch, searchSubscriptions };
-    const wrapper = shallow(<RuleSubscriptionLoader {...props} />);
-    expect(wrapper).toMatchSnapshot();
+  it("matches the latest snapshot", async () => {
+    const props = {
+      clearSubscriptionsSearch: jest.fn(),
+      searchSubscriptions: jest.fn(),
+    };
+    const rendered = render(<RuleSubscriptionLoader {...props} />);
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
   });
 
-  it("calls searchSubscriptions when component mounts, clearSubscriptionsSearch when component unmounts", () => {
+  it("calls searchSubscriptions when component mounts, clearSubscriptionsSearch when component unmounts", async () => {
     const searchSubscriptions = jest.fn();
     const clearSubscriptionsSearch = jest.fn();
 
@@ -26,11 +26,12 @@ describe("<RuleSubscriptionLoader />", () => {
       clearSubscriptionsSearch,
       ruleImplementation: { implementation_ref: 1 },
     };
-    const wrapper = mount(<RuleSubscriptionLoader {...props} />);
-    expect(clearSubscriptionsSearch.mock.calls.length).toBe(0);
-    expect(searchSubscriptions.mock.calls.length).toBe(1);
-    wrapper.unmount();
-    expect(clearSubscriptionsSearch.mock.calls.length).toBe(1);
-    expect(searchSubscriptions.mock.calls.length).toBe(1);
+    const rendered = render(<RuleSubscriptionLoader {...props} />);
+    await waitForLoad(rendered);
+    expect(clearSubscriptionsSearch).toHaveBeenCalledTimes(0);
+    expect(searchSubscriptions).toHaveBeenCalledTimes(1);
+    rendered.unmount();
+    expect(clearSubscriptionsSearch).toHaveBeenCalledTimes(1);
+    expect(searchSubscriptions).toHaveBeenCalledTimes(1);
   });
 });

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

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

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

@@ -1,8 +1,42 @@
-import React from "react";
-import { shallow } from "enzyme";
+import { render, waitForLoad } from "@truedat/test/render";
 import { Rules } from "../Rules";
 import { ruleColumnsSelector } from "../../selectors";
 
+jest.mock("../RuleSelectedFilters", () => ({
+  __esModule: true,
+  default: () => (
+    <div data-testid="mock-rule-selected-filters">
+      Mocked Rule Selected Filters
+    </div>
+  ),
+}));
+
+jest.mock("../RulesActions", () => ({
+  __esModule: true,
+  default: () => (
+    <div data-testid="mock-rules-actions">Mocked Rules Actions</div>
+  ),
+}));
+
+jest.mock("../RulesLabelResults", () => ({
+  __esModule: true,
+  default: () => (
+    <div data-testid="mock-rules-label-results">Mocked Rules Label Results</div>
+  ),
+}));
+
+jest.mock("../RulesPagination", () => ({
+  __esModule: true,
+  default: () => (
+    <div data-testid="mock-rules-pagination">Mocked Rules Pagination</div>
+  ),
+}));
+
+jest.mock("../RulesSearch", () => ({
+  __esModule: true,
+  default: () => <div data-testid="mock-rules-search">Mocked Rules Search</div>,
+}));
+
 describe("<Rules />", () => {
   const rules = [
     {
@@ -26,39 +60,39 @@ describe("<Rules />", () => {
   const rulesSort = [{ "name.raw": "desc" }];
   const sortRules = jest.fn();
 
-  it("matches the latest snapshot", () => {
+  it("matches the latest snapshot", async () => {
     const props = { rules, columns, rulesExecution: true };
-    const wrapper = shallow(<Rules {...props} />);
-    expect(wrapper).toMatchSnapshot();
+    const rendered = render(<Rules {...props} />);
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
   });
 
-  it("returns null if no columns", () => {
+  it("returns null if no columns", async () => {
     const props = { rules };
-    const wrapper = shallow(<Rules {...props} />);
-    expect(wrapper).toMatchSnapshot();
+    const rendered = render(<Rules {...props} />);
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
   });
 
-  it("sorts column in the direction set", () => {
+  it("sorts column in the direction set", async () => {
     const props = { rules, columns, rulesSort };
-    const wrapper = shallow(<Rules {...props} />);
-    expect(wrapper.find("TableHeaderCell").at(0).props().sorted).toEqual(
-      "descending"
-    );
+    const rendered = render(<Rules {...props} />);
+    await waitForLoad(rendered);
 
-    expect(wrapper.find("TableHeaderCell").at(1).props().sorted).toEqual(null);
+    const headerCells = rendered.container.querySelectorAll("th");
+    expect(headerCells[0].getAttribute("class")).toContain(
+      "three wide descending sorted"
+    );
+    expect(headerCells[1].getAttribute("class")).not.toContain("sorted");
   });
 
-  it("handles sort when column header is clicked", () => {
+  it("handles sort when column header is clicked", async () => {
     const props = { rules, columns, sortRules };
-    const wrapper = shallow(<Rules {...props} />);
-    wrapper.find("TableHeaderCell").at(0).simulate("click");
-    expect(wrapper.find("TableHeaderCell").at(0).props().sorted).toEqual(
-      "ascending"
-    );
+    const rendered = render(<Rules {...props} />);
+    await waitForLoad(rendered);
 
-    wrapper.find("TableHeaderCell").at(0).simulate("click");
-    expect(wrapper.find("TableHeaderCell").at(0).props().sorted).toEqual(
-      "descending"
-    );
+    const headerCells = rendered.container.querySelectorAll("th");
+    headerCells[0].click();
+    expect(sortRules).toHaveBeenCalled();
   });
 });

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

@@ -1,31 +1,35 @@
-import React from "react";
-import { shallow } from "enzyme";
+import { render, waitForLoad } from "@truedat/test/render";
 import { RulesActions } from "../RulesActions";
 
 describe("<RulesActions />", () => {
-  it("matches the latest snapshot", () => {
+  it("matches the latest snapshot", async () => {
     const props = { userRulesPermissions: {} };
-    const wrapper = shallow(<RulesActions {...props} />);
-    expect(wrapper).toMatchSnapshot();
+    const rendered = render(<RulesActions {...props} />);
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
   });
 
-  it("as user with permissions I can see the new rule button", () => {
+  it("as user with permissions I can see the new rule button", async () => {
     const props = {
       role: "admin",
       rulesExecution: true,
-      userRulesPermissions: { manage_quality_rules: true }
+      userRulesPermissions: { manage_quality_rules: true },
     };
-    const wrapper = shallow(<RulesActions {...props} />);
-    expect(wrapper.find("Button").length).toBe(1);
+    const rendered = render(<RulesActions {...props} />);
+    await waitForLoad(rendered);
+    expect(rendered.getByText(/quality.actions.create/i)).toBeInTheDocument();
   });
 
-  it("as user without permissions I can't see the new rule button", () => {
+  it("as user without permissions I can't see the new rule button", async () => {
     const props = {
       role: "admin",
       rulesExecution: true,
-      userRulesPermissions: { manage_quality_rules: false }
+      userRulesPermissions: { manage_quality_rules: false },
     };
-    const wrapper = shallow(<RulesActions {...props} />);
-    expect(wrapper.find("Button").length).toBe(0);
+    const rendered = render(<RulesActions {...props} />);
+    await waitForLoad(rendered);
+    expect(
+      rendered.queryByText(/quality.actions.create/i)
+    ).not.toBeInTheDocument();
   });
 });

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

@@ -1,19 +1,19 @@
-import React from "react";
-import { mount } from "enzyme";
+import { render, waitForLoad } from "@truedat/test/render";
 import { RulesLoader } from "../RulesLoader";
 
 describe("<RulesLoader />", () => {
   const payload = {};
 
-  it("calls fetchRules when component mounts, clearRules when component unmounts", () => {
+  it("calls fetchRules when component mounts, clearRules when component unmounts", async () => {
     const clearRules = jest.fn();
     const fetchRules = jest.fn();
     const props = { fetchRules, payload, clearRules };
-    const wrapper = mount(<RulesLoader {...props} />);
-    expect(clearRules.mock.calls.length).toBe(0);
-    expect(fetchRules.mock.calls.length).toBe(1);
-    wrapper.unmount();
-    expect(clearRules.mock.calls.length).toBe(1);
-    expect(fetchRules.mock.calls.length).toBe(1);
+    const rendered = render(<RulesLoader {...props} />);
+    await waitForLoad(rendered);
+    expect(clearRules).toHaveBeenCalledTimes(0);
+    expect(fetchRules).toHaveBeenCalledTimes(1);
+    rendered.unmount();
+    expect(clearRules).toHaveBeenCalledTimes(1);
+    expect(fetchRules).toHaveBeenCalledTimes(1);
   });
 });

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

@@ -0,0 +1,51 @@
+import React from "react";
+import { render, waitForLoad } from "@truedat/test/render";
+import RulesRoutes from "../RulesRoutes";
+import { useAuthorized } from "@truedat/core/hooks/useAuthorized";
+import { RULES } from "@truedat/core/routes";
+
+jest.mock("@truedat/core/hooks/useAuthorized", () => ({
+  useAuthorized: jest.fn(() => true),
+}));
+
+// Mock all child components
+jest.mock("../NewRule", () => () => <div>NewRule</div>);
+jest.mock("../RuleFiltersLoader", () => () => <div>RuleFiltersLoader</div>);
+jest.mock("../RuleRoutes", () => () => <div>RuleRoutes</div>);
+jest.mock("../Rules", () => () => <div>Rules</div>);
+jest.mock("../RulesLoader", () => () => <div>RulesLoader</div>);
+jest.mock("@truedat/dd/components/UserSearchFiltersLoader", () => () => (
+  <div>UserSearchFiltersLoader</div>
+));
+
+describe("<RulesRoutes />", () => {
+  it("renders correctly with default route", async () => {
+    const rendered = render(<RulesRoutes />);
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("renders correctly with rules route", async () => {
+    const rendered = render(<RulesRoutes />, {
+      routes: [RULES],
+    });
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("renders correctly with new rule route", async () => {
+    const rendered = render(<RulesRoutes />, {
+      routes: [`${RULES}/new`],
+    });
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("renders correctly with rule detail route", async () => {
+    const rendered = render(<RulesRoutes />, {
+      routes: [`${RULES}/123`],
+    });
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+});

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

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

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

@@ -1,12 +1,8 @@
-import React from "react";
-import { intl } from "@truedat/test/intl-stub";
-import { shallow } from "enzyme";
+import userEvent from "@testing-library/user-event";
+import { waitFor } from "@testing-library/react";
+import { render, waitForLoad } from "@truedat/test/render";
 import { Subscription, SubscriptionContent } from "../Subscription";
 
-// workaround for enzyme issue with React.useContext
-// see https://github.com/airbnb/enzyme/issues/2176#issuecomment-532361526
-jest.spyOn(React, "useContext").mockImplementation(() => intl);
-
 describe("<SubscriptionContent />", () => {
   const subscription = {
     id: 2,
@@ -25,25 +21,27 @@ describe("<SubscriptionContent />", () => {
   };
   const setSubscription = jest.fn();
 
-  it("matches the latest snapshot", () => {
+  it("matches the latest snapshot", async () => {
     const props = {
       subscription,
       setSubscription,
     };
-    const wrapper = shallow(<SubscriptionContent {...props} />);
-    expect(wrapper).toMatchSnapshot();
+    const rendered = render(<SubscriptionContent {...props} />);
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
   });
 
-  it("calls setSubscription on handleEventTypeChange", () => {
-    const e = { preventDefault: jest.fn() };
-    const name = "success";
+  it("calls setSubscription on event type change", async () => {
     const props = {
       subscription,
       setSubscription,
     };
-    const wrapper = shallow(<SubscriptionContent {...props} />);
-    wrapper.find("FormCheckbox").at(0).simulate("change", e, { name });
-    expect(setSubscription.mock.calls.length).toBe(1);
+    const rendered = render(<SubscriptionContent {...props} />);
+    await waitForLoad(rendered);
+
+    const user = userEvent.setup({ delay: null });
+    await user.click(rendered.getByText(/subscriptions.status.success/i));
+    expect(setSubscription).toHaveBeenCalled();
   });
 });
 
@@ -73,8 +71,9 @@ describe("<Subscription />", () => {
     subscriptionUpdating,
   };
 
-  it("matches the latest snapshot", () => {
-    const wrapper = shallow(<Subscription {...props} />);
-    expect(wrapper).toMatchSnapshot();
+  it("matches the latest snapshot", async () => {
+    const rendered = render(<Subscription {...props} />);
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
   });
 });

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

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

package/src/components/__tests__/__snapshots__/ConceptRules.spec.js.snap

@@ -37,6 +37,7 @@ exports[`<ConceptRules /> matches the latest snapshot 1`] = `
             class=""
           >
             <a
+              data-discover="true"
               href="/rules/1"
             >
               foo
@@ -55,6 +56,7 @@ exports[`<ConceptRules /> matches the latest snapshot 1`] = `
             class=""
           >
             <a
+              data-discover="true"
               href="/rules/2"
             >
               bar
@@ -73,6 +75,7 @@ exports[`<ConceptRules /> matches the latest snapshot 1`] = `
             class=""
           >
             <a
+              data-discover="true"
               href="/rules/3"
             >
               baz

package/src/components/__tests__/__snapshots__/ConditionSummary.spec.js.snap

@@ -54,6 +54,7 @@ exports[`<ConditionSummary /> matches the latest snapshot 1`] = `
             class="five wide"
           >
             <a
+              data-discover="true"
               href="/structures/2598"
             >
               <div