Preview
Preview permite olhar o resultado gerado sem transformar a revisão em troca constante de ferramentas.
O que revisar
- Layout e responsividade.
- Estados e ações principais.
- Se o resultado corresponde ao pedido.
Preview não é teste automático
Ele ajuda a enxergar o resultado. Terminal, diagnósticos e revisão continuam necessários quando a tarefa exige confirmação técnica.
Preview antes da entrega
Preview é a ponte entre código e experiência final. Ele deve mostrar HTML, UI ou artefato no estado em que o usuário realmente verá.
- Use preview para detectar layout quebrado, assets faltando e comportamento visual que testes de sintaxe não capturam.
Visão prática
Considere o fluxo concluído quando o resultado pode ser reaberto, revisado e entendido sem depender da memória de quem executou a tarefa. Isso é especialmente importante em Preview, onde o contexto pode atravessar mais de uma etapa.
Comece por “O que revisar”, confirme o estado visível e avance para “Preview não é teste automático” apenas quando a etapa anterior estiver estável. Em Preview, pular contexto costuma gerar mais retrabalho do que velocidade.
No Giorgio Code, isso também significa distinguir o que foi apenas proposto, o que foi escrito em arquivo e o que foi realmente executado ou verificado.
- confirme o estado antes de iniciar a próxima ação
- mantenha arquivos, sessão e contexto ligados ao mesmo objetivo
- trate mensagens de erro como dados de diagnóstico, não como detalhe visual
Fluxo mínimo
Nem todo caso precisa da configuração mais avançada. Prefira o caminho mínimo que resolve o objetivo e aumente complexidade somente quando Preview realmente exigir mais contexto, controle ou verificação.
Imagine uma tarefa real em que Preview deixa de ser uma opção de menu e passa a decidir a qualidade da entrega. Faça uma primeira passagem curta, observe o retorno do sistema e só então aumente escopo, quantidade de arquivos ou duração da sessão.
Escalando com segurança
Use Preview como uma referência de operação, não como uma tela isolada. A própria proposta da página é: Preview permite olhar o resultado gerado sem transformar a revisão em troca constante de ferramentas. O ganho aparece quando isso se conecta ao que vem antes e ao que precisa acontecer depois.
- trate mensagens de erro como dados de diagnóstico, não como detalhe visual
- revise a saída no mesmo ambiente em que ela será usada
- confirme o estado antes de iniciar a próxima ação
Como saber que funcionou
Comece por “O que revisar”, confirme o estado visível e avance para “Preview não é teste automático” apenas quando a etapa anterior estiver estável. Em Preview, pular contexto costuma gerar mais retrabalho do que velocidade.
Considere o fluxo concluído quando o resultado pode ser reaberto, revisado e entendido sem depender da memória de quem executou a tarefa. Isso é especialmente importante em Preview, onde o contexto pode atravessar mais de uma etapa.
Mapa operacional: Preview
Nesta página, a referência completa cobre servidor local, navegador, screenshot, DOM, interação e breakpoints. O objetivo não é decorar nomes de controles; é entender entradas, estado, efeitos colaterais, falhas recuperáveis e a evidência que confirma a conclusão.
- confirme o estado inicial antes de executar a ação
- identifique quais dados ou arquivos a superfície realmente possui
- trate loading, vazio, erro, retry e reentrada como comportamento principal
- verifique o resultado no mesmo contrato que o usuário consegue observar
Casos de borda de Preview
A versão robusta desta função continua coerente quando a rede atrasa, a sessão muda, o conteúdo está vazio, o usuário repete a ação, o viewport encolhe ou uma dependência externa deixa de responder. Esses estados fazem parte da documentação porque também fazem parte do produto.