import { render, screen } from "@testing-library/react"; import { getShowcaseAssets } from "@/lib/project-showcase"; import { caseStudies } from "@/lib/site-content"; import { CaseHero } from "./CaseHero"; import { getCaseMedia } from "./case-media"; import { compactHero } from "./hero-styles"; /** * Testes de caminhos-base de CaseHero e dos fatos do projeto: com e sem captura gravada, case de cliente e de * laboratório, e a lista de fatos ausente, vazia ou preenchida. A existência da captura é simulada em getCaseMedia. */ jest.mock("./case-media", () => ({ getCaseMedia: jest.fn() })); const mockedGetCaseMedia = jest.mocked(getCaseMedia); function getCase(id: string) { const caseStudy = caseStudies.find((item) => item.id === id); if (!caseStudy) throw new Error(`Missing case ${id}`); return caseStudy; } const client = getCase("sev-modaintima"); const lab = getCase("twins-lab"); function withCapture(has: boolean) { mockedGetCaseMedia.mockImplementation((id, device) => has ? getShowcaseAssets(id, device) : undefined, ); } afterEach(() => { mockedGetCaseMedia.mockReset(); }); describe("CaseHero: captura gravada e tipo de case", () => { it("path: client case with a capture -> two columns, the cover on the right, the client eyebrow", () => { withCapture(true); const { container } = render(); expect(container.querySelector(".ds-section-shell")).toHaveClass("grid"); expect(container.querySelector(".ds-bframe")).toBeInTheDocument(); expect(screen.getByText(/Case de cliente/)).toBeVisible(); expect( screen.getByRole("heading", { level: 1, name: client.headline }), ).toBeVisible(); }); it("path: client case without a capture -> one column and no cover", () => { withCapture(false); const { container } = render(); expect(container.querySelector(".ds-section-shell")).not.toHaveClass( "grid", ); expect(container.querySelector(".ds-bframe")).toBeNull(); expect(screen.getByText(client.summary)).toBeVisible(); }); it("path: laboratory case with a capture -> the cover shows, with the laboratory eyebrow", () => { withCapture(true); const { container } = render(); expect(container.querySelector(".ds-bframe")).toBeInTheDocument(); expect(screen.getByText(/Projeto de laboratório/)).toBeVisible(); expect(screen.queryByText(/Case de cliente/)).toBeNull(); }); it("path: laboratory case without a capture -> one column, laboratory eyebrow, title and summary", () => { withCapture(false); const { container } = render(); expect(container.querySelector(".ds-section-shell")).not.toHaveClass( "grid", ); expect(container.querySelector(".ds-bframe")).toBeNull(); expect(screen.getByText(/Projeto de laboratório/)).toBeVisible(); expect(screen.getByText(lab.summary)).toBeVisible(); }); it("path: with a capture -> the top strip keeps the default height", () => { withCapture(true); const { container } = render(); expect(container.querySelector("section")).not.toHaveClass(compactHero); }); it("path: without a capture -> the top strip is the lower one-column strip, for client and laboratory cases", () => { withCapture(false); for (const [caseStudy, isClient] of [ [client, true], [lab, false], ] as const) { const { container, unmount } = render( , ); expect(container.querySelector("section")).toHaveClass(compactHero); unmount(); } }); it("path: breadcrumb -> Início, Cases and the case itself as the current page", () => { withCapture(false); render(); const links = screen.getAllByRole("link"); expect(links.map((link) => link.getAttribute("href"))).toEqual([ "/", "/cases", `/cases/${client.id}`, ]); expect(links[2]).toHaveAttribute("aria-current", "page"); }); }); describe("CaseHero: fatos do projeto", () => { const withFacts = (facts: string[] | undefined) => ({ ...client, facts, }); it("path: no facts field -> no list", () => { withCapture(false); render(); expect(screen.queryByRole("list", { name: "Fatos do projeto" })).toBeNull(); }); it("path: empty facts list -> no list", () => { withCapture(false); render(); expect(screen.queryByRole("list", { name: "Fatos do projeto" })).toBeNull(); }); it("path: filled facts -> one item each, after the summary", () => { withCapture(false); render( , ); const list = screen.getByRole("list", { name: "Fatos do projeto" }); expect(list.querySelectorAll("li")).toHaveLength(2); expect( screen.getByText(client.summary).compareDocumentPosition(list) & Node.DOCUMENT_POSITION_FOLLOWING, ).toBeTruthy(); }); });