Веб-приложения должны работать на разных устройствах, операционных системах, браузерах и разрешениях экранов. Но тестировать все возможные комбинации — неэффективно. Матрица поддерживаемых окружений помогает оптимизировать процесс, охватив ключевые сценарии без лишних затрат времени.
В этой статье разберём:
- Что такое конфигурация тестового окружения.
- Как построить матрицу поддерживаемых окружений.
- Как добавить проверку разрешений экранов.
Что такое конфигурация окружения?
Конфигурация окружения — это сочетание параметров, в которых работает приложение:
- Тип устройства (десктоп, мобильное).
- Операционная система (Windows, macOS, Android, iOS).
- Браузер (Chrome, Safari, Firefox).
- Разрешение экрана (1920×1080, 390×844).
Пример:
- *Windows 11 + Chrome + 1920×1080* — одна конфигурация.
- *iOS 16 + Safari + 390×844* — другая.
Почему нельзя тестировать всё подряд?
Если взять:
- 3 браузера (Chrome, Firefox, Safari),
- 2 ОС (Windows, macOS),
- 2 разрешения (Full HD, Mobile),
то получится 12 комбинаций. А если добавить мобильные устройства и версии ОС/браузеров, число возрастёт до сотен.
Решение: использовать матрицу поддерживаемых окружений.
Как построить матрицу поддерживаемых окружений?
Шаг 1. Определите ключевые параметры
- Операционные системы (от популярных к редким):
Десктоп: Windows 11, Windows 10, macOS 13.
Мобильные: Android 13, iOS 16. - Браузеры (по статистике, например, из Яндекс.Радара):
Десктоп: Chrome, Яндекс.Браузер, Safari, Firefox.
Мобильные: Chrome, Safari, Android Browser.
Шаг 2. Определить конфигурацию окружения
Правила:
- Каждая ОС и каждый браузер должны быть проверены хотя бы один раз.
- Учитывайте ограничения (например, Safari работает только на Apple-устройствах).
Шаг 3. Добавьте разрешения экранов
Если в требованиях указаны разрешения:
- Десктоп: 1920×1080, 1366×768.
- Мобильные: 390×844 (iPhone), 360×800 (Samsung).
Как проверить?
- На реальных устройствах (если есть).
- В DevTools (эмуляция разрешений):
Откройте инструменты разработчика (Ctrl+Shift+I).
Выберите Toggle Device Toolbar → укажите нужное разрешение.
Пример готовой матрицы с разрешениями
Практические советы
- Приоритеты:
Сначала тестируйте самые популярные ОС и браузеры.
Затем — критичные для бизнеса (например, Safari для iOS, если у аудитории много iPhone). - Автоматизация:
Используйте Selenium Grid или BrowserStack для параллельного тестирования. - Документируйте:
Ведите таблицу с проверенными конфигурациями и найденными багами.
Вывод
✅ Матрица окружений экономит время, но покрывает ключевые сценарии.
✅ Проверяйте каждую ОС и браузер хотя бы в одной комбинации.
✅ Добавляйте разрешения через DevTools или реальные устройства.
Важно: Если в процессе тестирования находятся баги в непроверенных конфигурациях — расширяйте матрицу.
А как вы подбираете тестовые окружения? Делитесь опытом в комментариях! 🚀