ProofShot: Проверка браузера для ИИ-агентов программирования

ProofShot — это кроссплатформенный CLI с открытым исходным кодом, который даёт ИИ-агентам для программирования возможность проверять создаваемые ими UI-функции, записывая сессии браузера, делая скриншоты и собирая ошибки. Он решает проблему, когда агенты пишут код, но не могут увидеть, как он на самом деле выглядит в браузере, или обнаружить проблемы с вёрсткой и ошибки консоли.

Как это работает

Инструмент следует трёхэтапному рабочему процессу: запуск, тестирование, остановка. ИИ-агент управляет браузером с помощью команд agent-browser, в то время как ProofShot записывает сессию.

Базовое использование:

proofshot start --run "npm run dev" --port 3000
# агент переходит по страницам, кликает, делает скриншоты
proofshot stop

Подробный пример рабочего процесса:

# 1. Запуск — открыть браузер, начать запись, захватить логи сервера
proofshot start --run "npm run dev" --port 3000 --description "Проверка формы входа"

2. Тестирование — ИИ-агент управляет браузером
agent-browser snapshot -i  # Просмотр интерактивных элементов
agent-browser open http://localhost:3000/login  # Переход
agent-browser fill @e2 "[email protected]"  # Заполнение формы
agent-browser click @e5  # Клик по кнопке отправки
agent-browser screenshot ./proofshot-artifacts/step-login.png  # Захват доказательства
3. Остановка — объединение видео, скриншотов и ошибок в артефакты доказательств
proofshot stop

Ключевые особенности

• Работает с любым ИИ-агентом для программирования, который может выполнять команды оболочки (Claude Code, Cursor, Codex, Gemini CLI, Windsurf, GitHub Copilot и т.д.)
• Упакован как навык, чтобы ИИ-агенты понимали, как его использовать
• Построен на основе agent-browser от Vercel Labs (описывается как "намного лучше и быстрее, чем Playwright MCP")
• Не является фреймворком для тестирования — не принимает решения о прохождении/провале, а только предоставляет доказательства
• Генерирует автономные HTML-файлы с видео, скриншотами и логами
• Может загружать артефакты в PR на GitHub в виде встроенных комментариев с помощью proofshot pr

Установка и настройка

npm install -g proofshot
proofshot install

Первая команда устанавливает CLI и agent-browser (с headless Chromium). Вторая обнаруживает ваши инструменты ИИ-программирования и устанавливает навык ProofShot на уровне пользователя — работает автоматически во всех проектах.

Выходные артефакты

Каждая сессия создаёт папку с меткой времени в ./proofshot-artifacts/, содержащую:

• session.webm — Видеозапись всей сессии
• viewer.html — Автономный интерактивный просмотрщик с ползунком прокрутки, временной шкалой и вкладками Console/Server log
• SUMMARY.md — Отчёт в формате Markdown с ошибками, скриншотами и видео
• step-*.png — Скриншоты, сделанные в ключевые моменты
• session-log.json — Временная шкала действий с метками времени и данными элементов
• server.log — Вывод stdout/stderr сервера разработки (при использовании --run)
• console-output.log — Вывод консоли браузера

Доступные команды

• proofshot install — Обнаружить инструменты ИИ-программирования и установить навык ProofShot
• proofshot start — Начать сессию проверки с браузером, записью, захватом ошибок
• proofshot stop — Остановить запись, собрать ошибки, сгенерировать артефакты доказательств
• proofshot exec — Пропускная команда

Инструмент полностью бесплатный и с открытым исходным кодом, без привязки к поставщику или зависимости от облака. Он предназначен для разработчиков, которые используют ИИ-агентов для создания UI-функций и хотят проверять результаты без ручного открытия браузера каждый раз.