@truedat/df 8.7.0 → 8.7.1

package/src/components/widgets/__tests__/DynamicTableField.spec.js

@@ -5,253 +5,253 @@ import userEvent from "@testing-library/user-event";
 import DynamicTableField from "../DynamicTableField";
 
 jest.mock("../FieldByWidget", () => ({
-    __esModule: true,
-    default: ({ field, onChange }) => {
-        const testId = `cell-input-${field.name}`;
-        return (
-            <input
-                data-testid={testId}
-                defaultValue={field.value ?? ""}
-                onChange={(e) =>
-                    onChange(e, { name: field.name, value: e.target.value })
-                }
-            />
-        );
-    },
+  __esModule: true,
+  default: ({ field, onChange }) => {
+    const testId = `cell-input-${field.name}`;
+    return (
+      <input
+        data-testid={testId}
+        defaultValue={field.value ?? ""}
+        onChange={(e) =>
+          onChange(e, { name: field.name, value: e.target.value })
+        }
+      />
+    );
+  },
 }));
 
 const baseColumns = [
-    { name: "col1", widget: "text" },
-    { name: "col2", widget: "text" },
+  { name: "col1", widget: "text" },
+  { name: "col2", widget: "text" },
 ];
 
 describe("DynamicTableField", () => {
-    test("renders header cells (including required asterisk when cardinality is '+' or '1')", async () => {
-        const onChange = jest.fn();
-        const table_columns = [
-            { name: "col1", widget: "text", cardinality: "+" },
-            { name: "col2", widget: "text" },
-            { name: "col3", widget: "text", cardinality: "1" },
-        ];
-
-        const props = {
-            field: {
-                name: "tbl",
-                value: [
-                    {
-                        col1: { value: "a" },
-                        col2: { value: "b" },
-                        col3: { value: "c" },
-                    },
-                ],
-                values: { table_columns },
-            },
-            onChange,
-            scope: "test",
-        };
-
-        const rendered = render(<DynamicTableField {...props} />);
-        await waitForLoad(rendered);
-        expect(rendered.container).toMatchSnapshot();
-
-        table_columns.forEach((c) => {
-            expect(rendered.getByText(c.name)).toBeInTheDocument();
-        });
-
-        const requiredMarks = rendered.getAllByText("*");
-        expect(requiredMarks.length).toBe(2);
+  test("renders header cells (including required asterisk when cardinality is '+' or '1')", async () => {
+    const onChange = jest.fn();
+    const table_columns = [
+      { name: "col1", widget: "text", cardinality: "+" },
+      { name: "col2", widget: "text" },
+      { name: "col3", widget: "text", cardinality: "1" },
+    ];
+
+    const props = {
+      field: {
+        name: "tbl",
+        value: [
+          {
+            col1: { value: "a" },
+            col2: { value: "b" },
+            col3: { value: "c" },
+          },
+        ],
+        values: { table_columns },
+      },
+      onChange,
+      scope: "test",
+    };
+
+    const rendered = render(<DynamicTableField {...props} />);
+    await waitForLoad(rendered);
+    expect(rendered.container).toMatchSnapshot();
+
+    table_columns.forEach((c) => {
+      expect(rendered.getByText(c.name)).toBeInTheDocument();
     });
 
-    test("clicking add row calls onChange with a new empty row appended", async () => {
-        const user = userEvent.setup({ delay: null });
-        const onChange = jest.fn();
-
-        const initialValue = [
-            { col1: { value: "a" }, col2: { value: "1" } },
-            { col1: { value: "b" }, col2: { value: "2" } },
-        ];
-
-        const props = {
-            field: {
-                name: "tbl",
-                value: initialValue,
-                values: { table_columns: baseColumns },
-            },
-            onChange,
-            scope: "test",
-        };
-
-        const rendered = render(<DynamicTableField {...props} />);
-        await waitForLoad(rendered);
-        const addButton = rendered.getByTestId("add-button");
-        await user.click(addButton);
-
-        expect(onChange).toHaveBeenCalledTimes(1);
-        const [_e, payload] = onChange.mock.calls[0];
-        expect(payload.name).toBe("tbl");
-        expect(Array.isArray(payload.value)).toBe(true);
-        expect(payload.value).toHaveLength(initialValue.length + 1);
-
-        expect(payload.value[payload.value.length - 1]).toEqual({});
+    const requiredMarks = rendered.getAllByText("*");
+    expect(requiredMarks.length).toBe(2);
+  });
+
+  test("clicking add row calls onChange with a new empty row appended", async () => {
+    const user = userEvent.setup({ delay: null });
+    const onChange = jest.fn();
+
+    const initialValue = [
+      { col1: { value: "a" }, col2: { value: "1" } },
+      { col1: { value: "b" }, col2: { value: "2" } },
+    ];
+
+    const props = {
+      field: {
+        name: "tbl",
+        value: initialValue,
+        values: { table_columns: baseColumns },
+      },
+      onChange,
+      scope: "test",
+    };
+
+    const rendered = render(<DynamicTableField {...props} />);
+    await waitForLoad(rendered);
+    const addButton = rendered.getByTestId("add-button");
+    await user.click(addButton);
+
+    expect(onChange).toHaveBeenCalledTimes(1);
+    const [_e, payload] = onChange.mock.calls[0];
+    expect(payload.name).toBe("tbl");
+    expect(Array.isArray(payload.value)).toBe(true);
+    expect(payload.value).toHaveLength(initialValue.length + 1);
+
+    expect(payload.value[payload.value.length - 1]).toEqual({});
+  });
+
+  test("clicking the trash icon removes the corresponding row and calls onChange", async () => {
+    const onChange = jest.fn();
+
+    const initialValue = [
+      { col1: { value: "a" }, col2: { value: "1" } },
+      { col1: { value: "b" }, col2: { value: "2" } },
+      { col1: { value: "c" }, col2: { value: "3" } },
+    ];
+
+    const props = {
+      field: {
+        name: "tbl",
+        value: initialValue,
+        values: { table_columns: baseColumns },
+      },
+      onChange,
+      scope: "test",
+    };
+
+    const rendered = render(<DynamicTableField {...props} />);
+    await waitForLoad(rendered);
+
+    const firstRow = rendered.container.querySelector("tbody tr");
+    expect(firstRow).toBeTruthy();
+
+    const trashIcon = firstRow.querySelector(".selectable");
+    expect(trashIcon).toBeTruthy();
+
+    fireEvent.click(trashIcon);
+
+    expect(onChange).toHaveBeenCalledTimes(1);
+    const [, payload] = onChange.mock.calls[0];
+
+    expect(payload.name).toBe("tbl");
+    expect(payload.value).toHaveLength(2);
+
+    expect(payload.value[0]).toEqual(initialValue[1]);
+    expect(payload.value[1]).toEqual(initialValue[2]);
+  });
+
+  test("editing a cell calls onChange with updated structure { origin: 'user', value }", async () => {
+    const user = userEvent.setup({ delay: null });
+    const onChange = jest.fn();
+
+    const initialValue = [
+      { col1: { value: "old-a" }, col2: { value: "1" } },
+      { col1: { value: "old-b" }, col2: { value: "2" } },
+    ];
+
+    const props = {
+      field: {
+        name: "tbl",
+        value: initialValue,
+        values: { table_columns: baseColumns },
+      },
+      onChange,
+      scope: "test",
+    };
+
+    const rendered = render(<DynamicTableField {...props} />);
+    await waitForLoad(rendered);
+
+    const input = rendered.getAllByTestId("cell-input-col1")[0];
+    await user.clear(input);
+    await user.type(input, "new-a");
+
+    // Last call should have the updated row 0 col1 shape
+    expect(onChange).toHaveBeenCalled();
+    const [, payload] = onChange.mock.calls[onChange.mock.calls.length - 1];
+
+    expect(payload.name).toBe("tbl");
+    expect(payload.value).toHaveLength(2);
+
+    expect(payload.value[0].col1).toEqual({
+      origin: "user",
+      value: "new-a",
     });
 
-    test("clicking the trash icon removes the corresponding row and calls onChange", async () => {
-        const onChange = jest.fn();
-
-        const initialValue = [
-            { col1: { value: "a" }, col2: { value: "1" } },
-            { col1: { value: "b" }, col2: { value: "2" } },
-            { col1: { value: "c" }, col2: { value: "3" } },
-        ];
-
-        const props = {
-            field: {
-                name: "tbl",
-                value: initialValue,
-                values: { table_columns: baseColumns },
-            },
-            onChange,
-            scope: "test",
-        };
-
-        const rendered = render(<DynamicTableField {...props} />);
-        await waitForLoad(rendered);
-
-        const firstRow = rendered.container.querySelector("tbody tr");
-        expect(firstRow).toBeTruthy();
-
-        const trashIcon = firstRow.querySelector(".selectable");
-        expect(trashIcon).toBeTruthy();
-
-        fireEvent.click(trashIcon);
-
-        expect(onChange).toHaveBeenCalledTimes(1);
-        const [, payload] = onChange.mock.calls[0];
-
-        expect(payload.name).toBe("tbl");
-        expect(payload.value).toHaveLength(2);
-
-        expect(payload.value[0]).toEqual(initialValue[1]);
-        expect(payload.value[1]).toEqual(initialValue[2]);
-    });
-
-    test("editing a cell calls onChange with updated structure { origin: 'user', value }", async () => {
-        const user = userEvent.setup({ delay: null });
-        const onChange = jest.fn();
-
-        const initialValue = [
-            { col1: { value: "old-a" }, col2: { value: "1" } },
-            { col1: { value: "old-b" }, col2: { value: "2" } },
-        ];
-
-        const props = {
-            field: {
-                name: "tbl",
-                value: initialValue,
-                values: { table_columns: baseColumns },
-            },
-            onChange,
-            scope: "test",
-        };
-
-        const rendered = render(<DynamicTableField {...props} />);
-        await waitForLoad(rendered);
-
-        const input = rendered.getAllByTestId("cell-input-col1")[0];
-        await user.clear(input);
-        await user.type(input, "new-a");
-
-        // Last call should have the updated row 0 col1 shape
-        expect(onChange).toHaveBeenCalled();
-        const [, payload] = onChange.mock.calls[onChange.mock.calls.length - 1];
-
-        expect(payload.name).toBe("tbl");
-        expect(payload.value).toHaveLength(2);
-
-        expect(payload.value[0].col1).toEqual({
-            origin: "user",
-            value: "new-a",
-        });
-
-        expect(payload.value[0].col2).toEqual({ value: "1" });
-        expect(payload.value[1]).toEqual(initialValue[1]);
+    expect(payload.value[0].col2).toEqual({ value: "1" });
+    expect(payload.value[1]).toEqual(initialValue[1]);
+  });
+
+  test("removeDeletedColumns strips keys not present in table_columns before emitting onChange", async () => {
+    const user = userEvent.setup({ delay: null });
+    const onChange = jest.fn();
+
+    const columns = [
+      { name: "col1", widget: "text" },
+      { name: "col2", widget: "text" },
+      // Note: no 'ghost' column
+    ];
+
+    const initialValue = [
+      // Row contains an extra 'ghost' key that should be stripped on change
+      { col1: { value: "x" }, col2: { value: "y" }, ghost: { value: "zzz" } },
+    ];
+
+    const props = {
+      field: {
+        name: "tbl",
+        value: initialValue,
+        values: { table_columns: columns },
+      },
+      onChange,
+      scope: "test",
+    };
+
+    const rendered = render(<DynamicTableField {...props} />);
+    await waitForLoad(rendered);
+
+    // Trigger a change on col2; this will call handleChange → removeDeletedColumns
+    const input = rendered.getByTestId("cell-input-col2");
+    await user.clear(input);
+    await user.type(input, "updated");
+
+    expect(onChange).toHaveBeenCalled();
+    const [, payload] = onChange.mock.calls[onChange.mock.calls.length - 1];
+
+    // 'ghost' should be omitted from the emitted row
+    expect(payload.value[0]).toEqual({
+      col1: { value: "x" },
+      col2: { origin: "user", value: "updated" },
     });
-
-    test("removeDeletedColumns strips keys not present in table_columns before emitting onChange", async () => {
-        const user = userEvent.setup({ delay: null });
-        const onChange = jest.fn();
-
-        const columns = [
-            { name: "col1", widget: "text" },
-            { name: "col2", widget: "text" },
-            // Note: no 'ghost' column
-        ];
-
-        const initialValue = [
-            // Row contains an extra 'ghost' key that should be stripped on change
-            { col1: { value: "x" }, col2: { value: "y" }, ghost: { value: "zzz" } },
-        ];
-
-        const props = {
-            field: {
-                name: "tbl",
-                value: initialValue,
-                values: { table_columns: columns },
-            },
-            onChange,
-            scope: "test",
-        };
-
-        const rendered = render(<DynamicTableField {...props} />);
-        await waitForLoad(rendered);
-
-        // Trigger a change on col2; this will call handleChange → removeDeletedColumns
-        const input = rendered.getByTestId("cell-input-col2");
-        await user.clear(input);
-        await user.type(input, "updated");
-
-        expect(onChange).toHaveBeenCalled();
-        const [, payload] = onChange.mock.calls[onChange.mock.calls.length - 1];
-
-        // 'ghost' should be omitted from the emitted row
-        expect(payload.value[0]).toEqual({
-            col1: { value: "x" },
-            col2: { origin: "user", value: "updated" },
-        });
-        expect(payload.value[0].ghost).toBeUndefined();
-    });
-
-    test("delete button exists per row and add button exists in footer", async () => {
-        const onChange = jest.fn();
-
-        const initialValue = [
-            { col1: { value: "a" }, col2: { value: "1" } },
-            { col1: { value: "b" }, col2: { value: "2" } },
-        ];
-
-        const props = {
-            field: {
-                name: "tbl",
-                value: initialValue,
-                values: { table_columns: baseColumns },
-            },
-            onChange,
-            scope: "test",
-        };
-
-        const rendered = render(<DynamicTableField {...props} />);
-        await waitForLoad(rendered);
-
-        // Footer add button
-        expect(rendered.getByTestId("add-button")).toBeInTheDocument();
-
-        // Each row should render a Button containing the trash Icon
-        const rows = rendered.container.querySelectorAll("tbody tr");
-        expect(rows.length).toBe(2);
-
-        rows.forEach((row) => {
-            const trashIcon = row.querySelector(".selectable");
-            expect(trashIcon).toBeTruthy();
-        });
+    expect(payload.value[0].ghost).toBeUndefined();
+  });
+
+  test("delete button exists per row and add button exists in footer", async () => {
+    const onChange = jest.fn();
+
+    const initialValue = [
+      { col1: { value: "a" }, col2: { value: "1" } },
+      { col1: { value: "b" }, col2: { value: "2" } },
+    ];
+
+    const props = {
+      field: {
+        name: "tbl",
+        value: initialValue,
+        values: { table_columns: baseColumns },
+      },
+      onChange,
+      scope: "test",
+    };
+
+    const rendered = render(<DynamicTableField {...props} />);
+    await waitForLoad(rendered);
+
+    // Footer add button
+    expect(rendered.getByTestId("add-button")).toBeInTheDocument();
+
+    // Each row should render a Button containing the trash Icon
+    const rows = rendered.container.querySelectorAll("tbody tr");
+    expect(rows.length).toBe(2);
+
+    rows.forEach((row) => {
+      const trashIcon = row.querySelector(".selectable");
+      expect(trashIcon).toBeTruthy();
     });
+  });
 });

package/src/components/widgets/__tests__/GroupPreview.spec.js

@@ -20,38 +20,38 @@ describe("<GroupPreview />", () => {
 
   it("renders group values with a group icon", () => {
     const rendered = render(
-      <GroupPreview groups={[{ id: 123, name: "foo bar" }]} />
+      <GroupPreview groups={[{ id: 123, name: "foo bar" }]} />,
     );
 
     expect(rendered.container.textContent).toBe("foo bar");
     expect(rendered.container.querySelector(".group.icon")).toBeInTheDocument();
     expect(rendered.getByRole("link", { name: /foo bar/i })).toHaveAttribute(
       "href",
-      "/groups/123"
+      "/groups/123",
     );
   });
 
   it("strips the legacy group: prefix when rendering names", () => {
     const rendered = render(
-      <GroupPreview groups={[{ id: 123, name: "group:foo bar" }]} />
+      <GroupPreview groups={[{ id: 123, name: "group:foo bar" }]} />,
     );
 
     expect(rendered.container.textContent).toBe("foo bar");
     expect(rendered.container.querySelector(".group.icon")).toBeInTheDocument();
     expect(rendered.getByRole("link", { name: /foo bar/i })).toHaveAttribute(
       "href",
-      "/groups/123"
+      "/groups/123",
     );
   });
 
   it("does not render user values", () => {
     const rendered = render(
-      <GroupPreview groups={["user:baz qux", { id: 123, name: "foo bar" }]} />
+      <GroupPreview groups={["user:baz qux", { id: 123, name: "foo bar" }]} />,
     );
 
     expect(rendered.container.textContent).toBe("foo bar");
     expect(
-      rendered.container.querySelector(".user.icon")
+      rendered.container.querySelector(".user.icon"),
     ).not.toBeInTheDocument();
     expect(rendered.container.querySelector(".group.icon")).toBeInTheDocument();
   });
@@ -62,7 +62,7 @@ describe("<GroupPreview />", () => {
     expect(rendered.container.textContent).toBe("lone foo bar");
     expect(rendered.container.querySelector(".group.icon")).toBeInTheDocument();
     expect(
-      rendered.queryByRole("link", { name: /lone foo bar/i })
+      rendered.queryByRole("link", { name: /lone foo bar/i }),
     ).not.toBeInTheDocument();
   });
 
@@ -72,7 +72,7 @@ describe("<GroupPreview />", () => {
     expect(rendered.container.textContent).toBe("foo bar");
     expect(rendered.container.querySelector(".group.icon")).toBeInTheDocument();
     expect(
-      rendered.queryByRole("link", { name: /foo bar/i })
+      rendered.queryByRole("link", { name: /foo bar/i }),
     ).not.toBeInTheDocument();
   });
 
@@ -122,7 +122,7 @@ describe("<GroupPreview />", () => {
     });
     expect(rendered.getByRole("link", { name: /foo bar/i })).toHaveAttribute(
       "href",
-      "/groups/123"
+      "/groups/123",
     );
   });
 
@@ -142,7 +142,7 @@ describe("<GroupPreview />", () => {
     });
     expect(rendered.getByRole("link", { name: /foo bar/i })).toHaveAttribute(
       "href",
-      "/groups/123"
+      "/groups/123",
     );
   });
 
@@ -163,7 +163,7 @@ describe("<GroupPreview />", () => {
 
     expect(rendered.getByRole("link", { name: /foo bar/i })).toHaveAttribute(
       "href",
-      "/groups/123"
+      "/groups/123",
     );
     expect(rendered.container.querySelector(".group.icon")).toBeInTheDocument();
   });

package/src/components/widgets/__tests__/HierarchyDropdown.spec.js

@@ -27,7 +27,7 @@ describe("<HierarchyDropdown />", () => {
       onChange: jest.fn(),
     };
     const { container } = render(
-      <HierarchyDropdown {...missingMinDepthProps} />
+      <HierarchyDropdown {...missingMinDepthProps} />,
     );
     expect(container).toMatchSnapshot();
   });
@@ -43,7 +43,7 @@ describe("<HierarchyDropdown />", () => {
       onChange: jest.fn(),
     };
     const { container } = render(
-      <HierarchyDropdown {...missingMinDepthProps} />
+      <HierarchyDropdown {...missingMinDepthProps} />,
     );
     expect(container).toMatchSnapshot();
   });
@@ -59,7 +59,7 @@ describe("<HierarchyDropdown />", () => {
       onChange: jest.fn(),
     };
     const { container } = render(
-      <HierarchyDropdown {...missingMinDepthProps} />
+      <HierarchyDropdown {...missingMinDepthProps} />,
     );
     expect(container).toMatchSnapshot();
   });

package/src/components/widgets/__tests__/NumberField.spec.js

@@ -23,7 +23,7 @@ describe("<NumberField />", () => {
 
     // Find the number input and simulate a change
     const numberInput = rendered.container.querySelector(
-      'input[type="number"]'
+      'input[type="number"]',
     );
     userEvent.clear(numberInput);
     userEvent.type(numberInput, "42");

package/src/components/widgets/__tests__/PairListField.spec.js

@@ -64,12 +64,12 @@ describe("<PairListField />", () => {
           ...props,
           field,
         }}
-      />
+      />,
     );
     await waitForLoad(rendered);
 
     const inputs = rendered.container.querySelectorAll(
-      'input[name="url_name"]'
+      'input[name="url_name"]',
     );
     const secondInput = inputs[1];
     await user.type(secondInput, "1");
@@ -113,7 +113,7 @@ describe("<PairListField />", () => {
           ...props,
           field,
         }}
-      />
+      />,
     );
     await waitForLoad(rendered);
     const deleteButtons = rendered.container.querySelectorAll(".minus.icon");

package/src/components/widgets/__tests__/StandardDropdown.spec.js

@@ -61,7 +61,7 @@ describe("<StandardDropdown />", () => {
     };
 
     const withoutValueRendered = render(
-      <StandardDropdown {...withoutValueProps} />
+      <StandardDropdown {...withoutValueProps} />,
     );
     await waitForLoad(withoutValueRendered);
   });