diliev1996/delyan-iliev-skills

Evidências de PR para Frontend

Grave a base de merge e o head do PR com fixtures idênticas, viewport e interações, e publique ambas as gravações como um único comentário no PR usando gh. O PR skill do repositório é responsável pelo corpo do PR. $SCRATCH indica o diretório temporário da sessão. Execute os scripts agrupados por seus caminhos absolutos.

Passos

1. Resolver as revisões. Leia baseRefName e headRefOid de gh pr view PR_URL --json baseRefName,headRefOid. Execute git fetch origin BASE_BRANCH pull/PR_NUMBER/head, depois git merge-base origin/BASE_BRANCH HEAD_SHA. Concluído quando ambos os SHAs são resolvidos localmente.
2. Compilar ambas as revisões. Concluído quando cada revisão tem uma pasta de saída compilada ou um servidor de desenvolvimento em execução, e sua origem corresponde ao seu SHA.
3. Escrever o fluxo em $SCRATCH, começando a partir do exemplo e seguindo a interface de fluxo abaixo.
4. Capturar com node scripts/capture.cjs FLOW "$SCRATCH/evidence". Quando falhar, seu erro nomeia a correção: o comando de instalação, uma navegação para fora do aplicativo ou um problema de destaque. Falhas de seletor também deixam failure.png e failure-aria.yml na pasta de saída. Corrija o fluxo e execute novamente. Concluído quando:
   • o comando sai com código 0;
   • cada entrada manifest.network é explicada (em uma execução simulada, cada uma é uma chamada não simulada);
   • comparison.png enquadra a mudança em ambas as fases;
   • video-contact-sheet.png mostra o cursor alcançando cada destino e o estado final mantido.
5. Publicar com node scripts/publish.cjs "$SCRATCH/evidence" PR_URL. Ele confirma que as evidências correspondem ao head atual do PR e à base de merge, publica comment.md com a comparação e o vídeo anexados, e verifica se o GitHub hospeda ambos. Reexecutá-lo para a mesma captura reutiliza esse comentário. Se gh auth status mostrar um login ausente, peça ao usuário essa etapa apenas. Se a publicação permanecer bloqueada, mantenha os artefatos e relate o erro exato. Concluído quando imprime a URL do comentário.
6. Vincular a URL do comentário na seção de evidências do corpo do PR. Concluído quando o corpo do PR vincula a URL que publish.cjs imprimiu para o head atual, substituindo qualquer link de evidência anterior.
7. Limpar os servidores e worktrees que você iniciou. Mantenha artefatos, cookies e arquivos de estado de armazenamento fora do controle de versão.

Interface de fluxo

Um módulo de fluxo exporta:

• description: a interação testada e se os dados são simulados ou reais. Ele se torna o texto do comentário.
• phases: duas entradas { label, revision, url | dir, run }, Antes e Depois. dir é uma pasta de saída compilada, servida pelo helper com fallback de rotas do cliente para index.html. url aponta para um servidor de desenvolvimento em execução.
• viewport (opcional, padrão 1440×900).
• setup(page, phase) (opcional): executa antes da primeira navegação de cada fase, em uma página com rotas, scripts de inicialização, cookies e armazenamento redefinidos. Registre mocks, seeds e fixtures de autenticação aqui. As rotas correspondem da mais recente para a mais antiga, então registre um aborto genérico antes dos mocks específicos.
• warmup(page, phase) (opcional): executa não gravado após o carregamento da página, por exemplo, enquanto um servidor de desenvolvimento compila.
• run(page, tools): realiza a interação e afirma o estado esperado de cada fase, usando tools.click(locator), tools.point(locator) e tools.highlight(locator, label?). Cada fase precisa de pelo menos um destaque, ainda visível quando run retorna.

Saídas: before.png, after.png, comparison.png, comparison.webm, video-contact-sheet.png (o vídeo como quadros com carimbo de data/hora), manifest.json e comment.md.

Aplicativos autenticados. O Chromium do helper inicia sem logins: sessões de navegador em outros lugares e a autenticação do gh não o alcançam. Reproduza o estado autenticado em setup; o exemplo mostra duas maneiras. Se forem necessárias evidências ao vivo autenticadas e o contexto de captura não puder alcançá-las, relate a limitação e as verificações realmente realizadas.

Após alterar os scripts ou atualizar o Playwright, execute node scripts/capture.test.cjs. Defina CAPTURE_TEST_OUTPUT=DIR para manter seus artefatos e PLAYWRIGHT_MODULE=PATH para testar outra instalação do Playwright.