В этом посте хотелось бы рассказать какие инструменты для тестирования сайтов в Chrome я использую каждый день.

Консоль разработчика

Некоторые тестировщики могут подумать, что она нужна только программистам, но на самом деле это очень мощный инструмент и для нас — тестировщиков.

Мои сценарии работы с консолью таковы.

тестирование сайтов

  • Мне нужно написать автотест, и чтобы найти нужный локатор для элемента, я пытаюсь посмотреть его класс, xpath или другие атрибуты.
  • Иногда чтобы активировать тот или иной элемент на сайте для тестирования, я использую небольшой скрипт на js. Вкладка console позволяет выполнять их.
  • После выполнения некоторых операций на вебсайте, всегда полезно посмотреть запросы которые отправляются на сервер в результате ваших действий. Чрезвычайно большое количество запросов это плохо, нужно стараться их уменьшить. Смотрите вкладку network.
  • Также это отличный инструмент для тестирования верстки на мобильных устройствах. Достаточно включить режим device mode, и Chrome поможет сэмулировать не только различные мобильные девайсы, но и урезать скорость соединения, как это бывает при использовании беспроводного интернета. Также есть возможность подставить фейковые данные о геолокации, это удобно при тестировании различных сервисов с учетом карт и маршрутов. В этом режиме можно провести тестирование юзабили мобильной версии вебсайта, а поддержка эмуляции сразу пары десятков устройств, сделает проверку еще более надежной.
  • Можно с легкостью отредактировать или удалить cookie. Вкладка resourses.
  • При установке плагина google analytics debugger можно смотреть в консоли ивенты аналитики или еще чего по-интереснее, например ошибки в коде. Про плагины для тестирования знают все,  можно поставить их десятки, постараюсь написать про них отдельную статью.

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

Открытие вкладки с мобильного устройства

тестирование

Впервые увидев эту фичу в действии, я был реально удивлен что такое возможно. Потом я сказал себе «это же Google, чему тут удивляться» и принялся использовать эту возможность в своих интересах.

Иногда бывает что сайт не выдает никаких ошибок на ПК или устройствах с большими дисплеями. Но обязательно показывает ошибку если вы например, смотрите его с мобильного браузера. Chrome позволяет подключить ваш андроид смартфон и продебажить сайт в прямо через него. Полное описание можно почитать тут. Если вкратце, то нужно подключить смартфон с установленным google chrome, открыть вкладку chrome://inspect на компьютере и все что происходит на вашем смартфоне будет проецироваться через консоль браузера на ваш компьютер. Плюс такого тестирования в том, что вы сможете посмотреть ошибки через, опять же, консоль разработчика, которая не доступна в Chrome для Android.

Есть еще много инструментов, к примеру браузерные плагины для тестирования, которые хотелось бы здесь описать, но про них в следующих постах.