Evandro Fonseca Junior
e80f73d075
Case com mídia ao lado do título e play acessível; problema de cada cliente reescrito com base nos dados; serviços relacionados em 2 cards; FAQ antes do próximo passo e bloco 'Onde já apliquei isso'; Apolo citada em IoT e arquitetura. metaTitle até 43 caracteres e descrições até 155 com teste; JSON-LD CreativeWork; imagens de compartilhamento abaixo de 100 KB; 404 e robots corrigidos; server-only nos módulos com node:.
67 lines
2.1 KiB
TypeScript
67 lines
2.1 KiB
TypeScript
import { render } from "@testing-library/react";
|
|
import type { ComponentProps } from "react";
|
|
import { clientCases } from "@/lib/site-content";
|
|
import CasesPage from "./page";
|
|
|
|
/**
|
|
* Carregamento da lista de cases: a primeira capa (a maior imagem acima da dobra) tem prioridade,
|
|
* e os links das capas não pré-carregam as páginas dos cases sozinhos.
|
|
*/
|
|
|
|
type LinkProps = ComponentProps<typeof import("next/link").default>;
|
|
|
|
/** Propriedades de cada `Link` renderizado: o `prefetch` não aparece no HTML, então a rota é espiada aqui. */
|
|
const mockLinkProps: LinkProps[] = [];
|
|
|
|
jest.mock("next/link", () => ({
|
|
__esModule: true,
|
|
default: ({ children, href, prefetch, ...anchor }: LinkProps) => {
|
|
mockLinkProps.push({ children, href, prefetch, ...anchor });
|
|
return (
|
|
<a href={String(href)} {...(anchor as Record<string, unknown>)}>
|
|
{children}
|
|
</a>
|
|
);
|
|
},
|
|
}));
|
|
|
|
beforeEach(() => {
|
|
mockLinkProps.length = 0;
|
|
});
|
|
|
|
function coverImages(container: HTMLElement) {
|
|
return clientCases.map((caseStudy) => {
|
|
const image = container
|
|
.querySelector(`a[href="/cases/${caseStudy.id}"][aria-hidden="true"]`)
|
|
?.querySelector("img");
|
|
if (!image) throw new Error(`Missing cover of ${caseStudy.id}`);
|
|
return image;
|
|
});
|
|
}
|
|
|
|
describe("CasesPage: carregamento das capas", () => {
|
|
it("loads the first cover with priority and the others lazily", () => {
|
|
const { container } = render(<CasesPage />);
|
|
|
|
const [first, ...others] = coverImages(container);
|
|
expect(first).not.toHaveAttribute("loading", "lazy");
|
|
expect(others.length).toBeGreaterThan(0);
|
|
for (const image of others) {
|
|
expect(image).toHaveAttribute("loading", "lazy");
|
|
}
|
|
});
|
|
|
|
it("does not prefetch the case pages from the cover links, nor from the card buttons", () => {
|
|
render(<CasesPage />);
|
|
|
|
const toCases = mockLinkProps.filter(({ href }) =>
|
|
String(href).startsWith("/cases/"),
|
|
);
|
|
// uma capa e um botão por case de cliente, e um botão por projeto do laboratório
|
|
expect(toCases.length).toBeGreaterThanOrEqual(clientCases.length * 2);
|
|
for (const props of toCases) {
|
|
expect(props.prefetch).toBe(false);
|
|
}
|
|
});
|
|
});
|