Testes de regressão e white-label: como testar N temas sem perder a sanidade
O white-label multiplica os temas por cliente, breakpoint e idioma. Só a regressão automatizada permite adicionar um tema sem dívida de QA.
Ler mais →Detecção visual — Todos os artigos e tutoriais
14 artigos
A detecção visual não se resume a comparar duas imagens pixel a pixel. Conforme o tipo de defeito visado, os algoritmos e os limiares diferem: uma deriva sutil de cor (token mal resolvido, conversão sRGB / P3) exige uma comparação perceptual; um deslocamento de layout (flexbox quebrado, margem duplicada) é melhor visto por uma análise estrutural; um problema de tipografia (fonte de fallback carregada no lugar da principal) exige atenção particular à renderização sub-pixel. E tudo muda novamente em modo responsive ou dark mode, onde cada breakpoint multiplica a superfície a cobrir.
Esta página reúne os artigos que esmiúçam os tipos de regressões visuais detectáveis e a maneira de distingui-los: falsos positivos ligados ao anti-aliasing das fontes, regressões reais de contraste que passam despercebidas a olho nu, quebras de layout em viewport estreito, transições parciais do dark mode em que alguns componentes esquecem de se adaptar. Também abordamos as escolhas de algoritmos de comparação (pixel matching, SSIM, perceptual) com suas forças e seus pontos cegos respectivos. O Delta-QA se apoia em uma combinação dessas abordagens para minimizar o ruído mantendo-se rigoroso sobre as regressões reais; estes artigos explicam os princípios para entender o que uma ferramenta de teste visual pode — e não pode — detectar de maneira confiável.
Testes de regressão e Tailwind CSS: por que a abordagem utility-first exige verificação de renderização
tailwind.config.js global, purge agressivo, atualizações maiores: por que o Tailwind quebra silenciosamente e como a regressão protege suas páginas.
Ler mais →
Testes de regressão responsive mobile: por que o responsive design já não é suficiente
60% do tráfego web é mobile. Notches, barras dinâmicas, touch targets: o responsive design sozinho não garante a renderização real. Como testá-la.
Ler mais →
Testes de regressão multi-tenant: quando cada cliente tem sua própria renderização a verificar
SaaS multi-tenant: cada cliente tem sua marca. Como automatizar a regressão sem estourar o orçamento de QA? Guia completo.
Ler mais →
Teste visual e imagens retina: se você não testa em HiDPI, não vê o que seus usuários veem
Telas Retina e HiDPI exibem imagens borradas quando não são servidas em 2x ou 3x. O teste visual detecta automaticamente esses problemas.
Ler mais →
Animações CSS e teste visual: como parar de lutar contra falsos positivos
Animações e transições CSS criam falsos positivos em testes visuais. Conheça as estratégias: desativação, estabilização e comparação determinística.
Ler mais →O que é uma regressão CSS? Definição, exemplos e guia de detecção
Uma regressão CSS é uma mudança visual involuntária causada pela cascata, herança ou especificidade, invisível a linters e testes funcionais.
Ler mais →
Por que seu site aparece diferente em cada navegador (e como corrigir)
Descubra por que Chrome, Firefox e Safari renderizam seu site de forma diferente: motores, CSS não padrão, fontes e soluções para corrigir.
Ler mais →
Dívida técnica visual: definição, impacto e soluções para pagá-la
Dívida técnica visual: desalinhamentos CSS que degradam a qualidade. Descubra como o teste visual a detecta e reduz.
Ler mais →