Pull to refresh

CodeceptJS — современные end2end тесты для NodeJS

Reading time 4 min
Views 20K

image


В мире NodeJS творится полный хаос, каждый день появляются новые фреймворки, размеры зависимостей обычного package.json вырастают на сотни мегабайт, а библиотека, которую вы добавили в проект ещё вчера, сегодня уже морально устарела. И если в мире фронтенд фреймворков уже наметились явные фавориты: AngularJS, React, Vue, Ember, то что для приемочного тестирования совершенно непонятно. Каждый фреймворк предоставляет свой синтаксис и свои крутые фичи, а также у каждого есть свой характерный набор проблем. Например, каждый по-своему реализует взаимодействие с браузером, каждый по разному борется с асинхронностью.


Ох, эта пресловутая асинхронность...


Да, асинхронность это круто, но в контексте приемочного end-2-end тестирования асинхронность это вечная проблема. Тесты должны иметь линейный вид, посоледовательности команд: я открываю страницу, я кликаю кнопку, я хочу увидеть нужный мне текст. Каждая подобная команда в контексте JS будет выполнятся асинхронно, а потому подобная конструкция будет записана цепочкой вызовов:


client
  .url('https://github.com/nightwatchjs/nightwatch')
  .waitForElementVisible('body', 1000)
  .assert.visible('.container h1 strong a')

(все команды смешаны в одну, сложно понять какие команды доступны)


или с помощью многократных yield или await:


function*() {  
  yield browser.url('http://google.com');
  yield browser.click('#link');
  var title = yield browser.getTitle()
  console.log(title);
}

(переизбыток управляющих конструкций делает тест менее читабельным).


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


Для решения описанных выше проблем (мультиинструментальность и асинхронность) появился CodeceptJS.


Это фреймворк позволяющий описывать тесты на DSL высокого уровня. Сами тесты будут выполнятся одной из популярных библиотек на выбор: webdriverio, Protractor, NightmareJS. В большинстве случаев вам не придется учить синтаксис каждой из библиотек, а использовать готовый универсальный API. Вот как выглядит простой тест в CodeceptJS:


Scenario('search github', (I) => {
  I.amOnPage('https://github.com/search');
  I.fillField('Search GitHub', 'CodeceptJS');
  I.pressKey('Enter');
  I.see('Codeception/CodeceptJS', 'a');
});

Scenario('register', (I) => {
  I.amOnPage('https://github.com');
  within('.js-signup-form', function () {
    I.fillField('user[login]', 'User');
    I.fillField('user[email]', 'user@user.com');
    I.fillField('user[password]', 'user@user.com');
    I.click('button');
  });
  I.see('There were problems creating your account.');
});

Как же CodeceptJS позволяет писать линейные сценарии для тестов? Раскрою секрет: везде используется глобальная цепочка промисов, в которую добавляются новые и новые команды. Таким образом, CodeceptJS может легко реализовать те же PageObjects:


Scenario('register', (I, RegisterPage) => {
  RegisterPage.open();
  RegisterPage.register({login: 'User', email: 'user@user.com', password: '123435'});
  I.see('There were problems creating your account.');
  I.click('Explore');
});

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


И правда, получилось читабельно: все команды описаны как действия от первого лица, селекторы минимально перегружают код технической информацией. Казалось бы, что можно сделать, чтобы тест ещё более читабельным. Давайте напишем его по-русски!


Scenario('пробую написать реферат', (Я) => {
  Я.на_странице('http://yandex.ru/referats');
  Я.вижу("Написать реферат по");
  Я.выбираю_опцию('Психологии');
  Я.кликаю("Написать реферат");
  Я.вижу("Реферат по психологии");
});

Да, это валидный JS-код, который может быть выполнен в среде NodeJS без всяких транспайлеров!


Как уже было упомянуто в конфигурации вы легко сможете выбрать движок для вполнения тестов. Хотите стабильный и хороший webdriver API, используйте WebDriverIO, работаете с Ангуляром — включите Protractor, хотите ускорить тесты в 3 раза, отказавшись от webdriver, и запуская приложение внутри Electron, используйте Nightmare.


Конечно, нельзя объять не объятное и написать полную реализацию всех доступных действий для всех движков. Но CodeceptJS позволяет вам писать свои расширения и дополнять текущую функциональность. Да, таким образом вам придется немного поработать с низкоуровневым API того же webdriverio, но реализовав нужный функционал вы сможете использовать его в сценариях.


Что ещё есть в CodeceptJS:


  • пошаговый вывод прохождения тестов
  • режим интерактивной паузы
  • генераторы тестов, pageobjects, helpers
  • скоро появится поддержка Appium

Как установить CodeceptJS? Не так и сложно


[sudo] npm install -g codeceptjs
codeceptjs init

Дальше вам нужно будет выбрать один из драйверов для вполнения тестов (Protractor, webdriverio, Nightmare) и установить для них пакеты. Команда codeceptjs init поможет вам в этом и подскажет как писать первый тест.


Проекту уже почти год, CodeceptJS используется в Британских и в Бразильских государственных компаниях. Он бесплатен и свободен как MIT.
Если вы ещё не пробовалb его, у вас есть отличная возможность! Если уже пользуетесь — пишите свои комментарии. А также присоединяйтесь к развитию проекта.

Tags:
Hubs:
+31
Comments 23
Comments Comments 23

Articles