Merge pull request #1657 from Avaiga/test/StatusList

adding test cases to cover StatusList.tsx

frontend/taipy-gui/src/components/Taipy/StatusList.spec.tsx

@@ -12,60 +12,97 @@
  */
 
 import React from "react";
-import {render} from "@testing-library/react";
+import { render } from "@testing-library/react";
 import "@testing-library/jest-dom";
 import userEvent from "@testing-library/user-event";
 
 import { StatusType } from "./Status";
-import StatusList from './StatusList';
+import StatusList, { getStatusStrValue, getStatusIntValue } from "./StatusList";
 
 const statuses = [
-    {status: "info", message: "info"},
+    { status: "info", message: "info" },
     ["error", "error"],
-    {status: "warning", message: "warning"},
-    {status: "success", message: "success"},
+    { status: "warning", message: "warning" },
+    { status: "success", message: "success" },
 ] as Array<[string, string] | StatusType>;
 
 describe("StatusList Component", () => {
     it("renders", async () => {
-        const {getByText} = render(<StatusList value={statuses} />);
+        const { getByText } = render(<StatusList value={statuses} />);
         const elt = getByText("4 statuses");
         const av = getByText("E");
         expect(elt.tagName).toBe("SPAN");
         expect(av.tagName).toBe("DIV");
-    })
+    });
     it("uses the class", async () => {
-        const {getByText} = render(<StatusList value={statuses} className="taipy-status" />);
+        const { getByText } = render(<StatusList value={statuses} className="taipy-status" />);
         const elt = getByText("4 statuses");
         expect(elt.parentElement).toHaveClass("taipy-status");
-    })
+    });
     it("can be opened when more than 1 status", async () => {
-        const {getByTestId} = render(<StatusList value={statuses} />);
+        const { getByTestId } = render(<StatusList value={statuses} />);
         const elt = getByTestId("ArrowDownwardIcon");
-    })
+        expect(elt).toBeInTheDocument();
+    });
     it("cannot be opened when 1 status", async () => {
-        const {queryAllByRole} = render(<StatusList value={statuses[0]} />);
+        const { queryAllByRole } = render(<StatusList value={statuses[0]} />);
         expect(queryAllByRole("button")).toHaveLength(0);
-    })
+    });
     it("displays a default status", async () => {
-        const {getByText} = render(<StatusList value={[]}  />);
+        const { getByText } = render(<StatusList value={[]} />);
         getByText("No Status");
         getByText("I");
-    })
+    });
     it("opens on click", async () => {
-        const {getByTestId, getByText} = render(<StatusList value={statuses} />);
+        const { getByTestId, getByText } = render(<StatusList value={statuses} />);
         const elt = getByTestId("ArrowDownwardIcon");
         await userEvent.click(elt);
         const selt = getByText("info");
         expect(selt.parentElement?.parentElement?.childElementCount).toBe(4);
-    })
+    });
     it("hide closed statuses", async () => {
-        const {getByTestId, queryAllByTestId} = render(<StatusList value={statuses} />);
+        const { getByTestId, queryAllByTestId } = render(<StatusList value={statuses} />);
         const elt = getByTestId("ArrowDownwardIcon");
         await userEvent.click(elt);
         const icons = queryAllByTestId("CancelIcon");
         expect(icons).toHaveLength(4);
         await userEvent.click(icons[0]);
         expect(queryAllByTestId("CancelIcon")).toHaveLength(3);
-    })
+    });
+    it("should return 0 for unknown status", () => {
+        expect(getStatusIntValue("unknown")).toBe(0);
+        expect(getStatusIntValue("")).toBe(0);
+        expect(getStatusIntValue("a")).toBe(0);
+        expect(getStatusIntValue("z")).toBe(0);
+    });
+    it('should return "info" for status 1', () => {
+        expect(getStatusStrValue(1)).toBe("info");
+    });
+
+    it('should return "success" for status 2', () => {
+        expect(getStatusStrValue(2)).toBe("success");
+    });
+
+    it('should return "warning" for status 3', () => {
+        expect(getStatusStrValue(3)).toBe("warning");
+    });
+
+    it('should return "error" for status 4', () => {
+        expect(getStatusStrValue(4)).toBe("error");
+    });
+
+    it('should return "unknown" for any other status', () => {
+        expect(getStatusStrValue(0)).toBe("unknown");
+        expect(getStatusStrValue(5)).toBe("unknown");
+        expect(getStatusStrValue(-1)).toBe("unknown");
+    });
+    it("should handle invalid JSON in defaultValue", () => {
+        const invalidDefaultValue = "{invalidJson}";
+        const consoleSpy = jest.spyOn(console, "info").mockImplementation(() => {});
+        const { getByText } = render(<StatusList value={undefined!} defaultValue={invalidDefaultValue} />);
+        expect(consoleSpy).toHaveBeenCalledWith(expect.stringContaining("Cannot parse status value"));
+        const elt = getByText("No Status");
+        expect(elt).toBeInTheDocument();
+        consoleSpy.mockRestore();
+    });
 });

frontend/taipy-gui/src/components/Taipy/StatusList.tsx

@@ -22,7 +22,7 @@ import Status, { StatusType } from "./Status";
 import { TaipyBaseProps, TaipyHoverProps } from "./utils";
 import { useClassNames, useDynamicProperty } from "../../utils/hooks";
 
-const getStatusIntValue = (status: string) => {
+export const getStatusIntValue = (status: string) => {
     status = status.toLowerCase();
     if (status.startsWith("i")) {
         return 1;
@@ -36,7 +36,7 @@ const getStatusIntValue = (status: string) => {
     return 0;
 };
 
-const getStatusStrValue = (status: number) => {
+export const getStatusStrValue = (status: number) => {
     switch (status) {
         case 1:
             return "info";