@truedat/bg 7.2.1 → 7.2.3

package/src/taxonomy/components/__tests__/DomainCards.spec.js

@@ -0,0 +1,148 @@
+import _ from "lodash/fp";
+import React from "react";
+import { render } from "@truedat/test/render";
+import { fireEvent } from "@testing-library/react";
+import { DomainCards } from "../DomainCards";
+
+describe("<DomainCards />", () => {
+  const renderOpts = {
+    messages: {
+      en: {
+        "domain.children.empty": "No subdomains found",
+        "domain.props.children": "Subdomains: {count}",
+        "domains.actions.create": "New Domain",
+        "domains.search.placeholder": "Search domains...",
+        "domains.search.results.count": "Results: {count}",
+        domain: "Domain",
+      },
+    },
+  };
+  const domains = [
+    {
+      id: 1,
+      name: "rootNoSub",
+      type: null,
+      description: "Root domain with no subdomains",
+      parents: [
+        {
+          id: 1,
+          name: "rootNoSub",
+          external_id: "rootNoSub",
+        },
+      ],
+      domain_group: {
+        id: 1,
+        name: "DomainGroup",
+      },
+      parent_id: null,
+      external_id: "rootNoSub",
+    },
+    {
+      id: 2,
+      name: "rootWithSub",
+      type: null,
+      description: null,
+      parents: [
+        {
+          id: 2,
+          name: "rootWithSub",
+          external_id: "rootWithSub",
+        },
+      ],
+      domain_group: {
+        id: 1,
+        name: "DomainGroup",
+      },
+      parent_id: null,
+      external_id: "rootWithSub",
+    },
+    {
+      id: 3,
+      name: "rootOtherGroup",
+      type: null,
+      description: null,
+      parents: [
+        {
+          id: 3,
+          name: "rootOtherGroup",
+          external_id: "rootOtherGroup",
+        },
+      ],
+      domain_group: {
+        id: 2,
+        name: "OtherDomainGroup",
+      },
+      parent_id: null,
+      external_id: "rootOtherGroup",
+    },
+    {
+      id: 4,
+      name: "subdomain",
+      type: null,
+      description: null,
+      parents: [
+        {
+          id: 3,
+          name: "subdomain",
+          external_id: "subdomain",
+        },
+        {
+          id: 2,
+          name: "rootWithSub",
+          external_id: "rootWithSub",
+        },
+      ],
+      domain_group: {
+        id: 1,
+        name: "DomainGroup",
+      },
+      parent_id: 2,
+      external_id: "subdomain",
+    },
+  ];
+  it("matches the latest snapshot front page", () => {
+    const props = { domains };
+    const { container } = render(<DomainCards {...props} />, renderOpts);
+    expect(container).toMatchSnapshot();
+  });
+
+  it("matches the latest snapshot domain without subdomain", () => {
+    const domain = _.find(["id", 1])(domains);
+    const props = { domains, domain };
+    const { container } = render(<DomainCards {...props} />, renderOpts);
+    expect(container).toMatchSnapshot();
+  });
+
+  it("matches the latest snapshot domain with subdomain", () => {
+    const domain = _.find(["id", 2])(domains);
+    const props = { domains, domain };
+    const { container } = render(<DomainCards {...props} />, renderOpts);
+    expect(container).toMatchSnapshot();
+  });
+
+  it("filters domains based on search input", () => {
+    const props = { domains };
+    const { getByPlaceholderText, getByText } = render(
+      <DomainCards {...props} />,
+      renderOpts
+    );
+
+    const searchInput = getByPlaceholderText("Search domains...");
+    fireEvent.change(searchInput, { target: { value: "other" } });
+
+    expect(getByText("rootOtherGroup")).toBeInTheDocument();
+  });
+
+  it("displays 'No subdomains found' message when no subdomains are present", () => {
+    const domain = _.find(["id", 1])(domains);
+    const props = { domains, domain };
+    const { getByText } = render(<DomainCards {...props} />, renderOpts);
+    expect(getByText("No subdomains found")).toBeInTheDocument();
+  });
+
+  it("renders DomainsActions component when no domain is selected", () => {
+    const props = { domains, actions: { create: { href: "" } } };
+    const { getByText } = render(<DomainCards {...props} />, renderOpts);
+    expect(getByText("New Domain")).toBeInTheDocument();
+  });
+});

