В этом кратком руководстве я покажу вам, как добавить немного ASCII-графики в тестовую среду Webdriver.IO.

Я предполагаю, что вы уже установили и работаете с Webdriver.IO, если это не так, посетите веб-сайт Webdriver.IO и следуйте инструкциям, используя документы Начало работы. Вы также можете клонировать этот пример репозитория, который я создал, и начать оттуда.

  • Если вы клонируете репозиторий, обязательно запуститеnpm install , чтобы установить все соответствующие пакеты. Это позаботится об установке пакетов webdriverio и пакета figlet.

В папке вашего проекта Webdriver.IO вам нужно установить пакет npm Figlet. Это легко сделать, выполнив следующую команду npm:

npm install figlet

После того, как это будет установлено, вы захотите открыть файл wdio.conf.js и найти хук onPrepare. Если у вас его нет в файле конфигурации, просто добавьте его в конец файла.

/**
* Gets executed once before all workers get launched.
* @param {Object} config wdio configuration object
* @param {Array.<Object>} capabilities list of capabilities details
*/
onPrepare: function (config, capabilities) {
},

Как описано в комментариях, этот хук будет «выполнен до запуска всех воркеров». Это идеально подходит для нас, так как мы хотим, чтобы наша графика ASCII появлялась в терминале до того, как все наши тесты будут выполнены.

Внутри вашего хука onPrepare вы захотите вызвать пакет Figlet следующим образом:

/**
* Gets executed once before all workers get launched.
* @param {Object} config wdio configuration object
* @param {Array.<Object>} capabilities list of capabilities details
*/
onPrepare: function (config, capabilities) {
    const figlet = require('figlet');
},

И, используя пример, найденный в документации Figlet, мы добавим это ниже нашего оператора require.

/**
* Gets executed once before all workers get launched.
* @param {Object} config wdio configuration object
* @param {Array.<Object>} capabilities list of capabilities details
*/
onPrepare: function (config, capabilities) {
    const figlet = require('figlet');
    figlet.text('Custom Text!', {
        font: 'Colossal', //change this to your preferred font
        horizontalLayout: 'default',
        verticalLayout: 'default',
        width: 90,
        whitespaceBreak: true
    }, function(err, data) {
        if (err) {
            console.log('Something went wrong...');
            console.dir(err);
            return;
        }
        console.log(data);
    });
},

И это должно быть так!

Теперь каждый раз, когда вы запускаете свои тесты, ваш Custom Text! будет отображаться перед всеми вашими тестами. Прохладный!!

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

npx wdio run ./wdio.conf.js

Если все настроено правильно, вы должны увидеть что-то подобное в своем терминале.

Если вы хотите ознакомиться с некоторыми другими шрифтами, посетите этот веб-сайт, чтобы увидеть другие шрифты Figlet — http://www.figlet.org/examples.html.

Спасибо за проверку этой статьи! Я надеюсь, что это помогло вам, и я надеюсь, что ваши тесты теперь щеголяют какой-нибудь классной ASCII-графикой!