UI Verify — MCP-сервер для Claude Code: что делает и как установить
Сервис визуального регрессионного тестирования интерфейса. Помогает агенту разбирать диффы скриншотов в PR и утверждать новые эталоны.
claude mcp add --transport http uiverify https://uiverify.ai/mcpЧто делает UI Verify
Сервер связывает кодинг-агента с облачной платформой визуального тестирования. Сервис сравнивает отрендеренные компоненты с эталонами из базовой ветки репозитория. Входящими данными служат сборки Storybook, дампы браузерных тестов Playwright и Vitest, а также каталоги готовых PNG-скриншотов мобильных приложений.
Агент вызывает инструменты get_build, render_diff_image и accept_build. Это позволяет отделить шум от реальных поломок вёрстки и сразу обновить эталонные снимки. Во время работы над кодом команда uiverify check даёт агенту возможность проверить конкретные истории Storybook без отправки промежуточных проверок в CI.
Для синхронизации с облаком обязателен ключ UIVERIFY_API_KEY с сайта uiverify.ai. Без доступа к удалённому адресу https://uiverify.ai/mcp агент не сможет загрузить снимки и запросить результаты проверки.
Какие задачи решает
- разобрать визуальные диффы интерфейса в пулл-реквесте
- проверить вёрстку отдельных историй Storybook до отправки в CI
- сравнить скриншоты мобильного приложения с базовой веткой
- утвердить обновлённый эталонный снимок прямо через агента
Примеры запросов агенту
- Проверь через UI Verify визуальные изменения в текущей ветке и покажи проблемные компоненты.
- Выполни uiverify check для историй кнопок и скажи, есть ли отличия от эталона.
- Утверди обновлённый эталон для экрана профиля через вызов accept_build.
Как установить UI Verify
Командой платформы: удалённый сервер
claude mcp add --transport http uiverify https://uiverify.ai/mcpКомандой платформы: удалённый сервер
codex mcp add ui-verify --url https://uiverify.ai/mcpФайл настроек
{
"mcpServers": {
"ui-verify": {
"url": "https://uiverify.ai/mcp"
}
}
}Файл настроек
{
"servers": {
"ui-verify": {
"type": "http",
"url": "https://uiverify.ai/mcp"
}
}
}Командой платформы: удалённый сервер
gemini mcp add -t http ui-verify https://uiverify.ai/mcpПо шагам, с командами для каждой платформы: Как подключить MCP-сервер: Claude Code, Codex, Cursor, VS Code, Gemini CLI и другие
Вопросы о UI Verify
Как установить UI Verify в Claude Code?
Выполните команду claude mcp add --transport http uiverify https://uiverify.ai/mcp. Для работы также потребуется экспортировать переменную окружения UIVERIFY_API_KEY.
Что делает MCP-сервер UI Verify?
Он предоставляет инструменты get_build, render_diff_image и accept_build для анализа визуальных диффов. Агент изучает пиксельные расхождения и принимает новые эталоны.
Какие типы тестов и снимков поддерживает сервис?
Сервис работает со сборками Storybook, захватами DOM из Playwright и Vitest через capture SDK, а также с директориями готовых PNG-изображений.
