Files
portifolio-evandrodevbr/app/components/cinematic/ScrollProgress.test.tsx
T
Evandro Fonseca Junior 318a764190 perf(movimento): sem tela vazia, passagens em CSS e vitrine leve
Projetos sobem sobre o palco do hero e o celular tem hero de uma tela sem mergulho; passagens com animation-timeline em CSS, sem GSAP nem motion; troca da vitrine sem texto duplicado; moldura de celular só com pôster e scrub reencodado em 960 px (9,4 para 5,2 MB); 3D monta na primeira interação e para quando parado; transição entre páginas do mesmo segmento; foco em anel duplo; texto de 15 px no celular; código morto removido.
2026-10-14 14:15:50 -03:00

53 lines
1.8 KiB
TypeScript

import { render } from "@testing-library/react";
import ScrollProgress from "./ScrollProgress";
describe("ScrollProgress", () => {
it("is decorative: hidden from assistive technology, with no text", () => {
const { container } = render(<ScrollProgress />);
for (const piece of container.querySelectorAll(".ds-scroll-progress"))
expect(piece).toHaveAttribute("aria-hidden", "true");
expect(container).toHaveTextContent("");
});
it("has the top bar and the side rail with its fill and dot, ready for the CSS scroll timeline", () => {
const { container } = render(<ScrollProgress />);
expect(container.querySelector(".ds-scroll-bar")).toBeInTheDocument();
expect(
container.querySelector(".ds-scroll-rail .ds-scroll-fill"),
).toBeInTheDocument();
expect(
container.querySelector(".ds-scroll-rail .ds-scroll-dot"),
).toBeInTheDocument();
});
it("drives nothing from JavaScript: no inline transform or opacity, no scroll listener", () => {
const listen = jest.spyOn(window, "addEventListener");
const { container } = render(<ScrollProgress />);
for (const element of container.querySelectorAll<HTMLElement>("*")) {
expect(element.style.transform).toBe("");
expect(element.style.opacity).toBe("");
}
expect(listen.mock.calls.map(([type]) => type)).not.toContain("scroll");
listen.mockRestore();
});
it("does not need the animation library", () => {
jest.isolateModules(() => {
// o pacote "motion" saiu do projeto: virtual, para o dublê valer mesmo sem ele no node_modules
jest.doMock(
"motion/react",
() => {
throw new Error(
"motion não pode ser carregado pela barra de rolagem",
);
},
{ virtual: true },
);
expect(() => require("./ScrollProgress")).not.toThrow();
});
});
});