package/src/taxonomy/components/__tests__/DomainContent.spec.js

@@ -0,0 +1,168 @@
+import _ from "lodash/fp";
+import React from "react";
+import { render } from "@truedat/test/render";
+import { MemoryRouter } from "react-router-dom";
+import DomainContent from "../DomainContent";
+
+jest.mock("../../../hooks/useDomains", () => ({
+  ...jest.requireActual("../../../hooks/useDomains"),
+  useDomain: jest.fn((domainId) => ({
+    data: {
+      description: "DOMAIN DESCRIPTION",
+      domain_group: null,
+      external_id: "EXTERNAL ID",
+      id: domainId,
+      name: "DOMAIN NAME",
+      parent_id: 6,
+      parents: null,
+      type: null,
+    },
+  })),
+}));
+
+describe("<DomainContent />", () => {
+  const domains = [
+    {
+      id: 1,
+      name: "rootNoSub",
+      type: null,
+      description: "Root domain with no subdomains",
+      parents: [
+        {
+          id: 1,
+          name: "rootNoSub",
+          external_id: "rootNoSub",
+        },
+      ],
+      domain_group: {
+        id: 1,
+        name: "DomainGroup",
+      },
+      parent_id: null,
+      external_id: "rootNoSub",
+    },
+    {
+      id: 2,
+      name: "rootWithSub",
+      type: null,
+      description: null,
+      parents: [
+        {
+          id: 2,
+          name: "rootWithSub",
+          external_id: "rootWithSub",
+        },
+      ],
+      domain_group: {
+        id: 1,
+        name: "DomainGroup",
+      },
+      parent_id: null,
+      external_id: "rootWithSub",
+    },
+    {
+      id: 3,
+      name: "rootOtherGroup",
+      type: null,
+      description: null,
+      parents: [
+        {
+          id: 3,
+          name: "rootOtherGroup",
+          external_id: "rootOtherGroup",
+        },
+      ],
+      domain_group: {
+        id: 2,
+        name: "OtherDomainGroup",
+      },
+      parent_id: null,
+      external_id: "rootOtherGroup",
+    },
+    {
+      id: 4,
+      name: "childSubdomain",
+      type: null,
+      description: null,
+      parents: [
+        {
+          id: 3,
+          name: "childSubdomain",
+          external_id: "subdomain",
+        },
+        {
+          id: 2,
+          name: "rootWithSub",
+          external_id: "rootWithSub",
+        },
+      ],
+      domain_group: {
+        id: 1,
+        name: "DomainGroup",
+      },
+      parent_id: 2,
+      external_id: "subdomain",
+    },
+  ];
+
+  const taxonomyConfig = {
+    priorityTabs: [],
+    hiddenTabs: [],
+  };
+
+  const testList = [
+    {
+      content: "subdomains",
+      domainId: 1,
+      textToSearch: "This domain has no subdomains",
+    },
+    {
+      content: "subdomains",
+      domainId: 2,
+      textToSearch: "childSubdomain",
+    },
+    {
+      content: "concepts",
+      domainId: 1,
+      textToSearch: "Searching...",
+    },
+    {
+      content: "structures",
+      domainId: 1,
+      textToSearch: "You are not authorized to view this content",
+    },
+    {
+      content: "implementations",
+      domainId: 1,
+      textToSearch: "You are not authorized to view this content",
+    },
+    {
+      content: "members",
+      domainId: 1,
+      textToSearch: "This domain has no members",
+    },
+  ];
+  const renderOpts = {
+    mocks: [],
+    fallback: "lazy",
+  };
+
+  test.each(testList)(
+    "Render %s content for %s domain with text %s",
+    ({ content, domainId, textToSearch }) => {
+      const domain = _.find(["id", domainId])(domains);
+      const { container, getByText } = render(
+        <MemoryRouter initialEntries={[`/domains/${domainId}/${content}`]}>
+          <DomainContent
+            domain={domain}
+            domains={domains}
+            taxonomyConfig={taxonomyConfig}
+          />
+        </MemoryRouter>,
+        renderOpts
+      );
+      expect(container).toMatchSnapshot();
+      expect(getByText(textToSearch)).toBeInTheDocument();
+    }
+  );
+});

