diff --git a/src/components/AddressDisplay.test.tsx b/src/components/AddressDisplay.test.tsx index 76899cc..695b2c5 100644 --- a/src/components/AddressDisplay.test.tsx +++ b/src/components/AddressDisplay.test.tsx @@ -143,4 +143,45 @@ describe("AddressDisplay", () => { expect(el.className).toContain("font-mono"); }); }); + + it("renders the masked 4-prefix + middot + 4-suffix form when masked is true", () => { + const { container } = render(); + const el = container.querySelector("[data-address]") as HTMLElement; + expect(el.textContent).toMatch(/^GBAM.+QQQQ$/); + expect(el.textContent?.length ?? 0).toBeLessThan(address.length); + // The truncated middle chunk should not appear when masked is on. + expect(el.textContent).not.toContain("QXTQ"); + }); + + it("applies font-mono class when mono prop is true", () => { + render(); + const el = screen.getByText(/GBAMQXTQ/); + expect(el.className).toContain("font-mono"); + }); + + it("does not apply font-mono class by default", () => { + render(); + const el = screen.getByText(/GBAMQXTQ/); + expect(el.className).not.toContain("font-mono"); + }); + + it("renders
/
/
structure when label is provided", () => { + const { container } = render(); + expect(container.querySelector("dl")).toBeInTheDocument(); + const dt = container.querySelector("dt"); + expect(dt).toHaveTextContent("Source"); + expect(dt?.tagName).toBe("DT"); + const dd = container.querySelector("dd"); + expect(dd).toBeInTheDocument(); + expect(dd?.tagName).toBe("DD"); + // The
wraps the address span, so the addressSpan ends up under it. + expect(dd?.querySelector("[data-address]")).not.toBeNull(); + }); + + it("does not render
when label is omitted", () => { + const { container } = render(); + expect(container.querySelector("dl")).toBeNull(); + expect(container.querySelector("dt")).toBeNull(); + expect(container.querySelector("dd")).toBeNull(); + }); }); diff --git a/src/components/ui/Separator.test.tsx b/src/components/ui/Separator.test.tsx new file mode 100644 index 0000000..2195de1 --- /dev/null +++ b/src/components/ui/Separator.test.tsx @@ -0,0 +1,50 @@ +import { render, screen } from "@testing-library/react"; +import { describe, expect, it } from "vitest"; + +import { Separator } from "./Separator"; + +describe("Separator", () => { + it("renders with role=separator by default", () => { + const { container } = render(); + expect(container.firstElementChild).toHaveAttribute("role", "separator"); + }); + + it("renders a vertical orientation as a 1px full-height column and exposes aria-orientation=vertical", () => { + const { container } = render(); + const root = container.firstElementChild as HTMLElement; + expect(root).toHaveAttribute("role", "separator"); + expect(root).toHaveAttribute("aria-orientation", "vertical"); + expect(root).toHaveClass("w-px"); + expect(root).toHaveClass("h-full"); + }); + + it("renders the supplied label between the two horizontal lines", () => { + render(); + expect(screen.getByText("OR")).toBeInTheDocument(); + }); + + it("does not render the label container when label is omitted", () => { + const { container } = render(); + // The unlabeled horizontal path renders only the line itself. + const root = container.firstElementChild as HTMLElement; + expect(root.querySelector("span")).toBeNull(); + expect(root).toHaveClass("h-px"); + expect(root).toHaveClass("bg-line"); + }); + + it("applies the matching my-* spacing class for each spacing level", () => { + const { container: sm } = render(); + expect((sm.firstElementChild as HTMLElement).className).toContain("my-2"); + + const { container: md } = render(); + expect((md.firstElementChild as HTMLElement).className).toContain("my-4"); + + const { container: lg } = render(); + expect((lg.firstElementChild as HTMLElement).className).toContain("my-6"); + }); + + it("forwarded className lands on the rendered element", () => { + const { container } = render(); + expect(container.firstElementChild).toHaveClass("extra-class"); + }); +}); diff --git a/src/components/ui/Skeleton.test.tsx b/src/components/ui/Skeleton.test.tsx index bb38b50..8f870b7 100644 --- a/src/components/ui/Skeleton.test.tsx +++ b/src/components/ui/Skeleton.test.tsx @@ -106,6 +106,28 @@ describe("SkeletonCard", () => { expect(afterRows.length).toBe(2); void before; // suppress unused-var lint }); + + it("renders the provided structure prop instead of the default header + rows layout", () => { + const { container } = render( + Header content + } + />, + ); + expect(screen.getByTestId("custom-header")).toHaveTextContent("Header content"); + // The default header is replaced wholesale — no default h-4/w-32 marker present. + expect(container.querySelector(".h-4.w-32")).toBeNull(); + }); + + it("renders provided children instead of the default header + rows layout", () => { + render( + +
Child slot content
+
, + ); + expect(screen.getByTestId("custom-child")).toHaveTextContent("Child slot content"); + }); }); describe("AssetRowSkeleton", () => {