Visualize sua loja

Abra a visualização atual da vitrine e verifique páginas e layouts responsivos antes de publicar.

Caminho de entrada: Workspace → selecione uma loja → Vitrine

O que este guia cobre

Revise a vitrine atual dentro do Runner, mova-se entre suas páginas e verifique como ela se parece em layouts de desktop, tablet e telefone sem publicá-la.

Por que e quando usar Visualização

Use Visualização depois que o Runner cria ou altera a vitrine. É o lugar mais seguro para detectar cópia ausente, rotas quebradas, layouts móveis ruins ou seções inacabadas antes que os clientes as vejam.

A Visualização é separada da loja ao vivo. Uma página que parece correta aqui não prova que a URL pública, dados do catálogo, inventário, conexão de pagamento ou checkout funciona.

Disponibilidade e pré-requisitos

Abra um projeto com atividade de vitrine existente ou uma versão visualizável.
Se a página disser Nenhuma vitrine ainda, use o prompt nessa página para pedir ao Runner para construir a primeira versão.
Se disser Construindo a primeira versão de sua vitrine… ou Preparando visualização…, a visualização ainda não está pronta.
Alguns workspaces usam a vitrine mais recente baseada em checkpoint. Os controles de versão exatos podem variar com disponibilidade em estágios.

Quando os cartões condicionais de versão da conversa estão habilitados, selecionar a imagem da vitrine ou Visualização em um cartão de trabalho concluído abre a versão pronta criada por essa tarefa. Ela pode ser histórica, e não a mais recente. Em um projeto mais antigo sem histórico de versões salvo, Visualização no cartão de trabalho mais recente da vitrine abre a visualização ao vivo atual. Verifique os rótulos v…, Versão Atual e Publicado, quando disponíveis, antes de editar ou iniciar a publicação.

Uma tarefa concluída ou uma compilação bem-sucedida do código-fonte não significa, por si só, que a Visualização foi atualizada. O Runner promove a vitrine concluída depois que a tarefa termina. Se essa promoção falhar, a Visualização mantém a versão anterior bem-sucedida — ou não mostra nenhuma visualização compilada quando ainda não existe uma —; portanto, confirme a versão visível e o resultado da visualização.

Abra Visualização

Abra seu workspace do Runner.
Selecione a loja que deseja revisar.
Selecione Vitrine na navegação do projeto.
Aguarde até que a versão atual apareça na área de visualização.

Se o projeto não tiver vitrine ainda:

Digite o que você quer em Descreva a loja que você quer construir….
Selecione Começar a construir ou pressione Enter sem Shift.
O Runner cria uma conversa e envia essa descrição como a primeira solicitação.
Se a criação falhar, a descrição permanece no campo para que você possa tentar novamente.

Controles de visualização

Controle	Por que você o usa	O que acontece quando você o seleciona
Voltar	Retorne à página anterior visitada dentro da visualização.	A visualização se move para trás em seu próprio histórico de página. Não sai do seu projeto do Runner.
Avançar	Revise uma página após voltar.	A visualização avança quando uma entrada de histórico posterior existe.
PC / Pad / Telefone	Verifique layouts responsivos.	Cada seleção alterna o quadro de visualização para o próximo tamanho de dispositivo. Não altera a vitrine ao vivo.
Campo de caminho, como `/`	Abra uma rota de vitrine conhecida.	Selecione o caminho, digite outro caminho no mesmo site de visualização e pressione Enter. Endereços inválidos ou externos são ignorados.
Atualizar	Recarregue a visualização atual após uma mudança ou renderização travada.	O Runner recarrega a página visível e limpa a seleção do Modo de Design ativo e a sessão de desfazer/refazer. Salve as alterações de design pendentes primeiro.
Abrir em nova guia	Revise a visualização com mais espaço.	O Runner abre esta URL de visualização em outra guia do navegador. Esta ainda é uma visualização, não prova de uma loja publicada.
Rótulo de versão, como v1 · Atual	Identifique o que você está revisando.	O rótulo distingue a versão atual mais recente de uma visualização histórica.
Modo de Design	Comece a edição visual.	O Runner abre o workspace de design quando a versão mais recente é elegível.
Histórico de Versão	Compare versões anteriores de vitrine.	O Runner abre a lista de versão sem alterar a vitrine atual.
Abrir editor de código	Inspecione ou edite a fonte da vitrine quando este controle avançado estiver disponível.	O Runner abre o diálogo Editor de código em altura total. Fechá-lo retorna o painel Vitrine para Visualização; verifique o resultado visível lá.
Moeda / Ganhe créditos grátis	Abra a oferta de referência.	O Runner abre o diálogo de referência; nenhum crédito é ganho apenas abrindo-o.
Contagem de crédito / Atualizar	Revise opções de crédito, plano ou uso.	O Runner abre um popover cujas ações disponíveis podem levar ao Faturamento ou Uso do workspace.
Publicar, Publicar Alterações ou Republicar	Inicie o fluxo de publicação apropriado para o estado atual.	O Runner executa verificações de acesso e prontidão antes de qualquer publicação começar.

Revise uma página de vitrine por página

Comece em / e digitalize o cabeçalho, área de anúncio, herói, produtos em destaque, seções e rodapé.
Selecione cada link de navegação visível. Confirme se o destino aparece e o caminho de visualização muda conforme esperado.
Abra uma página de produto da vitrine. Confirme se seu título, mídia, preço, opções, disponibilidade e controle de compra são visíveis.
Use o campo de caminho para rotas importantes que não estão vinculadas da página atual.
Alterne entre PC, Tablet e Telefone. Procure por conteúdo recortado, controles sobrepostos, texto ilegível e rolagem horizontal.
Selecione Atualizar apenas após salvar as alterações do Modo de Design.
Registre qualquer problema no chat do Runner com o caminho da página, tamanho do dispositivo e resultado esperado.

Estados, limites e solução de problemas

O que você vê	Significado	O que fazer
Nenhuma vitrine ainda	O Runner não encontrou atividade de vitrine existente nem uma versão visualizável salva.	Peça ao Runner para criar a vitrine.
Construindo a primeira versão…	A primeira versão ainda está sendo preparada.	Acompanhe o progresso da tarefa e aguarde um resultado terminal.
Preparando visualização…	O Runner está iniciando a visualização selecionada.	Mantenha a página aberta; use Atualizar apenas se o estado parar de progredir.
Falha ao carregar a visualização para esta versão	A versão selecionada não pôde ser exibida.	Retorne à versão atual, atualize ou relate a versão e o erro ao Runner.
Reconectando visualização	O Runner perdeu a conexão de visualização e está tentando novamente.	Mantenha o projeto aberto e acompanhe a contagem de tentativas. Se não conseguir recuperar, reconecte o workspace.
Barra de erro de visualização com Corrigir	A visualização relatou um erro que o Runner pode inspecionar.	Selecione Corrigir ou Corrigir erro para enviar o diagnóstico exibido ao Runner. Use Mostrar mais para expandir detalhes e Descartar apenas para ocultar a mensagem.
Um controle está desabilitado	A visualização não suporta essa ação no momento, o espaço de trabalho está desconectado ou o Runner está trabalhando.	Aguarde o Runner, reconecte o espaço de trabalho se solicitado ou retorne à versão pronta mais recente.
A visualização parece correta, mas a loja ao vivo não	As alterações não foram publicadas ou você está visualizando versões diferentes.	Verifique o rótulo de versão e, em seguida, use Publicar Alterações.