diff --git a/src/components/helpers/jsonforms/components/DataBox.test.tsx b/src/components/helpers/jsonforms/components/DataBox.test.tsx index b3873fd6..8fc53f08 100644 --- a/src/components/helpers/jsonforms/components/DataBox.test.tsx +++ b/src/components/helpers/jsonforms/components/DataBox.test.tsx @@ -1,6 +1,6 @@ import { render, screen } from "@testing-library/react"; -import { DataBox } from "./DataBox"; +import {DataBox, DataOrEmpty} from "./DataBox"; const props = { label: "A Label", @@ -15,17 +15,44 @@ describe("DataBox", () => { expect(screen.getByText(props.data)).toBeInTheDocument(); expect(container.querySelector("dd span.empty")).not.toBeInTheDocument(); }); - + + test("Should render data if zero and label", () => { + const data = "0" + const { container } = render(); + + expect(screen.getByText(props.label)).toBeInTheDocument(); + expect(screen.getByText(data)).toBeInTheDocument(); + expect(container.querySelector("dd span.empty")).not.toBeInTheDocument(); + }); + + test("Should render data if zero number and label", () => { + const data = 0 + const { container } = render(); + + expect(screen.getByText(props.label)).toBeInTheDocument(); + expect(screen.getByText(data)).toBeInTheDocument(); + expect(container.querySelector("dd span.empty")).not.toBeInTheDocument(); + }); + + test("Should render data if zero number and label", () => { + const data = 0.0 + const { container } = render(); + + expect(screen.getByText(props.label)).toBeInTheDocument(); + expect(screen.getByText(data)).toBeInTheDocument(); + expect(container.querySelector("dd span.empty")).not.toBeInTheDocument(); + }); + test("Should render '-' with empty data", () => { const { container } = render(); expect(screen.getByText(props.label)).toBeInTheDocument(); expect(container.querySelector("dd span.empty")).toBeInTheDocument(); }); - - test("Should render '-' with null data", () => { - const { container } = render(); - + + test("Should render '-' with whitespace data", () => { + const { container } = render(); + expect(screen.getByText(props.label)).toBeInTheDocument(); expect(container.querySelector("dd span.empty")).toBeInTheDocument(); }); diff --git a/src/components/helpers/jsonforms/components/DataBox.tsx b/src/components/helpers/jsonforms/components/DataBox.tsx index a9b2bb8f..f8e6ff20 100644 --- a/src/components/helpers/jsonforms/components/DataBox.tsx +++ b/src/components/helpers/jsonforms/components/DataBox.tsx @@ -2,11 +2,11 @@ import { Box, Stack, Typography } from "@mui/material"; interface DataBoxProps { label: string; - data?: string | null; + data?: string | number | null; } -export const DataOrEmpty = ({ data }: { data?: string | null }) => - data ? ( +export const DataOrEmpty = ({ data }: { data?: string | number | null }) => + (data !== undefined && data !== null && (typeof data !== "string" || data.trim() !== "")) ? ( data ) : ( { - test("Should render data and label", () => { - const { container } = render(); - expect(screen.getByText(props.data)).toBeInTheDocument(); + test("Should render data string", () => { + const data = "Data 1234" + const { container } = render(); + expect(screen.getByText(data)).toBeInTheDocument(); expect(container.querySelector("span.empty")).not.toBeInTheDocument(); }); - + + test("Should render data with 0", () => { + const data = "0" + const { container } = render(); + expect(screen.getByText(data)).toBeInTheDocument(); + expect(container.querySelector("span.empty")).not.toBeInTheDocument(); + }); + + test("Should render data with 0 number", () => { + const data = 0 + const { container } = render(); + expect(screen.getByText(data)).toBeInTheDocument(); + expect(container.querySelector("span.empty")).not.toBeInTheDocument(); + }); + + test("Should render data with 0.0 number", () => { + const data = 0.0 + const { container } = render(); + expect(screen.getByText(data)).toBeInTheDocument(); + expect(container.querySelector("span.empty")).not.toBeInTheDocument(); + }); + test("Should render '-' with empty data", () => { const { container } = render(); expect(container.querySelector("span.empty")).toBeInTheDocument(); }); - + + test("Should render '-' with whitespace data", () => { + const { container } = render(); + expect(container.querySelector("span.empty")).toBeInTheDocument(); + }); + test("Should render '-' with null data", () => { const { container } = render(); expect(container.querySelector("span.empty")).toBeInTheDocument(); diff --git a/src/components/helpers/jsonforms/components/DataCell.tsx b/src/components/helpers/jsonforms/components/DataCell.tsx index 66939dc4..53fbd315 100644 --- a/src/components/helpers/jsonforms/components/DataCell.tsx +++ b/src/components/helpers/jsonforms/components/DataCell.tsx @@ -2,7 +2,7 @@ import { Box, Typography } from "@mui/material"; import { DataOrEmpty } from "./DataBox"; interface DataCellProps { - data?: string | null; + data?: string | number | null; } const DataCell = ({ data }: DataCellProps) => (