package/src/taxonomy/components/__tests__/DomainTabs.spec.js

@@ -0,0 +1,108 @@
+import React from "react";
+import { render } from "@truedat/test/render";
+import { useAuthorized } from "@truedat/core/hooks";
+import DomainTabs from "../DomainTabs";
+
+jest.mock("@truedat/core/hooks", () => ({
+  useAuthorized: jest.fn(() => true),
+}));
+
+describe("<DomainTabs />", () => {
+  const domain = {
+    id: 1,
+    name: "Test Domain",
+  };
+
+  const taxonomyConfig = {
+    priorityTabs: [],
+    hiddenTabs: [],
+  };
+
+  const renderOpts = {
+    messages: {
+      en: {
+        "tabs.subdomains": "Subdomains",
+        "tabs.concepts": "Concepts",
+        "tabs.structures": "Structures",
+        "tabs.implementations": "Implementations",
+        "tabs.members": "Members",
+      },
+    },
+  };
+
+  it("matches the latest snapshot", () => {
+    const { container } = render(
+      <DomainTabs domain={domain} taxonomyConfig={taxonomyConfig} />,
+      renderOpts
+    );
+    expect(container).toMatchSnapshot();
+  });
+
+  it("renders all tabs", () => {
+    const { getByText } = render(
+      <DomainTabs domain={domain} taxonomyConfig={taxonomyConfig} />,
+      renderOpts
+    );
+
+    expect(getByText("Subdomains")).toBeInTheDocument();
+    expect(getByText("Concepts")).toBeInTheDocument();
+    expect(getByText("Structures")).toBeInTheDocument();
+    expect(getByText("Implementations")).toBeInTheDocument();
+    expect(getByText("Members")).toBeInTheDocument();
+  });
+
+  it("hides tabs based on hiddenTabs config", () => {
+    const hiddenTabsConfig = {
+      ...taxonomyConfig,
+      hiddenTabs: ["structures", "implementations"],
+    };
+
+    const { queryByText } = render(
+      <DomainTabs domain={domain} taxonomyConfig={hiddenTabsConfig} />,
+      renderOpts
+    );
+
+    expect(queryByText("Structures")).not.toBeInTheDocument();
+    expect(queryByText("Implementations")).not.toBeInTheDocument();
+  });
+
+  it("prioritizes tabs based on priorityTabs config", () => {
+    const priorityTabsConfig = {
+      ...taxonomyConfig,
+      priorityTabs: ["implementations", "concepts"],
+    };
+
+    const { container } = render(
+      <DomainTabs domain={domain} taxonomyConfig={priorityTabsConfig} />,
+      renderOpts
+    );
+
+    const tabs = container.querySelectorAll(".item");
+    expect(tabs[0].textContent).toBe("Implementations");
+    expect(tabs[1].textContent).toBe("Concepts");
+  });
+
+  it("hides 'implementations' tab if dqAuthorized is false", () => {
+    useAuthorized.mockImplementation(
+      (permission) => permission == "data_dictionary"
+    );
+
+    const { queryByText } = render(
+      <DomainTabs domain={domain} taxonomyConfig={taxonomyConfig} />,
+      renderOpts
+    );
+
+    expect(queryByText("Implementations")).not.toBeInTheDocument();
+  });
+
+  it("hides 'structures' tab if ddAuthorized is false", () => {
+    useAuthorized.mockImplementation((permission) => permission == "quality");
+
+    const { queryByText } = render(
+      <DomainTabs domain={domain} taxonomyConfig={taxonomyConfig} />,
+      renderOpts
+    );
+
+    expect(queryByText("Structures")).not.toBeInTheDocument();
+  });
+});

