Попробуем запачкать руки с помощью WebdriverIO

Давно я что-то писал для публики. Я не уверен в точной причине молчания, может быть, это потому, что я не был в настроении писать в эти дни или, скорее, я был так занят погоней за новыми вызовами. Давайте вместе изучим факты, взглянув на инструмент, с которым я экспериментировал последние 9 месяцев. Этот инструмент называется WebdriverIO и используется для автоматизации пользовательского интерфейса как в веб-приложениях, так и в мобильных приложениях.

В двух словах, почему webdriverIO?

· Инструмент написан с использованием пакетов JavaScript и selenium через модуль npm.

· Тесты могут работать во всех типах браузеров благодаря мощной поддержке селена.

· Упростите команды, интегрировав действия селена.

· Простота обслуживания с использованием объектов страницы и пользовательских команд.

Давайте сделаем некоторые действия здесь.

Предварительные требования:

· Установить менеджер версий узла: https://github.com/nvm-sh/nvm

Для пользователей Windows используйте nvm для репозитория Windows: https://github.com/coreybutler/nvm-windows)

· Установите узел (рекомендуется последняя стабильная версия узла).

· Проверьте свою версию npm

команда: $ npm -v

· Обновление до последней версии npm

команда: $ nvm install — last-npm

пользователи Windows: npm-windows-upgrade — последняя версия npm

Настройте WebdriverIO:

Надеюсь, вы справились с первой частью установки предварительных условий. В этой части я планирую разработать установку Webdriverio, конфигурацию тестового запуска и структуру проекта.

Использование WebdriverIO можно разделить на 2 части.

1. Автономный режим: запуск в качестве сценария узла.

2. Тестовый запуск: запуск с использованием предварительно определенного файла конфигурации.

Я предпочитаю идти по второму варианту. Разберемся, почему?

· Создайте каталог проекта: wdio-first

· Перейдите в каталог проекта и используйте команду:$ npm init -y, чтобы создать файл package.json с конфигурацией по умолчанию.

· установить версию 4x webdriverio: $ npm install webdriverio@4

Перед настройкой конфигурационного файла wdio нам необходимо уточнить наши мотивы, лежащие в основе общего стратегического направления автоматизации. Я планирую использовать огурец в качестве своей тестовой среды, поскольку в наши дни он довольно известен, и все заинтересованные стороны могут понять, чего мы пытаемся достичь. Я установил webdriverio@4 вместо WebdriverIO V5. До сих пор мы не получали никаких обновлений относительно поддержки тестовой среды огурца для последней версии WebdriverIO.

· Создать файл конфигурации: $ ./node_modules/.bin/wdio config

Получите доступ к указанному выше пути через командную строку, чтобы начать настройку файла конфигурации. Пожалуйста, обратитесь к приведенным ниже примерам конфигураций, если вы не уверены в том, что выбрать. Вы можете использовать клавиши со стрелками и пробел, чтобы выбирать нужные параметры вперед и назад.

=========================

Помощник по настройке WDIO

=========================

Где вы хотите выполнять свои тесты? На моем локальном компьютере

Какой фреймворк вы хотите использовать? огурец

Мне установить для вас адаптер фреймворка? Да

Где находятся файлы ваших функций? ./e2e/features/**/*. особенность

Где находятся ваши определения шагов? ./e2e/шаги

Какой репортер вы хотите использовать? спецификация — https://github.com/webdriverio/wdio-spec-reporter

Мне установить для вас библиотеку Reporter? Да

Вы хотите добавить службу в свою тестовую установку? selenium-standalone — https://github.com/webdriverio/wdio-selenium-standalone-service

Должен ли я установить услуги для вас? Да

Уровень детализации журнала data

В какой каталог должны сохраняться скриншоты в случае сбоя команды?/errorShots/

Что такое базовый URL? https://v4.webdriver.io/

Это конец части конфигурации. Нам нужно дать перерыв в командной строке и использовать любую предпочтительную IDE, чтобы открыть проект. Мой первый выбор — код Visual Studio, и я могу открыть его через командную строку с помощью команды: «$ code »..

Все готово для написания скриптов webdriverIO. Я создал папки функций, объектов страницы и шагов в папке e2e. Это улучшит качество кодовой базы. Вы можете подтвердить настройку с помощью снимка ниже.

Тогда я предпочитаю запускать свой скрипт в браузере «chrome».

Затем я изменил путь определения шага, чтобы забрать любые файлы js внутри папки следующим образом.

Пожалуйста, добавьте скрипт в путь пакета json для запуска скрипта с помощью команды «npm run test». В дальнейшем мы используем «npm run test» в консоли для запуска наших тестов.

Написание и выполнение тестов:

Общее мнение о проведении автоматизированных тестов в основном связано с техническими трудностями, а не с бизнес-ценностями. Вот почему мы пытаемся отображать бизнес-кейсы, используя язык огурцов, чтобы избежать двусмысленности. Тем не менее, мы считаем, что добавление всеобъемлющего файла функций будет отправной точкой для автоматизации, и вы можете перекрестно свериться с PO (владельцами продукта) и получить одобрение при фиксации репо.

Давайте создадим нашу первую функцию. В первом сценарии объясняется, как потенциальный клиент переходит на домашнюю страницу WebdriverIO, а затем прокручивает страницу вниз. Как только человек захочет узнать больше, нажмите кнопку «Пуск» и получите доступ к руководству разработчика.

Вторая часть — сопоставление объекта с определением шага. В этом разделе программе требуется ссылка из библиотек огурцов и объект страницы, который мы создали для сопоставления локаторов и методов элементов. Вам нужно использовать объект страницы «wdioLoginPage» для доступа к методам тестирования и элементам, созданным в «guide-po».

Кроме того, мы использовали глобальный класс assert для проверки ожидаемых и фактических результатов. По-видимому, нам нужно сначала установить пакет npm, как показано ниже, и добавить новую функцию в конфигурацию wdio, чтобы сделать ее доступной для всего проекта.

$ npm install chai — сохранить -dev

Класс WdioLoginPage организован следующим образом. Я использовал селекторы CSS, чтобы найти элементы, определенные в верхней части страницы. Затем я составил несколько методов, используя эти элементы. Все вместе «module.exports» экспортирует все функции. Я надеюсь, что вы что-то поняли из указаний, которые я дал до сих пор.

Я немного взволнован тем, как выглядит результат теста. Ты ?

Это конец этой статьи. Но не теряйте надежды и оставайтесь на связи. Впереди еще много необычных вещей. Я пользуюсь этим моментом, чтобы выразить благодарность Приамо, который представил нам эту структуру, и Ласанте, помогавшей мне стандартизировать вещи.

Вы можете получить доступ к образцу проекта, используя этот репозиторий git: https://github.com/harshana2004/wdio-cucumber