Для чего тестировщику нужна панель разработчика браузера

Тренер курса «Погружение в тестирование. Jedi Point» Александр Астапченко расскажет как точно локализовать ошибки при тестировании веб-сайтов и сэкономить при этом время.

Панель (консоль) разработчика браузера нужна не только им самим, как многие думают – она может пригодиться и в тестировании веб-сайтов. 

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

Итак, начнем. Чтобы зайти в панель разработчика, необходимо открыть тестируемый веб-сайт и нажать на кнопку F12, после чего перед нами открывается следующая картина: 

Начнем мы со вкладки “Elements”.

В моей практике был следующий случай: мне необходимо было протестировать страницу веб-сайта. В техническом задании был указан цвет кнопки (в кодировке). Именно для таких проверок вкладка “Elements” просто необходима как воздух.

Как же нам убедиться, что цвет кнопки именно такой, который указан в ТЗ :

  • Открываем панель, нажав клавишу F12,
  • Кликаем по кнопке выбора элемента (указана стрелкой на скрине), 
  • Наводим курсор на нужный элемент и смотрим параметр “Color”.

Следующая вкладка которая нам может пригодиться, называется “Network”.

В моей практике был случай: я проходил негативный сценарий оформления заказа. При нажатии на кнопку “оформить заказ” ничего не происходило. Никаких ошибок на фронте (то есть видимой для пользователя части сайта) не отображалось. И вот тут-то помогла данная  вкладка. Повторно проходя данный кейс с открытой консолью, был обнаружен запрос с ошибкой 401. Система отработала верно, но ошибка должна была отображаться и конечным пользователям.

Не стоит забывать и про адаптив, так как сейчас активно серфят интернет и через мобильные девайсы. Крайне важно убедиться, что не будет проблем с версткой при просмотре сайта через мобильное устройство/планшет. В таких ситуациях нам поможет “Toggle device bar”.

Итак, открываем консоль и кликаем на кнопку “Toggle device bar”.

Мы  можем указывать вручную нужное разрешение или воспользоваться списком девайсов, которые уже есть в Google Chrome.

Также мы можем сами добавлять новые устройства в список, для этого необходимо нажать на кнопку “Edit”:

Для добавления необходимо установить чекбокс на нужное устройство, кроме того можно и создать устройство: 

  • Открываем консоль разработчика,
  • Переходим в настройки, кликнув по шестеренке,
  • Переходим во вкладку “Devices”,
  • Нажимаем на “Add custom device”,
  • Задаем имя устройства и нужное нам разрешение,
  • Нажимаем на кнопку Add.

Созданный девайс отображается в выпадающем списке.

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

Если вы хотите больше узнать о тестировании, приобрести знания и навыки, необходимые для работы джуниор-тестировщиком, записывайтесь на курс “«Погружение в тестирование. Jedi Point», а по промокоду jedi вам будет предоставлена скидка 10%.

И обязательно скачайте чек-лист “Что должен знать и уметь джуниор-тестировщик”, заполнив небольшую анкету.

Метки
ISTQB FL (2)IT (1)Java для тестировщиков (1)Jedi Point (12)JSON (1)kaizen (2)Pairwise Testing (1)QA (25)QualityLab (1)REST API (1)selenium (1)SOAP UI (1)softskills тестировщика (7)SQA Days-25 (1)Sql в тестировании (5)TestSuites (1)XML (1)xpath (1)Анна Палей (1)Исследовательское тестирование (3)История успеха (14)Курс тестирования для начинающих (7)Мнемоники в тестировании (1)Наталья Руколь (1)Нина Агеева (4)Обучение тестированию (13)ПОИНТ (46)Роман Буданов (3)Сессионное тестирование (1)ТЗ (1)Таблица решений (1)Тест-анализ (1)Тест-дизайн (6)Тест-кейс (1)Тест-стратегия (1)Тест-туры (1)Тестирование usability (5)Тестирование ПО (7)Тестирование игр (4)Тестирование мобильных приложений (4)Тест менеджмент (3)Чек-лист в тестировании по (4)Чит-лист в тестировании (2)автоматизация тестирования (2)автотесты (1)аудит проекта (1)баг (1)багнапродакшене (1)введение в тестирование (1)виды тестировния (2)граничные значения (1)декомпозиция (1)инструменты тестирования по (4)как надо тестировать (2)как стать тестировщиком (2)комбинаторика в тестировании (1)метрики тестирования (1)начать карьеру в IT (7)начинающий тестировщик (11)негативное тестирование (2)ограничения (1)организация тестирования (1)персонажи (1)планирование тестирования (1)профессия тестировщик (3)резюме (1)сертификация ISTQB FL (1)скринкаст (1)смена работы (2)сопроводительное письмо (1)тест-кейс (1)тестирование безопасности (1)тестирование веб (3)тестовая стратегия (1)удаленная работа (1)управление требованиями (4)фреймворк тестирования (1)
С 20.04 по 7.07, ОНЛАЙН Зарегистрироваться