Тестирование кроссбраузерности и кросплатформенности с помощью BrowserStack

Каждая команда при разработке сталкивается с необходимостью поддержания высокого уровня качества своего продукта. Несмотря на значительное время затратность, качества продукта является неотъемлемой составляющей его успеха в будущем.

Кроссбраузерность и кросплатформеннисть

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

Почему тестирование совместимости так важен?

“Картинка” – это первое, что видит пользователь, и мало кто останется на странице, если из-за особенностей конкретного браузера структура страницы отображается неправильно. И вот пользователь просто оставляет страницу, чисто из-за эстетический аспект, несмотря на высокий уровень качества функционала, производительности и интересный контент. А на самом деле верстка сайта возможно и было сделано на высоте, просто не протестирована в Internet Explorer, или при расширении 1366х768.

Аналогичная ситуация с отображением сайта на мобильных устройствах. Процент пользователей интернета с мобильных устройств ежегодно экспоненциально растет. Тестирование страниц с адаптивным дизайном часто еще важнее, чем тестирование кроссбраузерности на десктопных устройствах. Часто именно адаптивный дизайн скрывает в себе много артефактов, к тому же и многообразие мобильных устройств несопоставимы с многообразием десктопных, что также усложняет процесс тестирования. В такой момент мы сталкиваемся с вопросом: “Как организовать тестирование кроссбраузерности и кросплатформенности в процессе создания веб-продуктов?».

Как обычно организуется тестирование кроссбраузерности и кросплатформенности?

Обычно организация тестирования кроссбраузерности и кросплатформености происходит следующими способами или сочетанием нескольких из следующих способов:

  • Тестирование на физических устройствах. Этот способ может быть не всегда удобным, так как постоянно приходится работать на новой машине, для которой может не существовать привычного программного обеспечения, необходимого в процессе тестирования. Тестирование на физических устройствах является наиболее дорогим, стоимость отдельных мобильных устройств достаточно высока, регулярно появляются новые модели, у отдельного заказчика может появиться желание протестировать на чем “необычном”. К преимуществам данного способа следует отнести то, что он обеспечивает наиболее точные результаты тестирования.
  • Самостоятельная эмуляция необходимых устройств. Этот способ значительно дешевле предыдущего, поскольку расходуются только человеко-часы для эмуляции необходимых платформ. Компании не нужно будет регулярно покупать новые устройства или отводить отдельную комнату под них. Недостатками данного способа является то, что мы проверяем все же на эмуляторах, а не на физических машинах и поэтому иногда результат тестирования может быть невалидным. Также в случае выхода новой версии придется заново ее устанавливать и настраивать.
  • Третий способ – это использование онлайн-сервисов, предоставляющих доступ к физическим устройствам или эмуляторов необходимых нам платформ. Этот способ максимально нивелирует недостатки обеих предыдущих и его бесспорными преимуществами являются простота, дешевизна и удобство.

Тестирование с помощью BrowserStack

В настоящее время набирает популярность тестирования кроссбраузерности и кросплатформенности именно с помощью онлайн-сервисов, таких как Saucelabs и BrowserStack. Последний рассмотрим подробнее. Ключевыми преимуществами сервиса BrowserStack является простота, удобство, скорость работы, возможность тестирования на настоящих платформах. Для начала тестирования вам ничего не нужно устанавливать долго настраивать. Для повышения удобства, а также тестирования локально развернутых сайтов есть возможность установить плагин для браузера. Для Live тестирования, кроме последних и устаревших версий браузеров, доступны также и предрелизни версии браузеров IE, Mozilla Firefox, Google Chrome и Opera.

Более подробно о преимуществах тестирования в BrowserStack:

  • BrowserStack предоставляет возможность удаленного тестирования на физических устройствах;
  • снимки экрана, которые вы сделали – уже на вашем рабочем столе, где вы можете выделить с помощью любимого инструмента проблемные места и продолжить тестирование, без необходимости копирования / пересылки скриншотов с планшета или телефона на рабочий десктоп, кроме того, существует возможность делать, редактировать и обмениваться скриншотами в самом BrowserStack в пределах предварительно созданной команды;
  • быстрый переход от одной тестовой платформы к другой;
  • скорость тестирования в различных расширениях. BrowserStack имеет как перечень расширений на выбор, так и возможность тестирования респонсивности дизайна путем ручного изменения размера окна;
  • все браузеры уже с установленными инструментами разработчика, что значительно упрощает процесс тестирования и не заставляет вас тратить свое время на настройку тестовой среды.

Другие преимущества тестирования в BrowserStack

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

Сервис поддерживает функцию автоматизированного тестирования с помощью Selenium или JavaScript автоматизированных тестов, а также использование популярных инструментов непрерывной интеграции, таких как Jenkins и Travis, что значительно расширяет возможности его использования.

В целом данный инструмент необходим как тестировщикам, так и девелоперам, поскольку делает работу проще, удобнее и экономит время.

На данный момент каждый желающий может получить бесплатный доступ на 30 минут ручного кросс-браузерную тестирования. Поэтому если вы еще не пользуетесь данным инструментом, но хотите попробовать, то у вас есть прекрасная возможность это сделать.

Поделиться:
Читайте еще:  10 онлайн-профессий, которые можно освоить даже без высшего образования