Введение:

webdriver.io — тестовая среда с открытым исходным кодом для node.js.

Он используется для автоматизации веб-приложений и мобильных приложений.

Он отправляет запросы на сервер Selenium через протокол WebDriver и обрабатывает его ответы. WebdriverIO — это настраиваемая реализация API веб-драйвера Selenium W3C. Он написан на Javascript, упакован в «npm» и работает на Node.js.

Говоря простым языком, он использует вызовы Selenium API для автоматизации сценариев приложений.

Установка:

Для работы с webdriver.io на вашем компьютере должно быть установлено следующее.

  1. Установите Node.js: https://nodejs.org/en: просто загрузите и установите версию, поддерживаемую ОС вашего устройства. Я использую Mac для этого урока.

Node.js требуется, потому что webdriver.io работает на узле или это программа node.js.

используйте команду «node -v» на терминале, чтобы проверить, прошла ли установка успешно.

как вы можете видеть, он правильно указывает версию.

2. Установить NPM (менеджер пакетов узла) устанавливается вместе с установкой узла, как указано выше. NPM необходим, чтобы можно было установить пакет webdriver.io.

чтобы проверить установку, просто введите «npm -v» в терминале.

3. Установите Java

https://www.java.com/en/download/

чтобы проверить установку, просто введите «java -version» в терминале.

4. Загрузите и установите редактор для написания кода: вы можете использовать любой редактор javascript по вашему выбору. Я использую intellij здесь.

Итак, теперь мы готовы с предварительными условиями и готовы создать наш первый проект webdriver.io.

5. Инициализировать проект:

создайте каталог на вашем компьютере, используя следующую команду

«mkdir webdriverio-проект»

перейдите в этот новый каталог и введите следующую команду «npm init». Инициализация NPM создает файл package.json

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

Обратите внимание, что файл package.json создается в рамках проекта webdriverio.

6. Установите пакет webdriverio.

убедитесь, что вы находитесь в корне каталога вашего проекта, теперь выполните следующую команду

npm install webdriverio --save-dev

для установки пакета webdriverio. Чтобы убедиться, что он установлен, вы можете посмотреть файл package.json в разделе devDependencies, вы должны найти запись для webdriverio и версию. Также вы заметите каталог node_modules, созданный в корне папки вашего проекта, куда загружаются все зависимости.

7. Создайте файл конфигурации wdio.

установить интерфейс командной строки WebdriverIO

npm i - save-dev @wdio/cli

выполните следующую команду, чтобы создать конфигурацию wdio

./node_modules/.bin/wdio config

8. Создайте свой первый тест webdriver.io

В этом примере я перейду на airbnb.com.au и проверю, что домашняя страница загружена, проверив, что она имеет ожидаемый заголовок.

Создайте каталог с именем «test» в корне вашего проекта и создайте каталог «specs» в каталоге «test».

создайте файл test.spec.js в разделе test/specs

describe('AirBnb homepage', () => {
    it('should display the correct homepage title', () => {
        browser.url('https://www.airbnb.com.au/');
        const title = browser.getTitle();
        assert.equal(title, 'Holiday Rentals, Homes, Experiences & Places - Airbnb');
    });
});

объясняя код выше

i) browser.url перейдет по указанному URL-адресу, в нашем случае это https://www.airbnb.com.au/.

ii) title = broswer.getTitle извлечет заголовок текущей страницы в виде строки и сохранит ее в переменной title.

iii) assert.equal(title, «Аренда жилья для отдыха, дома, впечатления и места — Airbnb»)

приведенная выше строка утверждает, что заголовок, полученный из browser.getTitle, равен ожидаемому значению заголовка «Аренда жилья для отдыха, дома, развлечения и места — Airbnb».

9. Теперь, прежде чем запускать тест, давайте установим chai, который на самом деле является необходимым пакетом npm для выполнения утверждений.

выполните следующие команды для установки chai

npm install chai --save-dev
npm install chai-webdriverio --save-dev

также добавьте следующий код sinppet в wdio.conf.js

beforeTest: () => {
      const chai = require('chai');
      const chaiWebdriver = require('chai-webdriverio').default;
      chai.use(chaiWebdriver(browser));
      global.assert = chai.assert;
    },

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

10. Теперь запустите первый тест на webdriver.io

перед запуском теста обратите внимание на следующие настройки конфигурации wdio.config.js

specs: [
    './test/specs/**/*.js'
],

здесь мы сохранили наш тестовый файл и по умолчанию это местонахождение тестов.

capabilities: [{
    browserName: 'chrome',
}],

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

framework: 'mocha',

тестовая среда, которую мы используем, — mocha. Другими фреймворками, которые вы можете использовать с фреймворком webdriver, являются жасмин или огурец.

теперь позвольте запустить первый тест, выполнив следующую команду.

./node_modules/.bin/wdio wdio.conf.js

Вы заметите, что браузер открывается на вашем компьютере и переходит на airbnb.com.au.

вы также заметите это в окне терминала.

это показывает, что test.spec.js был запущен, и тест подтвердил правильность заголовка aurbnb.com.au, как и ожидалось!

Вот и все, теперь у вас есть первый тестовый запуск!

Что дальше?

В ближайшие недели мы будем больше играть с wbdriver.io и скоро загрузим это на git.

Мой linkedin: https://www.linkedin.com/in/jag-singh-434a843/

электронная почта: [email protected]