import { HERO_CAPTIONS } from "./hero-captions";

/*
 * Sem janela de rolagem sem texto no mergulho do hero: o texto do hero sai de cena e as legendas entram uma depois da
 * outra (globals.css lê --from e --to de cada item). Aqui ficam as garantias sobre os trechos; o e2e de rolagem
 * (e2e/scroll.spec.ts) confere, no navegador, que nenhuma posição amostrada fica sem texto.
 */

/** O texto do hero some em `1 / 4,2` do progresso: `opacity: calc(1 - var(--hero-p) * 4.2)` em globals.css. */
const HERO_TEXT_GONE = 1 / 4.2;
/** Maior intervalo sem legenda entre duas: 0,1 de progresso são cerca de 100 px de rolagem. */
const MAX_GAP = 0.1;

describe("hero dive captions", () => {
  it("has three captions, each with a valid range, in the order of the scene layers", () => {
    expect(HERO_CAPTIONS).toHaveLength(3);
    for (const { from, to } of HERO_CAPTIONS) {
      expect(from).toBeGreaterThanOrEqual(0);
      expect(to).toBeGreaterThan(from);
    }
    for (let i = 1; i < HERO_CAPTIONS.length; i++) {
      expect(HERO_CAPTIONS[i].from).toBeGreaterThanOrEqual(
        HERO_CAPTIONS[i - 1].from,
      );
      expect(HERO_CAPTIONS[i].to).toBeGreaterThan(HERO_CAPTIONS[i - 1].to);
    }
  });

  it("starts the first caption before the text of the hero is gone", () => {
    expect(HERO_CAPTIONS[0].from).toBeLessThanOrEqual(HERO_TEXT_GONE);
  });

  it("leaves a short gap, at most 0.1 of the dive, between one caption and the next", () => {
    for (let i = 1; i < HERO_CAPTIONS.length; i++) {
      expect(
        HERO_CAPTIONS[i].from - HERO_CAPTIONS[i - 1].to,
      ).toBeLessThanOrEqual(MAX_GAP);
    }
  });

  it("keeps the last caption on stage past the end of the dive, until Projects covers it", () => {
    expect(HERO_CAPTIONS[HERO_CAPTIONS.length - 1].to).toBeGreaterThan(1);
  });
});