Наш блог
Показать рубрики

Как автотесты упрощают жизнь. Selenium IDE - что это, как установить и использовать

Назад к списку статей
Как автотесты упрощают жизнь. Selenium IDE - что это, как установить и использовать
В этом посте мы расскажем о интересном и полезном инструменте Selenium IDE, почему мы его используем, какие проблемы он призван решать, и покажем вам как использовать Selenium IDE уже сегодня.

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

Например, как узнать, что в вашем интернет-магазине исправно работает оформления заказа? Нужно зайти в карточку какого-либо товара, положить его в корзину, перейти на страницу оформления заказа, заполнить данные заказа (фио, телефон, адрес, e-mail и тд), нажать кнопку "Оформить заказ", убедиться, что заказ оформлен. В следующий раз, чтоб проверить тот же сценарий, вам придется проделать эти действия снова. Но на самом деле, вам можно сделать это всего один раз, а Selenium IDE даcт возможность многократно повторить эти действия в автоматическом режиме.

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

Мы задумались об использовании Selenium IDE при разработке одного из наших проектов, когда проверки типа "а ничего ли не поломалось в других местах?" стали очень трудоемкими. Представьте, что на проекте добавление нового функционала может повлиять на отображение блоков информации на пяти разных типах страниц и вам нужно быть уверенными, что они по-прежнему работают так, как и раньше. Можете представить сколько времени занимал бы переход на каждую из пяти видов страниц, совершения там необходимых действий и проверки все ли исправно. Мы решили возложить эту ношу на автоматический тест!

После создания автотеста работа по проверке, которая вручную выполнялась минимум за 10-15 минут, теперь выполнялась только 60 секунд. Вот как выглядит запуск такого автотеста - вы нажимаете одну кнопку и Selenium IDE выполняет тест кейсы проверяя работоспособность сайта:

Unable to display content. Adobe Flash is required.

Установка Selenium IDE

Установка Selenium IDE занимает пол минуты. Напомним, что Selenium IDE - плагин для браузера Firefox. По этому для его установки нужно перейти по ссылке для скачивания плагина используя браузер Firefox - http://docs.seleniumhq.org/download/

В документации написано, что после перехода на страницу скачивания - браузер сам предложит установить плагин и попросит разрешения. Если же такого не произошло, то нужно проскроллить страницу до подзаголовка "Selenium IDE" и нажать на ссылку, следующую за словами "Download latest released version"

После этого браузер все же должен вывести окно для подтверждения вами установки плагина. Соглашайтесь и устанавливайте его, затем перезапустите браузер.

У вас появится новая иконка в правом углу панели браузера.

Если на нее кликнуть - выведется окно Selenium IDE. Поздравляем, плагин установлен!

Пример создания Test Suite и Test Case

Теперь разберемся как работать с Selenium IDE на базовых примерах. Возьмем сайт компании E-PAGES и допустим, что нам нужно постоянно контролировать две вещи:

  • что на странице контактов отображается правильный телефон
  • на странице услуг посетители могут видеть услугу создания интернет-магазина
Давайте приступим к написанию автотестов для этих задач!

Откройте окно Selenium IDE в браузере нажав на его иконку в панели. Вы должны увидеть такое окно:

В Selenium IDE существуют два основных структурных элемента: Test Case и Test Suite.
Test Case - это набор команд, которые указывает Selenium IDE как проводить тестирование вашего сайта. Чуть ниже будет описано как создавать такие команды для решения поставленных задач проверки телефона и услуги на разных страницах.
Test Suite - это набор из нескольких Test Case'ов. Призван для логической группировки тест кейсов в одном, скажем так, месте.

Начнем с проверки телефона. В поле Base URL впишите адрес тестируемого сайта - http://epages.su, а также перейдите в браузер и откройте сайт во вкладке Firefox. В данный момент Selenium IDE записывает все наши действия с сайтом. Об этом свидетельствует активированная красная кнопка записи в правом углу окна. Перейдите в окно с сайтом и кликните на пункт меню "Контакты". Selenium IDE запишет эти действия:

Если мы запустим этот тест кейс, то он автоматически перейдет на сайт epages.su и потом перейдет на страницу контактов. Половина задачи сделана, осталось добавить проверку на наличие номера телефона. Для этого нужно выделить пустую строку в области, где появились записи перехода по страницам и заполнить два поля Command и Target. В поле Command нужно вызвать функцию assertElementPresent, которая проверят есть ли искомый элемент на странице. А в поле Target нужно указать этот искомый элемент. Для этого нужно нажать на кнопку Select справа от поля, перейти на страницу сайта и выбрать мышкой номер телефона. После этих действий ваше окно должно выглядеть так:

Настало время проверить как работает этот тест кейс. Нажмите зеленую стрелку Play с тремя зелеными прямоугольниками. Эта кнопка запускает по очереди все тест кейсы в текущем наборе (Test Suite'е). Все строки нашего тест кейса должны окраситься в зеленый цвет, что означает, что наш тест успешно перешел на сайт E-PAGES, нашел там страницу контактов и правильный номер телефона на ней!

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

Перейдем к проверке нужной услуги создания интернет-магазина на странице "Услуги". Для этого создадим новый тест кейс - кликните правой кнопкой миши под существующим тест кейсом и выберите "New Test Case". Перейдите на главную страницу сайта. Затем в окне IDE включите запись действий нажав на красную кнопку справа вверху. Перейдите на страницу "Услуги" - Selenium IDE запишет эти действия, как и в первый раз. Теперь нам нужно проверить присутствуют ли на странице слова "Создание интернет-магазина". Для этого выделите пустую строку под последним записанным действием и заполните поля ниже такими данными:
Command - assertText
Target - css=div.service-list
Value - glob:*Создание интернет-магазина*
У вас должно получиться пирмерно так:

Запустим наши тест кейсы кнопкой Play и убедимся, что они успешно проходят - новый тест кейс переходит на страницу услуг и проверяет выведена ли там услуга создания интернет-магазина. Теперь сохраним второй тест кейс рядом с первым нажав кнопки Ctrl+S. Теперь у нас два тест кейса в разных файлах - пора объединить их в один Test Suite. Для этого нужно нажать Меню Файл - Save Test Suite. Сохранять его нужно рядом с тест кейсами в одной папке. Теперь при открытии нового окна Selenium IDE можно нажать Меню Файл - Open Test Suite и выбрать последний сохраненный файл - откроется сразу две тест кейса. Позже в этот Test Suite можно будет добавть следующие тест кейсы, которые будут тестировать другой функционал вашего сайта.

Заключение

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

Назад к списку статей
Подпишись на наш блог: