@truedat/qx 7.5.7 → 7.5.10

package/src/components/scores/__tests__/ScoreGroup.spec.js

@@ -1,11 +1,10 @@
-import React from "react";
-import { render } from "@truedat/test/render";
-import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
+import { render, waitForLoad } from "@truedat/test/render";
+import { templateByNameMock } from "@truedat/test/mocks";
 import { useScoreGroupShow } from "@truedat/qx/hooks/useScoreGroups";
 import ScoreGroup from "../ScoreGroup";
 
-jest.mock("react-router-dom", () => ({
-  ...jest.requireActual("react-router-dom"),
+jest.mock("react-router", () => ({
+  ...jest.requireActual("react-router"),
   useParams: () => ({ id: "8", version: "1" }),
 }));
 
@@ -22,22 +21,24 @@ jest.mock("@truedat/qx/hooks/useScoreGroups", () => {
   };
 });
 
-const renderOpts = { messages, fallback: "lazy" };
+const renderOpts = {
+  mocks: [templateByNameMock({ name: "Quality Execution" })],
+};
 
 describe("<ScoreGroup />", () => {
-  it("matches the latest snapshot", () => {
-    const { container } = render(<ScoreGroup />, renderOpts);
-
-    expect(container).toMatchSnapshot();
+  it("matches the latest snapshot", async () => {
+    const rendered = render(<ScoreGroup />, renderOpts);
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
   });
 
-  it("matches the latest snapshot when scoreGroup is empty", () => {
+  it("matches the latest snapshot when scoreGroup is empty", async () => {
     useScoreGroupShow.mockImplementation(() => ({
       data: { data: [] },
       loading: false,
     }));
-    const { container } = render(<ScoreGroup />, renderOpts);
-
-    expect(container).toMatchSnapshot();
+    const rendered = render(<ScoreGroup />, renderOpts);
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
   });
 });

package/src/components/scores/__tests__/ScoreGroupBreadcrumbs.spec.js

@@ -1,4 +1,3 @@
-import React from "react";
 import { render } from "@truedat/test/render";
 import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
 import ScoreGroupBreadcrumbs from "../ScoreGroupBreadcrumbs";

package/src/components/scores/__tests__/ScoreGroupForm.spec.js

@@ -1,9 +1,7 @@
-import React from "react";
-import { render } from "@truedat/test/render";
-import { waitFor } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
+import { waitFor } from "@testing-library/react";
+import { render, waitForLoad } from "@truedat/test/render";
 import { singleTemplateMock } from "@truedat/test/mocks";
-import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
 import ScoreGroupForm from "../ScoreGroupForm";
 
 const renderOpts = {
@@ -13,8 +11,6 @@ const renderOpts = {
       domainIds: undefined,
     }),
   ],
-  messages,
-  fallback: "lazy",
 };
 
 const props = {
@@ -22,46 +18,34 @@ const props = {
   onSubmit: jest.fn(),
   onCancel: jest.fn(),
 };
+
 describe("<ScoreGroupForm />", () => {
   it("matches the latest snapshot", async () => {
-    const { container, queryByText } = render(
-      <ScoreGroupForm {...props} />,
-      renderOpts
-    );
-
-    await waitFor(() => {
-      expect(queryByText(/lazy/i)).not.toBeInTheDocument();
-      expect(container.querySelector(".loading")).not.toBeInTheDocument();
-    });
-
-    expect(container).toMatchSnapshot();
+    const rendered = render(<ScoreGroupForm {...props} />, renderOpts);
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
   });
+
   it("matches the latest snapshot for count 1", async () => {
-    const { container, queryByText } = render(
+    const rendered = render(
       <ScoreGroupForm {...props} count={1} />,
       renderOpts
     );
-
-    await waitFor(() => {
-      expect(queryByText(/lazy/i)).not.toBeInTheDocument();
-      expect(container.querySelector(".loading")).not.toBeInTheDocument();
-    });
-
-    expect(container).toMatchSnapshot();
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
   });
 
   it("writes to form, submit and confirm", async () => {
+    const user = userEvent.setup({ delay: null });
     const onSubmit = jest.fn();
-    const { container, queryByText, findByText, findByPlaceholderText } =
-      render(<ScoreGroupForm {...props} onSubmit={onSubmit} />, renderOpts);
-
-    await waitFor(() => {
-      expect(queryByText(/lazy/i)).not.toBeInTheDocument();
-      expect(container.querySelector(".loading")).not.toBeInTheDocument();
-    });
+    const rendered = render(
+      <ScoreGroupForm {...props} onSubmit={onSubmit} />,
+      renderOpts
+    );
+    await waitForLoad(rendered);
 
-    userEvent.type(await findByPlaceholderText("field1"), "foo");
-    userEvent.click(await findByText(/Create/i));
+    await user.type(await rendered.findByPlaceholderText(/field1/i), "foo");
+    await user.click(await rendered.findByText(/create/i));
 
     await waitFor(() =>
       expect(onSubmit).toHaveBeenCalledWith({

package/src/components/scores/__tests__/ScoreGroupLink.spec.js

@@ -1,4 +1,3 @@
-import React from "react";
 import { render } from "@truedat/test/render";
 import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
 import ScoreGroupLink from "../ScoreGroupLink";

package/src/components/scores/__tests__/ScoreGroupMessage.spec.js

@@ -1,4 +1,3 @@
-import React from "react";
 import { render } from "@truedat/test/render";
 import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
 import ScoreGroupMessage from "../ScoreGroupMessage";

package/src/components/scores/__tests__/ScoreGroupPopup.spec.js

@@ -1,4 +1,3 @@
-import React from "react";
 import { render } from "@truedat/test/render";
 import { waitFor } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
@@ -9,7 +8,6 @@ import ScoreGroupPopup from "../ScoreGroupPopup";
 const renderOpts = {
   mocks: [singleTemplateMock({ scope: "qxe" })],
   messages,
-  fallback: "lazy",
 };
 
 describe("<ScoreGroupPopup />", () => {

package/src/components/scores/__tests__/ScoreGroupsRoutes.spec.js

@@ -0,0 +1,32 @@
+import React from "react";
+import { render, waitForLoad } from "@truedat/test/render";
+import ScoreGroupsRoutes from "../ScoreGroupsRoutes";
+import { MY_SCORE_GROUPS, SCORE_GROUP } from "@truedat/core/routes";
+
+// Mock child components
+jest.mock("../MyScoreGroups", () => () => <div>MyScoreGroups</div>);
+jest.mock("../ScoreGroup", () => () => <div>ScoreGroup</div>);
+
+describe("<ScoreGroupsRoutes />", () => {
+  it("renders correctly with default route", async () => {
+    const rendered = render(<ScoreGroupsRoutes />);
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("renders correctly with my score groups route", async () => {
+    const rendered = render(<ScoreGroupsRoutes />, {
+      routes: [MY_SCORE_GROUPS],
+    });
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+
+  it("renders correctly with score group detail route", async () => {
+    const rendered = render(<ScoreGroupsRoutes />, {
+      routes: [SCORE_GROUP.replace(":id", "123")],
+    });
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+  });
+});

package/src/components/scores/__tests__/ScoreGroupsTable.spec.js

@@ -1,4 +1,3 @@
-import React from "react";
 import { render } from "@truedat/test/render";
 import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
 import SearchContextWrapper from "@truedat/core/components/common/SearchContextWrapper";

package/src/components/scores/__tests__/ScoreStatusDecorator.spec.js

@@ -1,4 +1,3 @@
-import React from "react";
 import { render } from "@truedat/test/render";
 import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
 

package/src/components/scores/__tests__/ScoreTabs.spec.js

@@ -1,10 +1,9 @@
-import React from "react";
 import { render } from "@truedat/test/render";
 import { messages } from "@truedat/qx/components/__tests__/__fixtures__/helper";
 import ScoreTabs from "../ScoreTabs";
 
-jest.mock("react-router-dom", () => ({
-  ...jest.requireActual("react-router-dom"),
+jest.mock("react-router", () => ({
+  ...jest.requireActual("react-router"),
   useParams: () => ({ id: "15" }),
   useLocation: () => ({ pathname: "/scores/15" }),
 }));
@@ -18,7 +17,7 @@ describe("<ScoreTabs />", () => {
   });
 
   it("matches the latest snapshot for events", () => {
-    jest.spyOn(require("react-router-dom"), "useLocation").mockReturnValue({
+    jest.spyOn(require("react-router"), "useLocation").mockReturnValue({
       pathname: "/scores/15/events",
     });
     const { container } = render(<ScoreTabs />, renderOpts);

package/src/components/scores/__tests__/__snapshots__/MyScoreGroups.spec.js.snap

@@ -134,6 +134,7 @@ exports[`<MyScoreGroups /> matches the latest snapshot 1`] = `
             class=""
           >
             <a
+              data-discover="true"
               href="/scoreGroups/36"
             >
               <time
@@ -181,6 +182,7 @@ exports[`<MyScoreGroups /> matches the latest snapshot 1`] = `
             class=""
           >
             <a
+              data-discover="true"
               href="/scoreGroups/36"
             >
               <time

package/src/components/scores/__tests__/__snapshots__/Score.spec.js.snap

@@ -7,6 +7,7 @@ exports[`<Score /> matches the latest snapshot 1`] = `
   >
     <a
       class="section"
+      data-discover="true"
       href="/qualityControls"
     >
       Quality Controls
@@ -17,6 +18,7 @@ exports[`<Score /> matches the latest snapshot 1`] = `
     />
     <a
       class="section"
+      data-discover="true"
       href="/qualityControls/8/version/1/scores"
     >
       test
@@ -74,12 +76,14 @@ exports[`<Score /> matches the latest snapshot 1`] = `
     >
       <a
         class="item"
+        data-discover="true"
         href="/scores/8"
       >
         Details
       </a>
       <a
         class="item"
+        data-discover="true"
         href="/scores/8/events"
       >
         Events

package/src/components/scores/__tests__/__snapshots__/ScoreCrumbs.spec.js.snap

@@ -7,6 +7,7 @@ exports[`<ScoreCrumbs /> matches the latest snapshot 1`] = `
   >
     <a
       class="section"
+      data-discover="true"
       href="/qualityControls"
     >
       Quality Controls
@@ -17,6 +18,7 @@ exports[`<ScoreCrumbs /> matches the latest snapshot 1`] = `
     />
     <a
       class="section"
+      data-discover="true"
       href="/qualityControls/8/version/1/scores"
     >
       test

package/src/components/scores/__tests__/__snapshots__/ScoreDetails.spec.js.snap

@@ -35,6 +35,7 @@ exports[`<ScoreDetails /> matches the latest snapshot 1`] = `
           class="description"
         >
           <a
+            data-discover="true"
             href="/scores/15"
           >
             <time

package/src/components/scores/__tests__/__snapshots__/ScoreGroup.spec.js.snap

@@ -4,13 +4,13 @@ exports[`<ScoreGroup /> matches the latest snapshot 1`] = `
 <div>
   <div
     class="ui breadcrumb"
-    style="display: none;"
   >
     <a
       class="section"
+      data-discover="true"
       href="/myScoreGroups"
     >
-      My Executions
+      sidemenu.executions
     </a>
     <i
       aria-hidden="true"
@@ -28,7 +28,6 @@ exports[`<ScoreGroup /> matches the latest snapshot 1`] = `
   </div>
   <div
     class="ui message"
-    style="display: none;"
   >
     <div
       class="content"
@@ -36,16 +35,45 @@ exports[`<ScoreGroup /> matches the latest snapshot 1`] = `
       <div
         class="header"
       >
-        Scores scheduled
+        scores.pending.header
       </div>
       <p>
-        There are 1 scores pending, please check again later
+        scores.pending.content
       </p>
     </div>
   </div>
+  <div
+    class="ui horizontal divider"
+  >
+    <h3>
+      g1
+    </h3>
+  </div>
+  <div
+    class="ui big very relaxed list"
+    role="list"
+  >
+    <div
+      class="item"
+      role="listitem"
+    >
+      <div
+        class="header dynamic-field-header"
+      >
+        field1
+      </div>
+      <div
+        class="description"
+      >
+        <i
+          aria-hidden="true"
+          class="grey minus icon"
+        />
+      </div>
+    </div>
+  </div>
   <table
     class="ui table"
-    style="display: none;"
   >
     <thead
       class=""
@@ -56,12 +84,12 @@ exports[`<ScoreGroup /> matches the latest snapshot 1`] = `
         <th
           class=""
         >
-          Status
+          score.props.status
         </th>
         <th
           class=""
         >
-          Name
+          quality_control.props.name
         </th>
       </tr>
     </thead>
@@ -75,19 +103,21 @@ exports[`<ScoreGroup /> matches the latest snapshot 1`] = `
           class=""
         >
           <a
+            data-discover="true"
             href="/scores/15"
           >
             <i
               aria-hidden="true"
               class="grey info circle large icon"
             />
-            Pending
+            score.status.PENDING
           </a>
         </td>
         <td
           class=""
         >
           <a
+            data-discover="true"
             href="/qualityControls/8/version/1"
           >
             test
@@ -96,7 +126,6 @@ exports[`<ScoreGroup /> matches the latest snapshot 1`] = `
       </tr>
     </tbody>
   </table>
-  lazy
 </div>
 `;
 

package/src/components/scores/__tests__/__snapshots__/ScoreGroupBreadcrumbs.spec.js.snap

@@ -7,6 +7,7 @@ exports[`<ScoreGroupBreadcrumbs /> matches the latest snapshot 1`] = `
   >
     <a
       class="section"
+      data-discover="true"
       href="/myScoreGroups"
     >
       My Executions

package/src/components/scores/__tests__/__snapshots__/ScoreGroupForm.spec.js.snap

@@ -6,7 +6,7 @@ exports[`<ScoreGroupForm /> matches the latest snapshot 1`] = `
     class="ui header"
     style=""
   >
-    Quality controls execution
+    quality_controls.actions.execution.confirmation.header
   </h2>
   <form
     class="ui form"
@@ -15,7 +15,7 @@ exports[`<ScoreGroupForm /> matches the latest snapshot 1`] = `
     <h3
       class="ui header"
     >
-      Template fields
+      quality_controls.actions.execution.confirmation.legend
     </h3>
     <div
       style="max-height: calc(100vh - 20rem); overflow-y: auto;"
@@ -53,7 +53,7 @@ exports[`<ScoreGroupForm /> matches the latest snapshot 1`] = `
       </div>
     </div>
     <p>
-      10 quality controls will be executed. Are you sure?
+      quality_controls.actions.execution.confirmation.content
     </p>
     <div
       class="actions"
@@ -61,12 +61,12 @@ exports[`<ScoreGroupForm /> matches the latest snapshot 1`] = `
       <button
         class="ui secondary button"
       >
-        Cancel
+        actions.cancel
       </button>
       <button
         class="ui primary button"
       >
-        Create
+        actions.create
       </button>
     </div>
   </form>
@@ -78,7 +78,7 @@ exports[`<ScoreGroupForm /> matches the latest snapshot for count 1 1`] = `
   <h2
     class="ui header"
   >
-    Quality controls execution
+    quality_controls.actions.execution.confirmation.header
   </h2>
   <form
     class="ui form"
@@ -86,7 +86,7 @@ exports[`<ScoreGroupForm /> matches the latest snapshot for count 1 1`] = `
     <h3
       class="ui header"
     >
-      Template fields
+      quality_controls.actions.execution.confirmation.legend
     </h3>
     <div
       style="max-height: calc(100vh - 20rem); overflow-y: auto;"
@@ -124,7 +124,7 @@ exports[`<ScoreGroupForm /> matches the latest snapshot for count 1 1`] = `
       </div>
     </div>
     <p>
-      This quality control will be executed. Are you sure?
+      quality_control.actions.execution.confirmation.content
     </p>
     <div
       class="actions"
@@ -132,12 +132,12 @@ exports[`<ScoreGroupForm /> matches the latest snapshot for count 1 1`] = `
       <button
         class="ui secondary button"
       >
-        Cancel
+        actions.cancel
       </button>
       <button
         class="ui primary button"
       >
-        Create
+        actions.create
       </button>
     </div>
   </form>

package/src/components/scores/__tests__/__snapshots__/ScoreGroupLink.spec.js.snap

@@ -3,6 +3,7 @@
 exports[`<ScoreGroupLink /> matches the latest snapshot 1`] = `
 <div>
   <a
+    data-discover="true"
     href="/scoreGroups/8"
   >
     <time

package/src/components/scores/__tests__/__snapshots__/ScoreGroupsRoutes.spec.js.snap

@@ -0,0 +1,19 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`<ScoreGroupsRoutes /> renders correctly with default route 1`] = `
+<div>
+  <div>
+    MyScoreGroups
+  </div>
+</div>
+`;
+
+exports[`<ScoreGroupsRoutes /> renders correctly with my score groups route 1`] = `
+<div>
+  <div>
+    ScoreGroup
+  </div>
+</div>
+`;
+
+exports[`<ScoreGroupsRoutes /> renders correctly with score group detail route 1`] = `<div />`;

package/src/components/scores/__tests__/__snapshots__/ScoreGroupsTable.spec.js.snap

@@ -58,6 +58,7 @@ exports[`<ScoreGroupsTable /> matches the latest snapshot 1`] = `
           class=""
         >
           <a
+            data-discover="true"
             href="/scoreGroups/36"
           >
             <time
@@ -105,6 +106,7 @@ exports[`<ScoreGroupsTable /> matches the latest snapshot 1`] = `
           class=""
         >
           <a
+            data-discover="true"
             href="/scoreGroups/36"
           >
             <time

package/src/components/scores/__tests__/__snapshots__/ScoreStatusDecorator.spec.js.snap

@@ -3,6 +3,7 @@
 exports[`<ScoreStatusDecorator /> matches the latest snapshot for status FAILED 1`] = `
 <div>
   <a
+    data-discover="true"
     href="/scores/8"
   >
     <i
@@ -17,6 +18,7 @@ exports[`<ScoreStatusDecorator /> matches the latest snapshot for status FAILED
 exports[`<ScoreStatusDecorator /> matches the latest snapshot for status PENDING 1`] = `
 <div>
   <a
+    data-discover="true"
     href="/scores/8"
   >
     <i
@@ -31,6 +33,7 @@ exports[`<ScoreStatusDecorator /> matches the latest snapshot for status PENDING
 exports[`<ScoreStatusDecorator /> matches the latest snapshot for status QUEUED 1`] = `
 <div>
   <a
+    data-discover="true"
     href="/scores/8"
   >
     <i
@@ -45,6 +48,7 @@ exports[`<ScoreStatusDecorator /> matches the latest snapshot for status QUEUED
 exports[`<ScoreStatusDecorator /> matches the latest snapshot for status STARTED 1`] = `
 <div>
   <a
+    data-discover="true"
     href="/scores/8"
   >
     <i
@@ -59,6 +63,7 @@ exports[`<ScoreStatusDecorator /> matches the latest snapshot for status STARTED
 exports[`<ScoreStatusDecorator /> matches the latest snapshot for status SUCCEEDED 1`] = `
 <div>
   <a
+    data-discover="true"
     href="/scores/8"
   >
     <i

package/src/components/scores/__tests__/__snapshots__/ScoreTabs.spec.js.snap

@@ -7,12 +7,14 @@ exports[`<ScoreTabs /> matches the latest snapshot for details 1`] = `
   >
     <a
       class="active item"
+      data-discover="true"
       href="/scores/15"
     >
       Details
     </a>
     <a
       class="item"
+      data-discover="true"
       href="/scores/15/events"
     >
       Events
@@ -28,12 +30,14 @@ exports[`<ScoreTabs /> matches the latest snapshot for events 1`] = `
   >
     <a
       class="item"
+      data-discover="true"
       href="/scores/15"
     >
       Details
     </a>
     <a
       class="active item"
+      data-discover="true"
       href="/scores/15/events"
     >
       Events

package/src/hooks/__tests__/useDataViews.spec.js

@@ -1,5 +1,5 @@
 import useSWR from "swr";
-import { renderHook } from "@testing-library/react-hooks";
+import { renderHook } from "@testing-library/react";
 import { apiJson } from "@truedat/core/services/api";
 import { API_DATA_VIEWS } from "../../api";
 import { useDataViews } from "../useDataViews";