@truedat/bg 7.2.0 → 7.2.2

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 />`;

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

@@ -0,0 +1,291 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<DomainCards /> matches the latest snapshot domain with subdomain 1`] = `
+<div>
+  <h4
+    class="ui header"
+  >
+    <div
+      class="content taxonomy-domains-domaincards-header-content"
+    >
+      <div>
+        <div
+          class="ui icon input"
+        >
+          <input
+            placeholder="Search domains..."
+            type="text"
+            value=""
+          />
+          <i
+            aria-hidden="true"
+            class="search icon"
+          />
+        </div>
+      </div>
+    </div>
+  </h4>
+  <div
+    class="ui cards"
+  >
+    <a
+      class="ui link card"
+      href="/domains/4"
+    >
+      <div
+        class="content"
+      >
+        <div
+          class="header"
+        >
+          <i
+            aria-hidden="true"
+            class="cube icon"
+          />
+          subdomain
+        </div>
+        <div
+          class="meta"
+        >
+          <i
+            aria-hidden="true"
+            class="object group icon"
+          />
+           
+          DomainGroup
+          <br />
+          <span>
+            Domain
+          </span>
+        </div>
+      </div>
+      <div
+        class="content"
+      />
+      <div
+        class="extra content"
+      >
+        <i
+          aria-hidden="true"
+          class="cubes icon"
+        />
+        Subdomains: 0
+      </div>
+    </a>
+  </div>
+</div>
+`;
+
+exports[`<DomainCards /> matches the latest snapshot domain without subdomain 1`] = `
+<div>
+  <h4
+    class="ui header"
+  >
+    <div
+      class="content taxonomy-domains-domaincards-header-content"
+    >
+      <div>
+        <div
+          class="ui icon input"
+        >
+          <input
+            placeholder="Search domains..."
+            type="text"
+            value=""
+          />
+          <i
+            aria-hidden="true"
+            class="search icon"
+          />
+        </div>
+      </div>
+    </div>
+  </h4>
+  <div
+    class="ui message"
+  >
+    <div
+      class="content"
+    >
+      <div
+        class="header"
+      >
+        No subdomains found
+      </div>
+    </div>
+  </div>
+  <div
+    class="ui cards"
+  />
+</div>
+`;
+
+exports[`<DomainCards /> matches the latest snapshot front page 1`] = `
+<div>
+  <h4
+    class="ui header"
+  >
+    <div
+      class="content taxonomy-domains-domaincards-header-content"
+    >
+      <div>
+        <div
+          class="ui icon input"
+        >
+          <input
+            placeholder="Search domains..."
+            type="text"
+            value=""
+          />
+          <i
+            aria-hidden="true"
+            class="search icon"
+          />
+        </div>
+      </div>
+    </div>
+  </h4>
+  <div
+    class="ui cards"
+  >
+    <a
+      class="ui link card"
+      href="/domains/1"
+    >
+      <div
+        class="content"
+      >
+        <div
+          class="header"
+        >
+          <i
+            aria-hidden="true"
+            class="cube icon"
+          />
+          rootNoSub
+        </div>
+        <div
+          class="meta"
+        >
+          <i
+            aria-hidden="true"
+            class="object group icon"
+          />
+           
+          DomainGroup
+          <br />
+          <span>
+            Domain
+          </span>
+        </div>
+      </div>
+      <div
+        class="content"
+      >
+        <div
+          class="description"
+        >
+          Root domain with no subdomains
+        </div>
+      </div>
+      <div
+        class="extra content"
+      >
+        <i
+          aria-hidden="true"
+          class="cubes icon"
+        />
+        Subdomains: 0
+      </div>
+    </a>
+    <a
+      class="ui link card"
+      href="/domains/3"
+    >
+      <div
+        class="content"
+      >
+        <div
+          class="header"
+        >
+          <i
+            aria-hidden="true"
+            class="cube icon"
+          />
+          rootOtherGroup
+        </div>
+        <div
+          class="meta"
+        >
+          <i
+            aria-hidden="true"
+            class="object group icon"
+          />
+           
+          OtherDomainGroup
+          <br />
+          <span>
+            Domain
+          </span>
+        </div>
+      </div>
+      <div
+        class="content"
+      />
+      <div
+        class="extra content"
+      >
+        <i
+          aria-hidden="true"
+          class="cubes icon"
+        />
+        Subdomains: 0
+      </div>
+    </a>
+    <a
+      class="ui link card"
+      href="/domains/2"
+    >
+      <div
+        class="content"
+      >
+        <div
+          class="header"
+        >
+          <i
+            aria-hidden="true"
+            class="cube icon"
+          />
+          rootWithSub
+        </div>
+        <div
+          class="meta"
+        >
+          <i
+            aria-hidden="true"
+            class="object group icon"
+          />
+           
+          DomainGroup
+          <br />
+          <span>
+            Domain
+          </span>
+        </div>
+      </div>
+      <div
+        class="content"
+      />
+      <div
+        class="extra content"
+      >
+        <i
+          aria-hidden="true"
+          class="cubes icon"
+        />
+        Subdomains: 1
+      </div>
+    </a>
+  </div>
+</div>
+`;