Home

Автор: Кристин Джеквони (Kristin Jackvony)
Оригинал статьи: http://thethinkingtester.blogspot.com/2018/07/cross-browser-testing.html
Перевод: Ольга Алифанова

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

Браузерное равенство сейчас значительно улучшилось по сравнению с ситуацией двух-трехлетней давности, но время от времени все равно сталкиваешься с различным поведением приложения в разных браузерах. Вот примеры различий, с которыми сталкивалась я:

• Страница отлично скроллится в одном браузере, но вообще не скроллится в другом, или панель скролла не появляется.
• Кнопка правильно работает в одном браузере, но не работает в другом.
• Изображение отображается в одном браузере, но не отображается в другом.
• Страница автоматически обновляется в одном браузере, а в другом – нет, заставляя пользователя полагать, что данные не обновлены.

Ниже – ряд полезных советов, чтобы убедиться, что ваше приложение протестировано в разных браузерах.

Знайте, какой браузер наиболее популярен среди ваших пользователей

Несколько лет назад я тестировала B2B CRM-приложение. Разработчики нашей команды, как правило, использовали Chrome для проверки своей работы, и поэтому я тоже в основном тестировала в Chrome. Затем я обнаружила, что более 90% наших конечных пользователей пользовались приложением через Internet Explorer 9. Это, безусловно, изменило фокус моего тестирования! С тех пор я убеждалась, что каждая новая фича протестирована в IE9, и что полный регресс прогоняется под IE9 перед каждым релизом.

Выясните, какие браузеры наиболее популярны среди ваших пользователей, и убедитесь, что каждая фича протестирована в них. Это не значит, что вам нужно глубоко тестировать в каждом – но при каждой новой фиче и при каждом новом релизе вам нужно убедиться в наличии всех компонентов интерфейса в наиболее популярных браузерах.

Изменяйте масштаб ваших браузеров

Иногда браузерная проблема неочевидна сходу, потому что появляется только при использовании небольшого окна. Как профессионалы, мы зачастую наслаждаемся большими мониторами. Это прекрасно, потому что позволяет нам держать открытыми несколько окон и просматривать страницу целиком – но зачастую это значит, что мы упускаем баги, с которыми столкнутся конечные пользователи.

Эти пользователи, скорее всего, не пользуются огромными мониторами. В связи с этим всплывают такие проблемы, как отсутствие вертикального или горизонтального скролла, или его неверная работа, отсутствие масштабирования текста, уплывающего за страницу и становящегося невидимым, или отсутствие картинок (или же они занимают на странице чересчур много места).

Убедитесь, что проверка на разный масштаб страниц встроена в каждый тест-план для каждой новой фичи, и не забудьте добавить его в регрессионный набор. Выясните, каков минимально поддерживаемый размер окна, и тестируйте вплоть до него, с вариациями по горизонтали и вертикали.

Доверьте каждый браузер разным тестировщикам

В ходе регрессионного тестирования есть легкий способ убедиться, что вы покрыли все браузеры – назначьте на каждый браузер разных тестировщиков. К примеру, если их трое в команде, включая вас – прогоните набор тестов в Chrome и Safari, второй коллега сделает это в Firefox, а третий – в Internet Explorer и Edge. При следующем прогоне вы можете обменяться браузерами, и увидеть каждый из них свежим взглядом.

Ожидайте перемен после обновлений браузера

Может случиться такое, что то, что отлично работало, внезапно перестает правильно функционировать после выхода новой версии браузера. Также возможно, что фича, отлично выглядевшая в последней версии браузера, не работает в предыдущей версии. Многие браузеры – например, Chrome и Firefox – настроены на автоматическое самообновление после каждого релиза, но некоторые пользователи могли выключить эту настройку, поэтому нельзя предполагать, что все и каждый пользуются последней версией. Тут может помочь отдельная тест-машина с браузерами предпоследних версий – так можно найти различия между старой и новой версиями браузеров.

Используйте визуальную валидацию в ваших автотестах

В целом автоматизированные тесты UI концентрируются на присутствии элементов на странице. Это отлично подходит для функционального тестирования, но присутствие элемента не сообщает о том, правильно ли он отображается на странице. И тут в игру вступают визуальные инструменты тестирования – например, Applitools. Он координируется с инструментами тестирования UI, такими, как Selenium, и добавляет визуальную компоненту в валидацию тестов. При первом прогоне тестов Applitools "учится", чего ожидать от страницы. При всех последующих прогонах он будет делать снимок экрана и сравнивать его с эталоном. Если что-то не загружено или неверно отображается, тест упадет. Это отличный инструмент для кросс-браузерного тестирования, потому что его можно научить ожидать различных результатов для каждого отдельного типа и версии браузера, а также для разных размеров экрана.

Браузерные различия могут сильно повлиять на пользовательский опыт! Если у вас есть ручные и автоматизированные системы проверки расхождений, вы можете легко убедиться, что пользователь не пострадает, затратив минимум усилий.

Обсудить в форуме