Executive Summary
Ключевой инсайт: комбинация Playwright + Vision Model создаёт самое эффективное и дешёвое решение для UI-тестирования. Коммерческие инструменты (Meticulous.ai, Momentic, Applitools) используют этот же подход, но берут $$$. Своя реализация стоит в 10-100 раз дешевле.
«Most 'AI-powered' regression tools still rely on pattern recognition rather than true understanding. They can auto-generate tests or detect UI changes, but often miss business logic or critical edge cases.»
Решения на рынке
| Tool | Подход | Стоимость |
|---|---|---|
| Meticulous.ai | Запись сессий + replay | $$$ |
| Applitools | AI visual comparison | $$$$ |
| Momentic | Natural language → tests | Freemium |
| Mabl | Self-healing E2E | $$$ |
| Playwright + Vision | Скриншоты + AI анализ | ~$0.001/страница |
Архитектура решения
1. Playwright открывает страницу
2. Делает скриншот (desktop + mobile)
3. Vision model анализирует изображение
4. Возвращает структурированный отчёт
Модели:
• Gemini 3 Flash — $0.0001-0.001/анализ (дешёвый)
• Gemini Flash — fallback
• Claude Opus 4.6 — для сложных случаев
$0.001
стоимость тестирования одной страницы
Что проверяем
📐 Layout
Alignment, overflow, truncation, spacing — всё ли на своих местах
📖 Readability
Размеры шрифтов, контраст, hierarchy — читается ли текст
📱 Responsive
Как выглядит на mobile/tablet/desktop — нет ли обрезанных элементов
🐛 Console Errors
JS errors, failed requests — всё ли работает под капотом
🔗 Links
Broken links, dead clicks — куда ведут кнопки
♿ Accessibility
Color contrast, touch targets, ARIA — доступно ли всем
Инсайты из сообщества
🔥 Reddit: что реально используют QA-инженеры
«Glance (Morph LLM) — вместо генерации тестового кода просто тестирует preview URL напрямую. Открывает браузер, кликает, записывает видео. Нет кода — нет maintenance.»
🔥 Проблема коммерческих инструментов
«Most AI-powered tools rely on pattern recognition rather than true understanding. Они находят pixel changes, но пропускают semantic issues — например, когда "no data" выглядит как error state.»
🔥 Industry trend: Vision Fine-tuning
Automat обучила GPT-5.3 находить UI-элементы на экране. Success rate вырос с 16.6% до 61.7% (улучшение в 3.7x). Fine-tuning на скриншотах — новый стандарт.
Сравнение: Pixel Diff vs AI Vision
🖼️ Pixel Diff (Percy, Chromatic)
✅ Ловит любые визуальные изменения
✅ Точный контроль версий
❌ False positives (динамический контент)
❌ Не понимает семантику
❌ Требует baseline maintenance
✅ Точный контроль версий
❌ False positives (динамический контент)
❌ Не понимает семантику
❌ Требует baseline maintenance
🧠 AI Vision (наш подход)
✅ Понимает layout issues
✅ Находит semantic problems
✅ Не нужны baseline images
✅ Дешевле в 100x
❌ Может пропустить subtle changes
✅ Находит semantic problems
✅ Не нужны baseline images
✅ Дешевле в 100x
❌ Может пропустить subtle changes
Рекомендация: использовать AI Vision для semantic analysis + Pixel Diff только для критичных stable components.
Роадмап внедрения
| Фаза | Срок | Что делаем |
|---|---|---|
| MVP | Неделя 1 | Playwright + Gemini Flash, desktop only, базовый отчёт |
| Core | Неделя 2 | Mobile + tablet, Lighthouse a11y, console errors, markdown reports |
| Advanced | Неделя 3+ | CI/CD integration, Slack notifications, visual regression |
Ссылки и ресурсы
🎭 Playwright
playwright.dev — browser automation
🔍 Meticulous.ai
meticulous.ai — zero-effort testing
🤖 Momentic
momentic.ai — natural language testing
👁️ Applitools
applitools.com — AI visual testing
☠️ DeathScore
Валидируй стартап-идеи за 2 минуты — AI-анализ рынка, конкурентов и рисков
Проверить свою идею →