Add ts-node as a dev dependency and improve Header component tests

Author: PelayoFelgueroso

package-lock.json

@@ -23,6 +23,7 @@
     "lint-staged": "^15.2.7",
     "prettier": "^3.2.5",
     "storybook-addon-pseudo-states": "^9.1.10",
+    "ts-node": "^10.9.2",
     "turbo": "^2.0.4",
     "typescript": "^5.6.3"
   },

package.json

@@ -31,57 +31,42 @@ describe("Header component tests", () => {
     expect(getByAltText("DXC Logo")).toBeTruthy();
   });
 
-  describe("HamburguerButton component", () => {
-    test("hamburger button triggers onClick when clicked", () => {
-      mockMatchMedia.mockImplementation(() => ({
-        matches: true,
-        addEventListener: jest.fn(),
-        removeEventListener: jest.fn(),
-      }));
+  test("hamburger button triggers onClick when clicked", () => {
+    mockMatchMedia.mockImplementation(() => ({
+      matches: true,
+      addEventListener: jest.fn(),
+      removeEventListener: jest.fn(),
+    }));
 
-      const navItems: Item[] = [{ label: "Home", onSelect: jest.fn() }];
-      render(<DxcHeader logo={defaultHeaderBranding} navItems={navItems} />);
+    const navItems: Item[] = [{ label: "Home", onSelect: jest.fn() }];
+    render(<DxcHeader logo={defaultHeaderBranding} navItems={navItems} />);
 
-      const menuButton = screen.getByRole("button", { name: /toggle menu/i });
-      fireEvent.click(menuButton);
-      expect(screen.getByText("Home")).toBeInTheDocument();
-    });
+    const menuButton = screen.getByRole("button", { name: /toggle menu/i });
+    fireEvent.click(menuButton);
+    expect(screen.getByText("Home")).toBeInTheDocument();
   });
 
-  describe("sanitizeNavItems function coverage", () => {
-    test("handles nested group items beyond LEVEL_LIMIT (should be ignored)", () => {
-      const deepNestedItems: (Item | GroupItem)[] = [
-        {
-          label: "Services",
-          items: [
-            { label: "Web Design", onSelect: jest.fn() },
-            {
-              label: "Development", // This nested group should be ignored due to LEVEL_LIMIT = 1
-              items: [
-                { label: "Frontend", onSelect: jest.fn() },
-                { label: "Backend", onSelect: jest.fn() },
-              ],
-            },
-          ],
-        },
-      ];
+  test("handles nested group items beyond LEVEL_LIMIT (should be ignored)", () => {
+    const deepNestedItems: (Item | GroupItem)[] = [
+      {
+        label: "Services",
+        items: [
+          { label: "Web Design", onSelect: jest.fn() },
+          {
+            label: "Development", // This nested group should be ignored due to LEVEL_LIMIT = 1
+            items: [
+              { label: "Frontend", onSelect: jest.fn() },
+              { label: "Backend", onSelect: jest.fn() },
+            ],
+          },
+        ],
+      },
+    ];
 
-      render(<DxcHeader logo={defaultHeaderBranding} navItems={deepNestedItems} />);
-      expect(screen.getByAltText("DXC Logo")).toBeInTheDocument();
-    });
-
-    test("handles mixed simple items and group items", () => {
-      const mixedItems: (Item | GroupItem)[] = [
-        { label: "Home", onSelect: jest.fn() },
-        {
-          label: "Services",
-          items: [{ label: "Web Design", onSelect: jest.fn() }],
-        },
-        { label: "Contact", onSelect: jest.fn() },
-      ];
-
-      render(<DxcHeader logo={defaultHeaderBranding} navItems={mixedItems} />);
-      expect(screen.getByAltText("DXC Logo")).toBeInTheDocument();
-    });
+    render(<DxcHeader logo={defaultHeaderBranding} navItems={deepNestedItems} />);
+    expect(screen.getByText("Services")).toBeInTheDocument();
+    expect(screen.queryByText("Development")).not.toBeInTheDocument();
+    expect(screen.queryByText("Frontend")).not.toBeInTheDocument();
+    expect(screen.queryByText("Backend")).not.toBeInTheDocument();
   });
 });