UI Verify

npx add-mcp 'https://uiverify.ai/api/mcp'

Revise uma compilação do UI Verify sem sair do seu terminal. O MCP do UI Verify permite que Claude Code, Cursor ou qualquer cliente MCP leia as alterações de uma compilação e aceite baselines.

Se um agente escreveu o pull request, um agente pode revisar as alterações visuais. O UI Verify expõe compilações por meio do Model Context Protocol, então um agente de codificação - Claude Code, Cursor ou qualquer cliente MCP - pode trazer as alterações de uma compilação para a conversa, olhar cada diff, ler o raciocínio do juiz de IA e aceitar as alterações pretendidas.

O que o agente pode fazer

• Listar as histórias alteradas de uma compilação e, em uma compilação aprovada, também as inalteradas.
• Buscar uma imagem de diff e o veredito do juiz de IA para qualquer história.
• Buscar um antes e depois recortado na alteração - um recorte por região alterada quando ela se moveu em vários lugares.
• Ver uma história que não mudou nesta compilação (idêntica à sua baseline).
• Classificar alterações em regressões reais vs reflow cosmético vs ruído de renderização.
• Resumir as regressões reais em um comentário no PR com imagens de antes/depois.
• Aceitar baselines em massa depois que você aprovar a direção.

Acabou de adicionar o MCP com claude mcp add? Reinicie a sessão do seu agente (ou recarregue a janela) para que as novas ferramentas sejam carregadas - um agente não consegue detectar um servidor MCP recém-adicionado no meio da sessão e relatará as ferramentas de revisão como indisponíveis até que isso aconteça.

URLs ou pixels: get_diff vs render_diff_image

Duas ferramentas retornam as imagens de uma história, para dois trabalhos diferentes. get_diff retorna URLs pré-assinadas para os PNGs de baseline, candidato e diff - use-as para baixar uma imagem para um arquivo ou vinculá-la em um comentário de PR. render_diff_image retorna os pixels reais inline, para que um modelo de visão possa olhar diretamente para eles.

render_diff_image precisa de um cliente MCP nativo que renderize conteúdo de imagem (Claude Code, Cursor). Enviado por um curl bruto, é inútil: a resposta é um bloco de imagem inline, não uma URL, então um script que procura um link não encontra nada. Para um pipeline de shell, use as URLs de get_diff.

Antes e depois em uma imagem

Chame render_diff_image com which: "before_after" para uma história alterada e obtenha a baseline e o candidato lado a lado, recortados na região alterada com um pouco de margem, para que, em uma alteração de uma linha, o agente veja o que mudou, não uma captura de tela de página inteira que precisa escanear. Quando uma história mudou em vários lugares distantes (um cabeçalho e um rodapé, por exemplo), ela retorna como um recorte por região empilhado de cima para baixo, em vez de uma imagem alta abrangendo o espaço entre eles.

Veja uma história que não mudou

Em uma compilação aprovada, toda história correspondeu à sua baseline, então não há diff para buscar. list_build_stories com status: unchanged lista essas histórias, e render_diff_image com um seletor de compilação e um storyId retorna a imagem atual de qualquer história - o candidato se mudou, caso contrário a baseline que ele correspondeu. É assim que um agente confirma "este componente parece correto, idêntico à baseline" mesmo quando nada mudou. Veja Baselines e branches.

Publique o veredito no pull request

Feche o ciclo onde os humanos estão. Depois que o agente classificou as alterações, peça para ele escrever um comentário no PR com as regressões reais, uma imagem de antes e depois para cada uma (vincule as URLs de baseline e candidato de get_diff) e um link para a compilação completa no painel. Um revisor lê o comentário em vez de clicar em cada história.

O ciclo

1. O agente abre o pull request e a verificação do UI Verify é executada.
2. O agente lista as alterações da compilação via MCP.
3. Ele lê cada diff e o veredito do juiz.
4. Ele aceita as alterações pretendidas e sinaliza qualquer coisa que não consiga atribuir ao diff para você analisar.

A habilidade de triagem de alterações visuais empacota todo esse ciclo em um único comando que seu agente pode executar.

Por que isso importa para UI escrita por agentes

O gargalo no pull request de um agente é a verificação, não a autoria. Colocar o diff e um veredito onde o agente já trabalha fecha o ciclo: o mesmo lugar onde o código foi escrito é onde seus pixels são verificados, sem troca de contexto para um painel no meio.

Continue

Habilidade relacionada

Trie uma compilação do seu agente

Classifique regressões reais vs ruído e aceite baselines, via MCP.

Teste visual para agentes

O UI Verify captura sua UI em cada pull request e um juiz de IA distingue uma alteração pretendida de uma regressão real. Veja como funciona.

Comece