Merge pull request #2320 from dxc-technology/PelayoFelgueroso/quickNav-testing

Add test to new QuickNav functionality

Author: Mil4n0r

packages/lib/src/quick-nav/QuickNav.test.tsx

@@ -1,4 +1,4 @@
-import { render } from "@testing-library/react";
+import { render, fireEvent } from "@testing-library/react";
 import DxcQuickNav from "./QuickNav";
 
 const links = [
@@ -29,4 +29,52 @@ describe("QuickNav component tests", () => {
     expect(getByText("Spacing")).toBeTruthy();
     expect(getByText("Button")).toBeTruthy();
   });
+
+  test("should call scrollIntoView when clicking on a link in hash router mode", () => {
+    // Mock window.location.href to simulate hash router
+    Object.defineProperty(window, "location", {
+      value: {
+        href: "http://localhost:3000/#/components",
+      },
+      writable: true,
+    });
+
+    // Mock document.getElementById and scrollIntoView
+    const mockScrollIntoView = jest.fn();
+    const mockElement = { scrollIntoView: mockScrollIntoView };
+    const mockGetElementById = jest.fn().mockReturnValue(mockElement);
+    document.getElementById = mockGetElementById;
+
+    const { getByText } = render(<DxcQuickNav links={links} />);
+    const overviewLink = getByText("Overview");
+
+    fireEvent.click(overviewLink);
+
+    expect(mockGetElementById).toHaveBeenCalledWith("overview");
+    expect(mockScrollIntoView).toHaveBeenCalled();
+  });
+
+  test("should call scrollIntoView when clicking on a sublink in hash router mode", () => {
+    // Mock window.location.href to simulate hash router
+    Object.defineProperty(window, "location", {
+      value: {
+        href: "http://localhost:3000/#/components",
+      },
+      writable: true,
+    });
+
+    // Mock document.getElementById and scrollIntoView
+    const mockScrollIntoView = jest.fn();
+    const mockElement = { scrollIntoView: mockScrollIntoView };
+    const mockGetElementById = jest.fn().mockReturnValue(mockElement);
+    document.getElementById = mockGetElementById;
+
+    const { getByText } = render(<DxcQuickNav links={links} />);
+    const colorLink = getByText("Color");
+
+    fireEvent.click(colorLink);
+
+    expect(mockGetElementById).toHaveBeenCalledWith("principles-color");
+    expect(mockScrollIntoView).toHaveBeenCalled();
+  });
 });