Всем привет! Меня зовут Роман Мостафин.
Я тестировщик автоматизации в Clover и обычно пишу автоматические тесты, используя pytest + selenium. Недавно наша команда фронтенд-разработчиков начала использовать Cypress для написания UI-тестов в проекте «Умный Локомотив» для автоматизации регрессионного тестирования.
Я вызвался помочь им и вдохновился этой технологией.
В этой статье я расскажу о Cypress и о том, как создать с его помощью свой первый тест. Cypress — относительно новый фреймворк для написания тестов на Javascript. Он развертывает свой браузер и внедряет тесты в код страниц.
Кипарис имеет следующие преимущества:
поддерживает написание модульных, интеграционных и сквозных тестов, имеет хорошую документацию, имеет дружественный и интуитивно понятный интерфейс для запуска, просмотра и отладки, имеет полезные утилиты, упрощающие написание тестов.В результате мы имеем универсальный и удобный фреймворк для написания различных типов тестов.
Теория
Для написания теста вам понадобятся шесть основных функций.Давайте рассмотрим их и некоторые аргументы к ним, которые нужны для примера.
1. cy.visit()
Этот метод используется для перехода на страницу приложения.Принимает в качестве аргумента строку с адресом страницы приложения:
cy.visit(‘ http://test.app.com ’);
2. cy.get()
Этот метод используется для получения элемента из DOM веб-страницы.Принимает следующие аргументы: локатор элемента — адрес, по которому можно найти элемент; таймаут — время, в течение которого кипарис будет искать элемент на странице (по умолчанию 4 секунды).
cy.get(‘div[class=”topbar”]’, {timeout: 3000})
3. .
type() Метод .
type используется для заполнения текстовых форм и различных полей.
Имеет следующие аргументы: Текст, который будет введен, представляет собой текст в строковом представлении.
Также текст может содержать команды клавиатуры, выделенные фигурными скобками; timeout — задержка перед выполнением команды типа.
cy.get(‘input’).
type(‘Hello world’, {timeout: 3000})
4. cy.wait()
Этот метод используется для временной остановки выполнения команд. Также может использоваться для ожидания завершения HTTP-запросов.У него есть аргумент таймаута — фактическое время ожидания.
cy.wait(3000)
5. cy.fixture()
Этот метод используется для получения данных для теста.Принимает имя файла JSON в качестве входных данных.
6. cy.should()
Метод проверки выражения.Принимает в качестве входных данных следующие аргументы: команда сравнения – условие, по которому будет проверяться элемент; ожидаемый результат — ожидаемый результат проверки.
Упражняться
Возьмем форму авторизации Яндекса и в качестве примера проверим авторизацию с несуществующим логином и авторизацию с несуществующим паролем.Для этого нужно сделать предварительные приготовления: 1. Создайте новую папку проекта.
2. Перейдите в папку проекта и выполните команду для установки Cypress: npm install cypress --save-dev
3. Запустите Sypress командой: npx cypress open
4. После запуска убедитесь, что в каталоге проекта появилась следующая иерархия:
Теперь вам нужно создать приспособление.
Оно нам нужно для того, чтобы отделить тестовые данные от самого теста.
1. Создайте файл «cypressTest.json» в папке «fixtures» со следующим содержимым:
2. Далее в папке «интеграция» создайте файл «habr_cypress_test.spec.js»:
3. Описываем весь тестовый пример с помощью функцииdescribe:
4. Внутри функции описания мы создадим наши тесты.
Напишем название первого.
тест:
5. Следующий шаг — написать обращение к данным из фикстуры:
И, наконец, создаём сам тест, используя знания о функциях Cypress.
По аналогии создаем второй тест.
Заходим в приложение Sypress, находим наш тест и кликаем по его названию.
Далее откроется страница браузера, работающего под Cypress, и начнет выполняться тест: слева в отдельной колонке можно увидеть подробные этапы процесса.
Вам нужно подождать, пока тест запустится.
Поздравляем, вы написали свои первые тесты на Cypress!
P.S.
Хотелось бы поблагодарить нашу фронтенд-команду, и в частности Аделя Хаматова, за помощь в изучении Cypress на проекте.
Теги: #тестирование #Тестирование веб-сервисов #автоматизация тестирования #автоматизация qa #cypress #qa cypress
-
Как Сегодня Делают Игры В Браузере? Часть 3
19 Oct, 24 -
Использование Spi Из Python На Raspberry Pi
19 Oct, 24