Evandro Fonseca Junior
de6af74a0c
Diagnóstico sem case que não cabe; desktop com o GCC Installer como projeto próprio; IoT com o Twins Lab e a nota da Apolo. Mosaico de pôsteres em /servicos e /cases, faixa baixa em uma coluna no currículo, privacidade e laboratório; Laboratório como lista compacta; SEV começando por catálogo, pedido no WhatsApp e painel; Joinville e SC nos títulos; imagens do LCP com fetchPriority e sizes reais; pré-carregamento só no hover; 404 com Open Graph próprio.
107 lines
3.8 KiB
TypeScript
107 lines
3.8 KiB
TypeScript
import { fireEvent, render, screen } from "@testing-library/react";
|
|
import { getShowcaseAssets } from "@/lib/project-showcase";
|
|
import { coverSizes } from "./CaseCover";
|
|
import { CaseCoverLink } from "./CaseCoverLink";
|
|
import { getCaseMedia } from "./case-media";
|
|
|
|
/**
|
|
* Testes de caminhos-base de CaseCoverLink: sem captura (nada), com captura (link fora da leitura e do teclado,
|
|
* com a capa dentro), os valores padrão de `sizes` e `priority`, o pré-carregamento só ao chegar no link
|
|
* e os valores dados.
|
|
*/
|
|
|
|
jest.mock("./case-media", () => ({ getCaseMedia: jest.fn() }));
|
|
jest.mock("next/link", () => ({
|
|
__esModule: true,
|
|
default: ({
|
|
children,
|
|
prefetch,
|
|
...props
|
|
}: { children?: React.ReactNode; prefetch?: boolean | null } & Record<
|
|
string,
|
|
unknown
|
|
>) => (
|
|
<a data-prefetch={String(prefetch)} {...props}>
|
|
{children}
|
|
</a>
|
|
),
|
|
}));
|
|
|
|
const mockedGetCaseMedia = jest.mocked(getCaseMedia);
|
|
const props = {
|
|
id: "sev-modaintima",
|
|
title: "SEV Moda Íntima",
|
|
demoUrl: "https://sevmodaintima.com.br",
|
|
};
|
|
|
|
afterEach(() => {
|
|
mockedGetCaseMedia.mockReset();
|
|
});
|
|
|
|
describe("CaseCoverLink", () => {
|
|
it("path: no desktop capture -> renders nothing, not even the link", () => {
|
|
mockedGetCaseMedia.mockReturnValue(undefined);
|
|
const { container } = render(<CaseCoverLink {...props} />);
|
|
|
|
expect(container).toBeEmptyDOMElement();
|
|
expect(mockedGetCaseMedia).toHaveBeenCalledWith(props.id, "desktop");
|
|
});
|
|
|
|
it("path: capture found -> a link to the case, out of reading order and tab order, around the cover", () => {
|
|
mockedGetCaseMedia.mockImplementation(getShowcaseAssets);
|
|
const { container } = render(<CaseCoverLink {...props} />);
|
|
|
|
const link = container.querySelector("a");
|
|
expect(link).toHaveAttribute("href", `/cases/${props.id}`);
|
|
expect(link).toHaveAttribute("aria-hidden", "true");
|
|
expect(link).toHaveAttribute("tabindex", "-1");
|
|
expect(link?.querySelector(".ds-bframe-url")).toHaveTextContent(
|
|
"sevmodaintima.com.br",
|
|
);
|
|
expect(
|
|
screen.getByAltText(`Captura de tela do site ${props.title}`),
|
|
).toBeInTheDocument();
|
|
});
|
|
|
|
it("path: sizes and priority omitted -> default sizes and lazy image", () => {
|
|
mockedGetCaseMedia.mockImplementation(getShowcaseAssets);
|
|
render(<CaseCoverLink {...props} />);
|
|
|
|
const image = screen.getByAltText(`Captura de tela do site ${props.title}`);
|
|
expect(image).toHaveAttribute("sizes", coverSizes.card);
|
|
expect(image).toHaveAttribute("loading", "lazy");
|
|
expect(image).not.toHaveAttribute("fetchpriority");
|
|
});
|
|
|
|
it("path: link -> pre-fetches the case only when the pointer or focus reaches it", () => {
|
|
mockedGetCaseMedia.mockImplementation(getShowcaseAssets);
|
|
const { container } = render(<CaseCoverLink {...props} />);
|
|
|
|
const link = container.querySelector("a");
|
|
expect(link).toHaveAttribute("data-prefetch", "false");
|
|
fireEvent.mouseEnter(link as HTMLAnchorElement);
|
|
expect(link).toHaveAttribute("data-prefetch", "null");
|
|
});
|
|
|
|
it("path: sizes and priority given -> both are used", () => {
|
|
mockedGetCaseMedia.mockImplementation(getShowcaseAssets);
|
|
render(<CaseCoverLink {...props} sizes="320px" priority />);
|
|
|
|
const image = screen.getByAltText(`Captura de tela do site ${props.title}`);
|
|
expect(image).toHaveAttribute("sizes", "320px");
|
|
expect(image).toHaveAttribute("loading", "eager");
|
|
expect(image).toHaveAttribute("fetchpriority", "high");
|
|
});
|
|
|
|
it("path: no demo address -> the browser bar falls back to the project title", () => {
|
|
mockedGetCaseMedia.mockImplementation(getShowcaseAssets);
|
|
const { container } = render(
|
|
<CaseCoverLink id={props.id} title={props.title} demoUrl={null} />,
|
|
);
|
|
|
|
expect(container.querySelector(".ds-bframe-url")).toHaveTextContent(
|
|
props.title,
|
|
);
|
|
});
|
|
});
|