evandro
c7d09d63d4
Hero e movimento - cena 3D em tempo real com os blocos da marca (kit feito no Blender, 3d/blocos.py): marca, tela, integrações e dados; segue a rolagem, tem vida em repouso, reage ao cursor e, parada no topo, passa sozinha pelos estados com legenda - três níveis de aparelho (full, lite, static); sem WebGL fica o pôster - título novo: "Sites e sistemas sob medida para o jeito que a sua empresa trabalha." - faixa de clientes com o ramo, linha do primeiro passo, hero alinhado às seções - rótulos digitados, entrada dos blocos, cortina de blocos entre páginas e capa compartilhada entre a lista de cases e o case Ofertas - atendimento no WhatsApp com IA e nota fiscal para a reforma tributária (páginas de serviço, cartões da home, formulário e aviso com data de validade) - página /ia atualizada, com fontes - peças 3D em loop nos cartões e topos de página (3d/pecas.py) Design - hover por papel (bloco nos botões, barra nos links), rótulos sem caixa alta - um destino por rótulo: "Falar sobre meu projeto" leva ao formulário, "Chamar no WhatsApp" abre o WhatsApp - logo montado em blocos, 404 redesenhado, grades sem célula vazia - ícones do PWA e manifesto novos Specs em specs/, contexto de design em DESIGN.md e PRODUCT.md.
71 lines
2.1 KiB
TypeScript
71 lines
2.1 KiB
TypeScript
import { act, render, waitFor } from "@testing-library/react";
|
|
import { OfferVideo } from "./OfferVideo";
|
|
|
|
/**
|
|
* O vídeo da peça 3D toca quando aparece (o IntersectionObserver do jest.setup avisa logo depois de observar) e fica
|
|
* parado no pôster com movimento reduzido ou "Economizar dados".
|
|
*/
|
|
|
|
const realMatchMedia = window.matchMedia;
|
|
|
|
let play: jest.SpyInstance;
|
|
let pause: jest.SpyInstance;
|
|
|
|
beforeEach(() => {
|
|
play = jest
|
|
.spyOn(HTMLMediaElement.prototype, "play")
|
|
.mockResolvedValue(undefined);
|
|
pause = jest
|
|
.spyOn(HTMLMediaElement.prototype, "pause")
|
|
.mockImplementation(() => {});
|
|
});
|
|
|
|
afterEach(() => {
|
|
jest.useRealTimers();
|
|
jest.restoreAllMocks();
|
|
window.matchMedia = realMatchMedia;
|
|
Reflect.deleteProperty(navigator, "connection");
|
|
});
|
|
|
|
it("path: in view -> plays, muted and in a loop", async () => {
|
|
const { container } = render(<OfferVideo name="whatsapp" />);
|
|
|
|
await waitFor(() => expect(play).toHaveBeenCalled());
|
|
const video = container.querySelector("video") as HTMLVideoElement;
|
|
expect(video.muted).toBe(true);
|
|
expect(video.loop).toBe(true);
|
|
});
|
|
|
|
it("path: reduced motion -> never plays, stays on the poster", () => {
|
|
jest.useFakeTimers();
|
|
window.matchMedia = jest.fn().mockImplementation((query: string) => ({
|
|
matches: query === "(prefers-reduced-motion: reduce)",
|
|
media: query,
|
|
addEventListener: jest.fn(),
|
|
removeEventListener: jest.fn(),
|
|
}));
|
|
const { container } = render(<OfferVideo name="sistema" />);
|
|
|
|
// o aviso de "à vista" do IntersectionObserver chega num setTimeout
|
|
act(() => jest.runAllTimers());
|
|
expect(pause).toHaveBeenCalled();
|
|
expect(play).not.toHaveBeenCalled();
|
|
expect(container.querySelector("video")).toHaveAttribute(
|
|
"poster",
|
|
"/3d/peca-sistema.webp",
|
|
);
|
|
});
|
|
|
|
it("path: save data -> never plays", () => {
|
|
jest.useFakeTimers();
|
|
Object.defineProperty(navigator, "connection", {
|
|
configurable: true,
|
|
value: { saveData: true },
|
|
});
|
|
render(<OfferVideo name="sistema" />);
|
|
|
|
act(() => jest.runAllTimers());
|
|
expect(pause).toHaveBeenCalled();
|
|
expect(play).not.toHaveBeenCalled();
|
|
});
|