Cross-browser testing — проверка того, что пользователь может выполнить нужные действия в поддерживаемых браузерах. Для QA важен результат сценария: войти, выбрать товар, отправить форму, скачать документ. Небольшая разница в отрисовке системной кнопки допустима, если требования не задают иное. Неработающая оплата в одном браузере — уже потеря функциональности.
Полный повтор всех тестов в каждом браузере быстро становится слишком дорогим. Поэтому сначала определяют поддерживаемое окружение, затем выделяют общие проверки и зоны, чувствительные к браузерной платформе. Так совместимость становится управляемым направлением тестирования.
Почему браузеры ведут себя по-разному
Браузер исполняет JavaScript, строит страницу из HTML и CSS, управляет хранилищем, разрешениями и сетевыми ограничениями. Реализация и поддержка возможностей различаются. На результат также влияют ОС, шрифты, настройки приватности и версия браузера.
Полезно разделять три вопроса: поддерживает ли платформа нужную возможность, правильно ли приложение её использует и предусмотрен ли запасной сценарий. Например, отсутствие доступа к буферу обмена не должно делать ручное копирование адреса невозможным, если такой вариант предусмотрен продуктом.
Как собрать браузерную матрицу
Матрица — список комбинаций браузера, версии, ОС и устройства, на которых команда обещает работу продукта. Основа — аудитория сервиса, договорённости поддержки, аналитика и цена отказа. Процент посещений помогает расставить приоритеты, но сам по себе не отменяет обязательства перед корпоративным клиентом.
- →Основной набор: окружения, где регулярно проходят критические пользовательские цепочки.
- →Дополнительный набор: менее частые комбинации для выборочных проверок совместимости.
- →Границы поддержки: минимальные версии и ожидаемое поведение за их пределами.
Записывайте конкретную установленную версию на момент прогона. Формулировка «проверено в последнем Chrome» через месяц перестаёт объяснять окружение дефекта.
Что знать о браузерных движках
На настольных платформах Chrome и современный Edge используют Chromium/Blink, Firefox — Gecko, Safari — WebKit. Проверки разных движков полезнее, чем несколько почти одинаковых запусков одного движка, но бренд браузера тоже влияет на настройки и интеграции.
Для iOS нельзя навсегда закреплять правило «все браузеры одинаковые». Apple допускает альтернативные движки в определённых региональных условиях, включая ЕС, при выполнении требований. Фактический движок проверяют для конкретной сборки, ОС и региона распространения. Название браузера на телефоне не доказывает, что он устроен так же, как его настольная версия.
Как распределить глубину проверок
В основном окружении проверяют функциональность подробно. В остальных поддерживаемых окружениях сначала проходят вход, главную бизнес-операцию и выход, затем добавляют браузерные риски изменённой области.
Если разработчик менял CSS модального окна, важны позиционирование, прокрутка, фокус и экранная клавиатура. Если менялась авторизация через внешний сервис, важнее перенаправления, cookie и возврат в приложение. История дефектов помогает уточнять набор: однажды сломавшийся сценарий становится обоснованным кандидатом в регрессию.
Какие зоны проверять отдельно
- →Формы: ввод, автозаполнение, отправка по Enter, системные элементы даты и выбора файла.
- →Навигация: прямой URL, обновление, кнопки назад и вперёд, открытие ссылки в новой вкладке.
- →Состояние: чистая сессия, повторный вход, восстановление после простоя, влияние cookie и хранилища.
- →Отображение: шрифты, переносы, закреплённые элементы, наложения и длинный контент.
- →Интеграции: загрузка и скачивание файлов, камера, clipboard и разрешения, если они нужны продукту.
Для каждой зоны проверяйте пользовательский результат, а не только отсутствие красной ошибки в Console.
Практический пример: форма заказа
Представь магазин с поддержкой настольных Chrome, Firefox, Safari и Safari на iPhone. После изменения адресной формы нужно проверить не все страницы магазина, а цепочку оформления и связанные браузерные особенности.
- 1.В каждом окружении открой чистую сессию, добавь тестовый товар и введи адрес вручную. Ожидается одинаковый состав полей и сохранение введённого адреса.
- 2.Повтори ввод через доступное автозаполнение. Ожидается обновление модели формы: кнопка продолжения работает, сервер получает фактические значения.
- 3.Отправь форму, вернись назад и обнови страницу. Ожидается согласованное состояние заказа без повторного создания операции.
- 4.На телефоне открой клавиатуру у последнего поля. Ожидается доступность кнопки продолжения и понятный способ скрыть клавиатуру.
Тестовые заказы выполняют в предназначенном окружении, где оплата не списывает реальные деньги.
Как локализовать несовместимость
Воспроизведите сбой на одинаковых данных и версии приложения. Сравните Network: отправился ли запрос, совпадают ли параметры, какой ответ пришёл. Затем изучите Console, вычисленные стили и состояние хранилища. Если API отвечает одинаково, а кнопка остаётся disabled только в одном браузере, расследование уже сужается до клиентской части.
Эмуляция устройства помогает быстро менять viewport и параметры ввода. Она не заменяет реальный браузер и ОС, особенно для клавиатуры, разрешений и системных окон. Автоматизированный WebKit также не следует считать полной проверкой пользовательского Safari.
Что включить в баг-репорт
Укажите браузер и версию, ОС, устройство, сборку приложения, локаль и условия сессии. Приложите минимальные шаги, ожидаемый результат, фактическое поведение и очищенные от секретов диагностические данные. Допишите, где сценарий проходит: сравнение успешного и неуспешного окружений часто полезнее длинной видеозаписи.
Типичные ошибки и выводы
Ошибка — считать совместимость проверкой одинаковых пикселей или прогонять одинаковый огромный набор без учёта риска. Другая крайность — проверить один Chromium и назвать это покрытием всех браузеров.
Хороший результат работы QA — явная матрица, пройденные критические сценарии, проверенные браузерные риски и понятные ограничения покрытия. Матрицу пересматривают вместе с аудиторией, технологиями продукта и историей проблем.