package/src/taxonomy/components/__tests__/Domains.spec.js

@@ -1,7 +1,14 @@
 import React from "react";
+import { waitFor } from "@testing-library/react";
+import { DOMAINS_QUERY } from "@truedat/core/api/queries";
+import userEvent from "@testing-library/user-event";
+import { useParams, useHistory } from "react-router-dom";
 import { render } from "@truedat/test/render";
+import { useDomains } from "../../../hooks/useDomains";
 import Domains from "../Domains";
 
+jest.mock("../../assets/searching.png", () => "mocked-searching.png");
+
 jest.mock("react-router-dom", () => ({
   ...jest.requireActual("react-router-dom"),
   useHistory: jest.fn(),
@@ -103,9 +110,149 @@ jest.mock("../../../hooks/useDomains", () => ({
   })),
 }));
 
+const domains = [
+  {
+    id: 10,
+    name: "other_domain",
+    parentId: null,
+    externalId: "10",
+    actions: [],
+  },
+];
+
+const variables = {
+  action: "viewDomain",
+};
+
+const domainsMock = {
+  request: { query: DOMAINS_QUERY, variables },
+  result: { data: { domains: domains } },
+};
+
+const renderOpts = {
+  mocks: [domainsMock, domainsMock],
+  fallback: "lazy",
+};
+
 describe("<Domains />", () => {
-  it("matches the latest snapshot", () => {
-    const { container } = render(<Domains />);
+  it("matches the latest snapshot", async () => {
+    const { container, queryByText } = render(<Domains />, renderOpts);
+
+    await waitFor(() => expect(queryByText(/lazy/i)).not.toBeInTheDocument());
+    await waitFor(() =>
+      expect(queryByText(/loading/i)).not.toBeInTheDocument()
+    );
     expect(container).toMatchSnapshot();
   });
+
+  it("renders the correct number of domain elements", async () => {
+    const { getAllByText, queryByText } = render(<Domains />, renderOpts);
+
+    await waitFor(() => expect(queryByText(/lazy/i)).not.toBeInTheDocument());
+    await waitFor(() =>
+      expect(queryByText(/loading/i)).not.toBeInTheDocument()
+    );
+    const domainElements = getAllByText(/element_/);
+    expect(domainElements.length).toBe(2);
+  });
+
+  it("renders domain elements with correct names", async () => {
+    const { getByText, queryByText } = render(<Domains />, renderOpts);
+    await waitFor(() => expect(queryByText(/lazy/i)).not.toBeInTheDocument());
+    await waitFor(() =>
+      expect(queryByText(/loading/i)).not.toBeInTheDocument()
+    );
+
+    expect(getByText("element_2")).toBeInTheDocument();
+    expect(getByText("element_3")).toBeInTheDocument();
+
+    expect(queryByText("element_1")).not.toBeInTheDocument();
+    expect(queryByText("element_4")).not.toBeInTheDocument();
+    expect(queryByText("element_5")).not.toBeInTheDocument();
+    expect(queryByText("element_6")).not.toBeInTheDocument();
+  });
+
+  it("redirects to domains list if domainId is invalid", async () => {
+    const mockHistoryPush = jest.fn();
+    useHistory.mockImplementationOnce(() => ({ push: mockHistoryPush }));
+    useParams.mockImplementationOnce(() => ({ id: 999 }));
+
+    render(<Domains />, renderOpts);
+
+    await waitFor(() => {
+      expect(mockHistoryPush).toHaveBeenCalledWith("/domains");
+    });
+  });
+
+  it("renders EmptyImage when no domains available", async () => {
+    useParams.mockImplementationOnce(() => ({ id: undefined }));
+    useDomains.mockImplementationOnce(() => ({
+      data: [],
+      actions: {},
+      loading: false,
+    }));
+    const mockHistoryPush = jest.fn();
+    useHistory.mockImplementationOnce(() => ({ push: mockHistoryPush }));
+
+    const { queryByText } = render(<Domains />, renderOpts);
+
+    await waitFor(() => {
+      expect(
+        queryByText(
+          "Please, select a domain on the left pane to see the detail."
+        )
+      ).toBeInTheDocument();
+    });
+  });
+
+  it("handles grid control buttons correctly", async () => {
+    const { container, queryByText, queryByTestId } = render(
+      <Domains />,
+      renderOpts
+    );
+
+    await waitFor(() => expect(queryByText(/lazy/i)).not.toBeInTheDocument());
+    await waitFor(() =>
+      expect(queryByText(/loading/i)).not.toBeInTheDocument()
+    );
+
+    await waitFor(() => {
+      expect(
+        container.querySelector(".taxonomy-domains-breadcrumb")
+      ).toBeInTheDocument();
+    });
+
+    const hideButton = container.querySelector(
+      "button[data-tooltip='Hide Domains List']"
+    );
+
+    const minimizeButton = container.querySelector(
+      "button[data-tooltip='domains.list.minimize']"
+    );
+
+    const maximizeButton = container.querySelector(
+      "button[data-tooltip='domains.list.maximize']"
+    );
+
+    userEvent.click(hideButton);
+    await waitFor(() => {
+      expect(
+        container.querySelector(".taxonomy-domains-grid-animation")
+      ).toBeNull();
+    });
+
+    userEvent.click(minimizeButton);
+    await waitFor(() => {
+      expect(
+        container.querySelector(".taxonomy-domains-grid-animation")
+      ).toBeNull();
+    });
+
+    userEvent.click(maximizeButton);
+    await waitFor(() => {
+      expect(
+        container.querySelector(".taxonomy-domains-grid-animation")
+      ).toBeInTheDocument();
+    });
+  });
 });

package/src/taxonomy/components/__tests__/DomainsActions.spec.js

@@ -1,15 +1,22 @@
 import React from "react";
-import { shallow } from "enzyme";
-import { intl } from "@truedat/test/intl-stub";
+import { render } from "@truedat/test/render";
 import { DomainsActions } from "../DomainsActions";
 
-// workaround for enzyme issue with React.useContext
-// see https://github.com/airbnb/enzyme/issues/2176#issuecomment-532361526
-jest.spyOn(React, "useContext").mockImplementation(() => intl);
-
 describe("<DomainsActions />", () => {
   it("matches the latest snapshot", () => {
-    const wrapper = shallow(<DomainsActions />);
-    expect(wrapper).toMatchSnapshot();
+    const actions = {
+      create: { href: "/api/domains", input: {}, method: "POST" },
+      index: { href: "/api/domains", input: {}, method: "GET" },
+    };
+    const { container, getByText } = render(
+      <DomainsActions actions={actions} />
+    );
+    expect(container).toMatchSnapshot();
+    expect(getByText("New Domain")).toBeInTheDocument();
+  });
+
+  it("Do not show the button if not have actions", () => {
+    const { queryByText } = render(<DomainsActions />);
+    expect(queryByText("New Domain")).not.toBeInTheDocument();
   });
 });

package/src/taxonomy/components/__tests__/__snapshots__/Domain.spec.js.snap

@@ -50,6 +50,12 @@ exports[`<Domain /> matches the latest snapshot 1`] = `
     <div
       class="ui pointing secondary top attached tabular menu"
     >
+      <a
+        class="item"
+        href="/domains/3"
+      >
+        Subdomains
+      </a>
       <a
         class="item"
         href="/domains/3/concepts"
@@ -81,3 +87,5 @@ exports[`<Domain /> matches the latest snapshot 1`] = `
   </div>
 </div>
 `;
+
+exports[`<Domain /> renders null when no has any domain 1`] = `<div />`;