S8 — Seção de vídeo da história na home de campanha #103

Merged

fsolla merged 2 commits from S8-s8-secao-de-video-da-historia-na-home-de-campanha into main

2026-08-19 22:23:07 +00:00

fsolla commented

2026-08-19 20:27:34 +00:00

Owner

S8 — Seção de vídeo da história na home de campanha

Closes #91

O que é

Nova seção "Nossa história" na home pública (jorgesolla1313.com.br), após "Bandeiras" e antes do rodapé: eyebrow + título + frame vertical 9:16 com o vídeo da trajetória do Dep. Jorge Solla (~1:40), nas cenas desktop (2 colunas, copy esquerda + frame 300px à direita, centralizados) e mobile (empilhado, frame full-width cap 420px) do rascunho aprovado.

Divergência aprovada em execução pelo humano

O plano de intenção previa asset self-hosted (WebM/AV1 + MP4/H.264 ≤ ~15 MB). Durante a execução o dono do produto decidiu embutir do YouTube (Short i_fbclWWC5o do canal do deputado — "18 de agosto de 2026", confirmado como o vídeo da história; cada play embutido conta view no canal):

iframe youtube-nocookie (LGPD), loading="lazy" nativo (zero bytes até o frame se aproximar do viewport), playsinline, allowfullscreen, title a11y, allow com compute-pressure (silencia o console.error do player do YouTube — o guard do e2e falha em console.error)
CTA "Assistir à história" rola até o player (play cross-origin não é disparável — decisão documentada)
encodes one-off H.264/AV1 + poster (foto JOA00327 escolhida pelo humano) ficam como artefato local gitignored em data/encode/ — fallback pronto se um dia se voltar a self-hosted
Zero schema/migration/Consent; nenhuma seção existente tocada

e2e

Novo teste: posição (após bandeiras, antes do footer), copy do rascunho, atributos do embed (src nocookie+ID+playsinline, lazy, allow/autoplay, allowfullscreen, title), CTA → viewport, layout desktop (2 colunas, centro vertical ≤2px), 9:16 mobile sem overflow
compute-pressure no allow + abort global do youtube-nocookie no fixture e2eTest.ts (hermeticidade CI — mesma filosofia dos stubs de feed S2/S3)
Frontend e2e 20/20 local

Verificação

unit 2416 + int 791 verdes; tsc/lint/format/cycles/build verdes; knip = limitação P3 pré-existente (payload.config.ts)
/simplify: 3 revisores paralelos, todos absorvidos; 2 débitos deferidos no impl plan (rótulo do CTA se a assessoria reabrir copy; dedupe da classe do CTA quando S5 #33 terminar)

Arquivos

src/components/CampaignStorySection.tsx (novo)
src/app/(frontend)/(home)/page.tsx
tests/e2e/frontend.e2e.spec.ts + tests/e2e/fixtures/e2eTest.ts
docs/plans/secao-video-historia-home-impl.md, docs/changelog/2026-08-19-s8.md (+ agregado)
.gitignore (/data/encode/, /data/poster-candidates/)

## S8 — Seção de vídeo da história na home de campanha Closes #91 ### O que é Nova seção "Nossa história" na home pública (jorgesolla1313.com.br), após "Bandeiras" e antes do rodapé: eyebrow + título + frame vertical 9:16 com o vídeo da trajetória do Dep. Jorge Solla (~1:40), nas cenas desktop (2 colunas, copy esquerda + frame 300px à direita, centralizados) e mobile (empilhado, frame full-width cap 420px) do rascunho aprovado. ### Divergência aprovada em execução pelo humano O plano de intenção previa asset self-hosted (WebM/AV1 + MP4/H.264 ≤ ~15 MB). Durante a execução o dono do produto decidiu **embutir do YouTube** (Short `i_fbclWWC5o` do canal do deputado — "18 de agosto de 2026", confirmado como o vídeo da história; cada play embutido conta view no canal): - iframe `youtube-nocookie` (LGPD), `loading="lazy"` nativo (zero bytes até o frame se aproximar do viewport), `playsinline`, `allowfullscreen`, `title` a11y, `allow` com `compute-pressure` (silencia o console.error do player do YouTube — o guard do e2e falha em console.error) - CTA "Assistir à história" rola até o player (play cross-origin não é disparável — decisão documentada) - encodes one-off H.264/AV1 + poster (foto JOA00327 escolhida pelo humano) ficam como artefato local gitignored em `data/encode/` — fallback pronto se um dia se voltar a self-hosted - Zero schema/migration/Consent; nenhuma seção existente tocada ### e2e - Novo teste: posição (após bandeiras, antes do footer), copy do rascunho, atributos do embed (src nocookie+ID+playsinline, lazy, allow/autoplay, allowfullscreen, title), CTA → viewport, layout desktop (2 colunas, centro vertical ≤2px), 9:16 mobile sem overflow - `compute-pressure` no `allow` + abort global do `youtube-nocookie` no fixture `e2eTest.ts` (hermeticidade CI — mesma filosofia dos stubs de feed S2/S3) - Frontend e2e 20/20 local ### Verificação - unit 2416 + int 791 verdes; tsc/lint/format/cycles/build verdes; knip = limitação P3 pré-existente (payload.config.ts) - /simplify: 3 revisores paralelos, todos absorvidos; 2 débitos deferidos no impl plan (rótulo do CTA se a assessoria reabrir copy; dedupe da classe do CTA quando S5 #33 terminar) ### Arquivos - `src/components/CampaignStorySection.tsx` (novo) - `src/app/(frontend)/(home)/page.tsx` - `tests/e2e/frontend.e2e.spec.ts` + `tests/e2e/fixtures/e2eTest.ts` - `docs/plans/secao-video-historia-home-impl.md`, `docs/changelog/2026-08-19-s8.md` (+ agregado) - `.gitignore` (/data/encode/, /data/poster-candidates/)

fsolla added 1 commit 2026-08-19 20:27:34 +00:00