Введение в Cypress
Cypress - это бесплатный инструмент для тестирования внешнего интерфейса с открытым исходным кодом, устанавливаемый локально. Его могут использовать разработчики или инженеры по контролю качества, которые создают веб-приложения с использованием фреймворка JavaScript.
Можно выполнить модульное тестирование, интеграционное тестирование и сквозное тестирование, написав тестовый пример с помощью Cypress. Используя кипарис, можно протестировать все, что работает в браузере.
Особенности Cypress
Запись видео и снимков экрана. Cypress полезен для записи тестов или для создания снимков экрана при сбое при запуске из интерфейса командной строки.
Простая отладка: Cypress отображает легко читаемые ошибки и делает отладку простой и быстрой. Тесты, написанные на Cypress, легко читать и понимать.
Контроль сетевого трафика: Можно отключить контроль сетевого трафика, как ему нравится, без участия сервера.
Тесты в реальном времени. В режиме реального времени можно наблюдать за выполнением тестов по мере разработки приложения.
Установка и открытие Cypress
Cypress - это приложение для запуска тестов с графическим интерфейсом пользователя, которое устанавливается на компьютер. Для установки Cypress нет других зависимостей, таких как сервер или драйверы. Установить Cypress через npm очень просто. Просто нужно перейти по пути к проекту и установить Cypress локально, выполнив следующую команду.
$npm install cypress --save-dev
Нам просто нужно убедиться, что мы уже запустили npm init или у нас есть папка node_modules или файл package.json в корне проекта, чтобы гарантировать, что cypress установлен. в правильном каталоге.
Или, если мы не используем node.js или npm в проекте, мы можем скачать Cypress прямо с сайта. При прямой загрузке всегда будет последняя версия. Нужно вручную разархивировать и дважды щелкнуть. Cypress будет работать без установки каких-либо зависимостей.
Если для установки использовался npm, Cypress будет установлен в каталог ./node_modules, а его двоичный исполняемый файл будет доступен из ./node_modules/.bin. Затем его можно вызвать из корня проекта одним из следующих способов:
Долгий путь с полным путем:
./node_modules/.bin/cypress openИли ярлык с использованием npm bin:
$(npm bin)/cypress open
При открытии средства запуска тестов cypress он покажет список файлов и папок каталога, из которого мы должны запустить файл js, указанный в папке интеграции, где записаны тестовые примеры.
Тестирование автоматизации веб-интерфейса с помощью Cypress
Я пробовал кипарис, чтобы автоматизировать фронтенд для проекта, над которым я работаю. Я автоматизировал несколько тестовых случаев в моем проекте с использованием кипариса, и несколько примеров приведены ниже:
Посещение URL: Можно посетить URL, используя метод cypress cy.visit ().
Это приведет к посещению указанного URL: http://localhost/hq
Получить элемент DOM: элемент (ы) DOM можно получить с помощью селектора, используя метод cypress cy.get ().
Это получит последний элемент DOM класса .toolkit-image-container и щелкнет по нему.
Это позволит получить первый элемент из раскрывающегося списка с классом .fb-page-inner-container ›.fb-img-container и щелкнуть его.
Подтвердить, что кнопка отключена. Утверждение для элемента (ов) DOM можно выполнить с помощью метода .should ().
Это получит saveToolkitBtn и проверит, есть ли у него класс disabled.
Это будет утверждать, что введенное значение не является «ABC».
Печать сообщения. Можно распечатать сообщение в журнале команд cypress с помощью метода cy.log ().
Это напечатает сообщение в команде журнала как «Успешный вход в систему».
Каждый цикл в cypress: можно перебирать массив или объекты со свойством length, используя функцию each ().
Это будет повторяться для каждого элемента, имеющего класс .fb-page-wrapper ›.fb-page-followers, и будет печатать подписчиков в виде текста для каждого найденного элемента.
Базовая HTTP-аутентификация: Cypress автоматически применяет правильные заголовки авторизации, если кто-то хочет посетить приложение, требующее базовой HTTP-аутентификации.
Это можно сделать, просто указав имя пользователя и пароль в объекте auth.
Заключение
Я надеюсь, что обмен примерами поможет вам начать использовать Cypress для автоматизации внешнего интерфейса, поскольку он помог мне выполнить автоматизацию внешнего интерфейса для моего проекта и упростил утомительные задачи для тестирования.
Чтобы установить зависимости системы cypress на инстансе AWS EC2 (Amazon Linux AMI), вы можете обратиться к блогу, написанному моим коллегой.
