@windstream/react-shared-components 0.1.94 → 0.1.96

package/src/components/pagination/index.test.tsx

@@ -1,521 +1,521 @@
-import React from "react";
-import { Pagination } from "./index";
-
-import { fireEvent, render, screen } from "@testing-library/react";
-
-// Mock dependencies
-jest.mock("@shared/components/button", () => ({
-  Button: ({ children, onClick, disabled, className, ...rest }: any) => (
-    <button
-      onClick={onClick}
-      disabled={disabled}
-      className={className}
-      {...rest}
-    >
-      {children}
-    </button>
-  ),
-}));
-
-jest.mock("@shared/components/material-icon", () => ({
-  MaterialIcon: ({ name, ...rest }: any) => (
-    <span data-testid={`icon-${name}`} {...rest}>
-      {name}
-    </span>
-  ),
-}));
-
-describe("Pagination", () => {
-  const mockOnPageChange = jest.fn();
-
-  beforeEach(() => {
-    mockOnPageChange.mockClear();
-  });
-
-  describe("Rendering", () => {
-    it("renders the pagination nav with default aria-label", () => {
-      render(
-        <Pagination
-          currentPage={1}
-          totalPages={5}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      expect(screen.getByRole("navigation")).toHaveAttribute(
-        "aria-label",
-        "Pagination"
-      );
-    });
-
-    it("renders with custom aria-label", () => {
-      render(
-        <Pagination
-          currentPage={1}
-          totalPages={5}
-          onPageChange={mockOnPageChange}
-          ariaLabel="Blog pages"
-        />
-      );
-      expect(screen.getByRole("navigation")).toHaveAttribute(
-        "aria-label",
-        "Blog pages"
-      );
-    });
-
-    it("renders previous and next navigation buttons", () => {
-      render(
-        <Pagination
-          currentPage={3}
-          totalPages={5}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      expect(
-        screen.getByRole("button", { name: "Go to previous page" })
-      ).toBeInTheDocument();
-      expect(
-        screen.getByRole("button", { name: "Go to next page" })
-      ).toBeInTheDocument();
-    });
-
-    it("renders chevron icons in nav buttons", () => {
-      render(
-        <Pagination
-          currentPage={1}
-          totalPages={5}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      expect(screen.getByTestId("icon-chevron_left")).toBeInTheDocument();
-      expect(screen.getByTestId("icon-chevron_right")).toBeInTheDocument();
-    });
-  });
-
-  describe("Button states", () => {
-    it("disables previous button on first page", () => {
-      render(
-        <Pagination
-          currentPage={1}
-          totalPages={5}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      expect(
-        screen.getByRole("button", { name: "Go to previous page" })
-      ).toBeDisabled();
-    });
-
-    it("enables previous button when not on first page", () => {
-      render(
-        <Pagination
-          currentPage={3}
-          totalPages={5}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      expect(
-        screen.getByRole("button", { name: "Go to previous page" })
-      ).not.toBeDisabled();
-    });
-
-    it("disables next button on last page", () => {
-      render(
-        <Pagination
-          currentPage={5}
-          totalPages={5}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      expect(
-        screen.getByRole("button", { name: "Go to next page" })
-      ).toBeDisabled();
-    });
-
-    it("enables next button when not on last page", () => {
-      render(
-        <Pagination
-          currentPage={3}
-          totalPages={5}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      expect(
-        screen.getByRole("button", { name: "Go to next page" })
-      ).not.toBeDisabled();
-    });
-
-    it("marks current page with aria-current='page'", () => {
-      render(
-        <Pagination
-          currentPage={3}
-          totalPages={5}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      expect(
-        screen.getByRole("button", { name: "Go to page 3" })
-      ).toHaveAttribute("aria-current", "page");
-    });
-
-    it("does not set aria-current on non-current pages", () => {
-      render(
-        <Pagination
-          currentPage={3}
-          totalPages={5}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      expect(
-        screen.getByRole("button", { name: "Go to page 1" })
-      ).not.toHaveAttribute("aria-current");
-    });
-
-    it("applies active class to current page button", () => {
-      render(
-        <Pagination
-          currentPage={2}
-          totalPages={5}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      const activeBtn = screen.getByRole("button", { name: "Go to page 2" });
-      expect(activeBtn.className).toContain("bg-bg-surface-active");
-      expect(activeBtn.className).toContain("font-bold");
-    });
-
-    it("does not apply active class to non-current page buttons", () => {
-      render(
-        <Pagination
-          currentPage={2}
-          totalPages={5}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      const inactiveBtn = screen.getByRole("button", {
-        name: "Go to page 1",
-      });
-      expect(inactiveBtn.className).not.toContain("bg-bg-surface-active");
-    });
-  });
-
-  describe("Page navigation clicks", () => {
-    it("calls onPageChange with previous page when previous button clicked", () => {
-      render(
-        <Pagination
-          currentPage={3}
-          totalPages={5}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      fireEvent.click(
-        screen.getByRole("button", { name: "Go to previous page" })
-      );
-      expect(mockOnPageChange).toHaveBeenCalledWith(2);
-    });
-
-    it("calls onPageChange with next page when next button clicked", () => {
-      render(
-        <Pagination
-          currentPage={3}
-          totalPages={5}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      fireEvent.click(screen.getByRole("button", { name: "Go to next page" }));
-      expect(mockOnPageChange).toHaveBeenCalledWith(4);
-    });
-
-    it("calls onPageChange with clicked page number", () => {
-      render(
-        <Pagination
-          currentPage={1}
-          totalPages={5}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      fireEvent.click(screen.getByRole("button", { name: "Go to page 4" }));
-      expect(mockOnPageChange).toHaveBeenCalledWith(4);
-    });
-
-    it("does not call onPageChange when disabled previous button is clicked", () => {
-      render(
-        <Pagination
-          currentPage={1}
-          totalPages={5}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      fireEvent.click(
-        screen.getByRole("button", { name: "Go to previous page" })
-      );
-      expect(mockOnPageChange).not.toHaveBeenCalled();
-    });
-
-    it("does not call onPageChange when disabled next button is clicked", () => {
-      render(
-        <Pagination
-          currentPage={5}
-          totalPages={5}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      fireEvent.click(screen.getByRole("button", { name: "Go to next page" }));
-      expect(mockOnPageChange).not.toHaveBeenCalled();
-    });
-  });
-
-  describe("buildPageItems algorithm — total pages <= 7", () => {
-    it("renders all pages for totalPages=1", () => {
-      render(
-        <Pagination
-          currentPage={1}
-          totalPages={1}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      expect(
-        screen.getByRole("button", { name: "Go to page 1" })
-      ).toBeInTheDocument();
-      expect(screen.queryByText("…")).not.toBeInTheDocument();
-    });
-
-    it("renders all pages for totalPages=5", () => {
-      render(
-        <Pagination
-          currentPage={1}
-          totalPages={5}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      for (let i = 1; i <= 5; i++) {
-        expect(
-          screen.getByRole("button", { name: `Go to page ${i}` })
-        ).toBeInTheDocument();
-      }
-      expect(screen.queryByText("…")).not.toBeInTheDocument();
-    });
-
-    it("renders all pages for totalPages=7", () => {
-      render(
-        <Pagination
-          currentPage={4}
-          totalPages={7}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      for (let i = 1; i <= 7; i++) {
-        expect(
-          screen.getByRole("button", { name: `Go to page ${i}` })
-        ).toBeInTheDocument();
-      }
-      expect(screen.queryByText("…")).not.toBeInTheDocument();
-    });
-  });
-
-  describe("buildPageItems algorithm — current near start (current <= 4)", () => {
-    it("shows pages 1-5 and ellipsis then last page when on page 1", () => {
-      render(
-        <Pagination
-          currentPage={1}
-          totalPages={10}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      for (let i = 1; i <= 5; i++) {
-        expect(
-          screen.getByRole("button", { name: `Go to page ${i}` })
-        ).toBeInTheDocument();
-      }
-      expect(screen.getByText("…")).toBeInTheDocument();
-      expect(
-        screen.getByRole("button", { name: "Go to page 10" })
-      ).toBeInTheDocument();
-      expect(
-        screen.queryByRole("button", { name: "Go to page 6" })
-      ).not.toBeInTheDocument();
-    });
-
-    it("shows pages 1-5, ellipsis, last for page 4 of 10", () => {
-      render(
-        <Pagination
-          currentPage={4}
-          totalPages={10}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      for (let i = 1; i <= 5; i++) {
-        expect(
-          screen.getByRole("button", { name: `Go to page ${i}` })
-        ).toBeInTheDocument();
-      }
-      expect(screen.getByText("…")).toBeInTheDocument();
-      expect(
-        screen.getByRole("button", { name: "Go to page 10" })
-      ).toBeInTheDocument();
-    });
-  });
-
-  describe("buildPageItems algorithm — current near end (current >= total - 3)", () => {
-    it("shows first page, ellipsis, last 5 pages when on last page", () => {
-      render(
-        <Pagination
-          currentPage={10}
-          totalPages={10}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      expect(
-        screen.getByRole("button", { name: "Go to page 1" })
-      ).toBeInTheDocument();
-      expect(screen.getByText("…")).toBeInTheDocument();
-      for (let i = 6; i <= 10; i++) {
-        expect(
-          screen.getByRole("button", { name: `Go to page ${i}` })
-        ).toBeInTheDocument();
-      }
-    });
-
-    it("shows first, ellipsis, last 5 for page 7 of 10", () => {
-      render(
-        <Pagination
-          currentPage={7}
-          totalPages={10}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      expect(
-        screen.getByRole("button", { name: "Go to page 1" })
-      ).toBeInTheDocument();
-      expect(screen.getByText("…")).toBeInTheDocument();
-      for (let i = 6; i <= 10; i++) {
-        expect(
-          screen.getByRole("button", { name: `Go to page ${i}` })
-        ).toBeInTheDocument();
-      }
-    });
-  });
-
-  describe("buildPageItems algorithm — current in middle", () => {
-    it("shows first, ellipsis, current-1/current/current+1, ellipsis, last", () => {
-      render(
-        <Pagination
-          currentPage={5}
-          totalPages={10}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      expect(
-        screen.getByRole("button", { name: "Go to page 1" })
-      ).toBeInTheDocument();
-      expect(
-        screen.getByRole("button", { name: "Go to page 4" })
-      ).toBeInTheDocument();
-      expect(
-        screen.getByRole("button", { name: "Go to page 5" })
-      ).toBeInTheDocument();
-      expect(
-        screen.getByRole("button", { name: "Go to page 6" })
-      ).toBeInTheDocument();
-      expect(
-        screen.getByRole("button", { name: "Go to page 10" })
-      ).toBeInTheDocument();
-      const ellipses = screen.getAllByText("…");
-      expect(ellipses).toHaveLength(2);
-    });
-
-    it("renders ellipsis as non-interactive with aria-hidden", () => {
-      render(
-        <Pagination
-          currentPage={5}
-          totalPages={10}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      const ellipses = screen.getAllByText("…");
-      ellipses.forEach(el => {
-        expect(el).toHaveAttribute("aria-hidden", "true");
-        expect(el.tagName).toBe("SPAN");
-      });
-    });
-
-    it("shows correct pages for page 6 of 10", () => {
-      render(
-        <Pagination
-          currentPage={6}
-          totalPages={10}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      expect(
-        screen.getByRole("button", { name: "Go to page 1" })
-      ).toBeInTheDocument();
-      expect(
-        screen.getByRole("button", { name: "Go to page 5" })
-      ).toBeInTheDocument();
-      expect(
-        screen.getByRole("button", { name: "Go to page 6" })
-      ).toBeInTheDocument();
-      expect(
-        screen.getByRole("button", { name: "Go to page 7" })
-      ).toBeInTheDocument();
-      expect(
-        screen.getByRole("button", { name: "Go to page 10" })
-      ).toBeInTheDocument();
-      expect(screen.getAllByText("…")).toHaveLength(2);
-    });
-  });
-
-  describe("Edge cases", () => {
-    it("handles single page (both nav buttons disabled)", () => {
-      render(
-        <Pagination
-          currentPage={1}
-          totalPages={1}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      expect(
-        screen.getByRole("button", { name: "Go to previous page" })
-      ).toBeDisabled();
-      expect(
-        screen.getByRole("button", { name: "Go to next page" })
-      ).toBeDisabled();
-    });
-
-    it("handles totalPages=8 with current=4 (near-start boundary)", () => {
-      render(
-        <Pagination
-          currentPage={4}
-          totalPages={8}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      for (let i = 1; i <= 5; i++) {
-        expect(
-          screen.getByRole("button", { name: `Go to page ${i}` })
-        ).toBeInTheDocument();
-      }
-      expect(
-        screen.getByRole("button", { name: "Go to page 8" })
-      ).toBeInTheDocument();
-    });
-
-    it("handles totalPages=8 with current=5 (near-end boundary)", () => {
-      render(
-        <Pagination
-          currentPage={5}
-          totalPages={8}
-          onPageChange={mockOnPageChange}
-        />
-      );
-      expect(
-        screen.getByRole("button", { name: "Go to page 1" })
-      ).toBeInTheDocument();
-      for (let i = 4; i <= 8; i++) {
-        expect(
-          screen.getByRole("button", { name: `Go to page ${i}` })
-        ).toBeInTheDocument();
-      }
-    });
-  });
-});
+import React from "react";
+import { Pagination } from "./index";
+
+import { fireEvent, render, screen } from "@testing-library/react";
+
+// Mock dependencies
+jest.mock("@shared/components/button", () => ({
+  Button: ({ children, onClick, disabled, className, ...rest }: any) => (
+    <button
+      onClick={onClick}
+      disabled={disabled}
+      className={className}
+      {...rest}
+    >
+      {children}
+    </button>
+  ),
+}));
+
+jest.mock("@shared/components/material-icon", () => ({
+  MaterialIcon: ({ name, ...rest }: any) => (
+    <span data-testid={`icon-${name}`} {...rest}>
+      {name}
+    </span>
+  ),
+}));
+
+describe("Pagination", () => {
+  const mockOnPageChange = jest.fn();
+
+  beforeEach(() => {
+    mockOnPageChange.mockClear();
+  });
+
+  describe("Rendering", () => {
+    it("renders the pagination nav with default aria-label", () => {
+      render(
+        <Pagination
+          currentPage={1}
+          totalPages={5}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      expect(screen.getByRole("navigation")).toHaveAttribute(
+        "aria-label",
+        "Pagination"
+      );
+    });
+
+    it("renders with custom aria-label", () => {
+      render(
+        <Pagination
+          currentPage={1}
+          totalPages={5}
+          onPageChange={mockOnPageChange}
+          ariaLabel="Blog pages"
+        />
+      );
+      expect(screen.getByRole("navigation")).toHaveAttribute(
+        "aria-label",
+        "Blog pages"
+      );
+    });
+
+    it("renders previous and next navigation buttons", () => {
+      render(
+        <Pagination
+          currentPage={3}
+          totalPages={5}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      expect(
+        screen.getByRole("button", { name: "Go to previous page" })
+      ).toBeInTheDocument();
+      expect(
+        screen.getByRole("button", { name: "Go to next page" })
+      ).toBeInTheDocument();
+    });
+
+    it("renders chevron icons in nav buttons", () => {
+      render(
+        <Pagination
+          currentPage={1}
+          totalPages={5}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      expect(screen.getByTestId("icon-chevron_left")).toBeInTheDocument();
+      expect(screen.getByTestId("icon-chevron_right")).toBeInTheDocument();
+    });
+  });
+
+  describe("Button states", () => {
+    it("disables previous button on first page", () => {
+      render(
+        <Pagination
+          currentPage={1}
+          totalPages={5}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      expect(
+        screen.getByRole("button", { name: "Go to previous page" })
+      ).toBeDisabled();
+    });
+
+    it("enables previous button when not on first page", () => {
+      render(
+        <Pagination
+          currentPage={3}
+          totalPages={5}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      expect(
+        screen.getByRole("button", { name: "Go to previous page" })
+      ).not.toBeDisabled();
+    });
+
+    it("disables next button on last page", () => {
+      render(
+        <Pagination
+          currentPage={5}
+          totalPages={5}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      expect(
+        screen.getByRole("button", { name: "Go to next page" })
+      ).toBeDisabled();
+    });
+
+    it("enables next button when not on last page", () => {
+      render(
+        <Pagination
+          currentPage={3}
+          totalPages={5}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      expect(
+        screen.getByRole("button", { name: "Go to next page" })
+      ).not.toBeDisabled();
+    });
+
+    it("marks current page with aria-current='page'", () => {
+      render(
+        <Pagination
+          currentPage={3}
+          totalPages={5}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      expect(
+        screen.getByRole("button", { name: "Go to page 3" })
+      ).toHaveAttribute("aria-current", "page");
+    });
+
+    it("does not set aria-current on non-current pages", () => {
+      render(
+        <Pagination
+          currentPage={3}
+          totalPages={5}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      expect(
+        screen.getByRole("button", { name: "Go to page 1" })
+      ).not.toHaveAttribute("aria-current");
+    });
+
+    it("applies active class to current page button", () => {
+      render(
+        <Pagination
+          currentPage={2}
+          totalPages={5}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      const activeBtn = screen.getByRole("button", { name: "Go to page 2" });
+      expect(activeBtn.className).toContain("bg-bg-surface-active");
+      expect(activeBtn.className).toContain("font-bold");
+    });
+
+    it("does not apply active class to non-current page buttons", () => {
+      render(
+        <Pagination
+          currentPage={2}
+          totalPages={5}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      const inactiveBtn = screen.getByRole("button", {
+        name: "Go to page 1",
+      });
+      expect(inactiveBtn.className).not.toContain("bg-bg-surface-active");
+    });
+  });
+
+  describe("Page navigation clicks", () => {
+    it("calls onPageChange with previous page when previous button clicked", () => {
+      render(
+        <Pagination
+          currentPage={3}
+          totalPages={5}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      fireEvent.click(
+        screen.getByRole("button", { name: "Go to previous page" })
+      );
+      expect(mockOnPageChange).toHaveBeenCalledWith(2);
+    });
+
+    it("calls onPageChange with next page when next button clicked", () => {
+      render(
+        <Pagination
+          currentPage={3}
+          totalPages={5}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      fireEvent.click(screen.getByRole("button", { name: "Go to next page" }));
+      expect(mockOnPageChange).toHaveBeenCalledWith(4);
+    });
+
+    it("calls onPageChange with clicked page number", () => {
+      render(
+        <Pagination
+          currentPage={1}
+          totalPages={5}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      fireEvent.click(screen.getByRole("button", { name: "Go to page 4" }));
+      expect(mockOnPageChange).toHaveBeenCalledWith(4);
+    });
+
+    it("does not call onPageChange when disabled previous button is clicked", () => {
+      render(
+        <Pagination
+          currentPage={1}
+          totalPages={5}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      fireEvent.click(
+        screen.getByRole("button", { name: "Go to previous page" })
+      );
+      expect(mockOnPageChange).not.toHaveBeenCalled();
+    });
+
+    it("does not call onPageChange when disabled next button is clicked", () => {
+      render(
+        <Pagination
+          currentPage={5}
+          totalPages={5}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      fireEvent.click(screen.getByRole("button", { name: "Go to next page" }));
+      expect(mockOnPageChange).not.toHaveBeenCalled();
+    });
+  });
+
+  describe("buildPageItems algorithm — total pages <= 7", () => {
+    it("renders all pages for totalPages=1", () => {
+      render(
+        <Pagination
+          currentPage={1}
+          totalPages={1}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      expect(
+        screen.getByRole("button", { name: "Go to page 1" })
+      ).toBeInTheDocument();
+      expect(screen.queryByText("…")).not.toBeInTheDocument();
+    });
+
+    it("renders all pages for totalPages=5", () => {
+      render(
+        <Pagination
+          currentPage={1}
+          totalPages={5}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      for (let i = 1; i <= 5; i++) {
+        expect(
+          screen.getByRole("button", { name: `Go to page ${i}` })
+        ).toBeInTheDocument();
+      }
+      expect(screen.queryByText("…")).not.toBeInTheDocument();
+    });
+
+    it("renders all pages for totalPages=7", () => {
+      render(
+        <Pagination
+          currentPage={4}
+          totalPages={7}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      for (let i = 1; i <= 7; i++) {
+        expect(
+          screen.getByRole("button", { name: `Go to page ${i}` })
+        ).toBeInTheDocument();
+      }
+      expect(screen.queryByText("…")).not.toBeInTheDocument();
+    });
+  });
+
+  describe("buildPageItems algorithm — current near start (current <= 4)", () => {
+    it("shows pages 1-5 and ellipsis then last page when on page 1", () => {
+      render(
+        <Pagination
+          currentPage={1}
+          totalPages={10}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      for (let i = 1; i <= 5; i++) {
+        expect(
+          screen.getByRole("button", { name: `Go to page ${i}` })
+        ).toBeInTheDocument();
+      }
+      expect(screen.getByText("…")).toBeInTheDocument();
+      expect(
+        screen.getByRole("button", { name: "Go to page 10" })
+      ).toBeInTheDocument();
+      expect(
+        screen.queryByRole("button", { name: "Go to page 6" })
+      ).not.toBeInTheDocument();
+    });
+
+    it("shows pages 1-5, ellipsis, last for page 4 of 10", () => {
+      render(
+        <Pagination
+          currentPage={4}
+          totalPages={10}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      for (let i = 1; i <= 5; i++) {
+        expect(
+          screen.getByRole("button", { name: `Go to page ${i}` })
+        ).toBeInTheDocument();
+      }
+      expect(screen.getByText("…")).toBeInTheDocument();
+      expect(
+        screen.getByRole("button", { name: "Go to page 10" })
+      ).toBeInTheDocument();
+    });
+  });
+
+  describe("buildPageItems algorithm — current near end (current >= total - 3)", () => {
+    it("shows first page, ellipsis, last 5 pages when on last page", () => {
+      render(
+        <Pagination
+          currentPage={10}
+          totalPages={10}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      expect(
+        screen.getByRole("button", { name: "Go to page 1" })
+      ).toBeInTheDocument();
+      expect(screen.getByText("…")).toBeInTheDocument();
+      for (let i = 6; i <= 10; i++) {
+        expect(
+          screen.getByRole("button", { name: `Go to page ${i}` })
+        ).toBeInTheDocument();
+      }
+    });
+
+    it("shows first, ellipsis, last 5 for page 7 of 10", () => {
+      render(
+        <Pagination
+          currentPage={7}
+          totalPages={10}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      expect(
+        screen.getByRole("button", { name: "Go to page 1" })
+      ).toBeInTheDocument();
+      expect(screen.getByText("…")).toBeInTheDocument();
+      for (let i = 6; i <= 10; i++) {
+        expect(
+          screen.getByRole("button", { name: `Go to page ${i}` })
+        ).toBeInTheDocument();
+      }
+    });
+  });
+
+  describe("buildPageItems algorithm — current in middle", () => {
+    it("shows first, ellipsis, current-1/current/current+1, ellipsis, last", () => {
+      render(
+        <Pagination
+          currentPage={5}
+          totalPages={10}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      expect(
+        screen.getByRole("button", { name: "Go to page 1" })
+      ).toBeInTheDocument();
+      expect(
+        screen.getByRole("button", { name: "Go to page 4" })
+      ).toBeInTheDocument();
+      expect(
+        screen.getByRole("button", { name: "Go to page 5" })
+      ).toBeInTheDocument();
+      expect(
+        screen.getByRole("button", { name: "Go to page 6" })
+      ).toBeInTheDocument();
+      expect(
+        screen.getByRole("button", { name: "Go to page 10" })
+      ).toBeInTheDocument();
+      const ellipses = screen.getAllByText("…");
+      expect(ellipses).toHaveLength(2);
+    });
+
+    it("renders ellipsis as non-interactive with aria-hidden", () => {
+      render(
+        <Pagination
+          currentPage={5}
+          totalPages={10}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      const ellipses = screen.getAllByText("…");
+      ellipses.forEach(el => {
+        expect(el).toHaveAttribute("aria-hidden", "true");
+        expect(el.tagName).toBe("SPAN");
+      });
+    });
+
+    it("shows correct pages for page 6 of 10", () => {
+      render(
+        <Pagination
+          currentPage={6}
+          totalPages={10}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      expect(
+        screen.getByRole("button", { name: "Go to page 1" })
+      ).toBeInTheDocument();
+      expect(
+        screen.getByRole("button", { name: "Go to page 5" })
+      ).toBeInTheDocument();
+      expect(
+        screen.getByRole("button", { name: "Go to page 6" })
+      ).toBeInTheDocument();
+      expect(
+        screen.getByRole("button", { name: "Go to page 7" })
+      ).toBeInTheDocument();
+      expect(
+        screen.getByRole("button", { name: "Go to page 10" })
+      ).toBeInTheDocument();
+      expect(screen.getAllByText("…")).toHaveLength(2);
+    });
+  });
+
+  describe("Edge cases", () => {
+    it("handles single page (both nav buttons disabled)", () => {
+      render(
+        <Pagination
+          currentPage={1}
+          totalPages={1}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      expect(
+        screen.getByRole("button", { name: "Go to previous page" })
+      ).toBeDisabled();
+      expect(
+        screen.getByRole("button", { name: "Go to next page" })
+      ).toBeDisabled();
+    });
+
+    it("handles totalPages=8 with current=4 (near-start boundary)", () => {
+      render(
+        <Pagination
+          currentPage={4}
+          totalPages={8}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      for (let i = 1; i <= 5; i++) {
+        expect(
+          screen.getByRole("button", { name: `Go to page ${i}` })
+        ).toBeInTheDocument();
+      }
+      expect(
+        screen.getByRole("button", { name: "Go to page 8" })
+      ).toBeInTheDocument();
+    });
+
+    it("handles totalPages=8 with current=5 (near-end boundary)", () => {
+      render(
+        <Pagination
+          currentPage={5}
+          totalPages={8}
+          onPageChange={mockOnPageChange}
+        />
+      );
+      expect(
+        screen.getByRole("button", { name: "Go to page 1" })
+      ).toBeInTheDocument();
+      for (let i = 4; i <= 8; i++) {
+        expect(
+          screen.getByRole("button", { name: `Go to page ${i}` })
+        ).toBeInTheDocument();
+      }
+    });
+  });
+});