В своих последних нескольких сообщениях в блоге я потратил время на разговоры о важности тестирования при разработке программного обеспечения и дал введение в написание тестов с помощью Rails. В этой статье я расскажу о том, как писать тесты в одной из передовых сред тестирования JavaScript.

С простым старым ванильным JavaScript, без использования каких-либо фреймворков, таких как React или Angular, есть множество фреймворков для тестирования, из которых вы можете выбирать, но я собираюсь поговорить о Mocha. Причина, по которой я выбрал Mocha, заключается в том, что синтаксис аналогичен синтаксису тестов, которые я писал с Rails, и это фреймворк, который мой Bootcamp использовал для написания тестов, поэтому он кажется мне знакомым. У него также есть очень хорошая документация с четкими примерами и объяснениями, и она существует уже давно, поэтому у них была возможность сгладить все ошибки, и есть много примеров ее использования.

Чтобы начать использовать Mocha для вашего проекта JavaScript, запустите эти команды на верхнем уровне каталога вашего проекта:

~ // ♥ > npm install mocha
~ // ♥ > mkdir test
~ // ♥ > touch test/test.js

Эти команды добавят Mocha в ваш проект, создадут тестовый каталог и создадут файл для записи ваших тестов. Тестовый файл не обязательно должен называться test.js, вы можете называть его как хотите, и если вы собираетесь чтобы тестировать несколько файлов, у вас должен быть тестовый файл для каждого из них с именем, указывающим на файл, который вы тестируете, например <filename>Test.js.

Теперь для написания вашего первого теста. Используя встроенный в Node.js модуль assert, вы можете написать такой простой тест:

const assert = require('assert') // from Node.js' assert module
describe('Array', function () {
  describe('#indexOf()', function () {
    it('should return -1 when the value is not present', function(){
      assert.equal([1, 2, 3].indexOf(4), -1)
    })
    it('should return the index when present', function(){
      assert.equal([1, 2, 3].indexOf(2), 1)
    })
  })
})

Из названий функций довольно ясно, что здесь происходит. Функция describe получает имя, которое сообщает вам, какие все тесты в ней будут проверять; в этом примере функция JavaScript Array indexOf. Функция it получает имя, которое точно описывает, что проверяет тест, а также функцию обратного вызова. Внутри обратного вызова есть утверждение. Утверждения предназначены для оценки чего-либо на предмет ожидаемых результатов. В этом примере мы проверяем, что каждый вызов функции indexOf в данном массиве возвращает ожидаемое число.

Теперь, чтобы запустить тесты из командной строки и посмотреть результаты:

~ // ♥ > ./node_modules/mocha/bin/mocha
  Array
    #indexOf()
      ✓ should return -1 when the value is not present
      ✓ should return the index when present
  2 passing (7ms)

Здесь следует отметить одно: из результатов видно, что тесты выполнялись в том порядке, в котором они были записаны в файл. Это всегда будет иметь место для всех тестов, которые написаны для нормального выполнения (в другой раз я займусь запуском тестов «ненормально»).

Вернувшись к запуску тестов, вы можете увидеть, что команда для их запуска длинная и раздражает при вводе, поэтому для упрощения вы можете настроить тестовый скрипт в своем файле package.json:

"scripts": {
  "test": "mocha"
}

Затем вы можете запускать тесты с помощью простой команды (вы используете test, потому что это ключ, который вы вставляете в свой скрипт):

~ // ♥ > npm test

Еще одна вещь, которую вы можете добавить в свой script для проведения тестов, - это репортер. Репортеры меняют то, как результаты ваших тестов выглядят в вашем терминале. В приведенном выше примере используется spec, который является значением по умолчанию. Существует широкий спектр репортеров, некоторые из которых включают описания функций для прохождения тестов, например span, а некоторые просто включают имя функции в случае сбоя. Полный список репортеров, которых здесь ведет Мокко. Мне больше всего нравится nyan, он выглядит так:

Чтобы изменить ваш репортер на что-то другое, кроме span, вам просто нужно изменить скрипт в вашем package.json, чтобы он выглядел так:

"scripts": {
  "test": "mocha --reporter <reporter-name>"
}

Приведенный выше пример работает нормально, но есть и другие варианты написания тестов. Например, Mocha позволяет использовать любую библиотеку утверждений, которую вы хотите. Один, который мне нравится, потому что он имеет очень полезные и понятные типы утверждений, называется chai; в нем есть утверждения в стиле expect(), assert() и should, и вы можете использовать любое из них, которое вам нравится. После установки chai с npm install chai я мог переписать предыдущие тесты, чтобы они выглядели так:

const expect = require('chai').expect; // add to the top of the file
describe('Array', function () {
  describe('#indexOf()', function () {
    it('should return -1 when the value is not present', function(){
      expect([1, 2, 3].indexOf(4)).to.equal(-1)
    })
    it('should return the index when present', function(){
      expect([1, 2, 3].indexOf(2)).to.equal(1)
    })
  })
})

Мне лично это нравится больше, потому что я думаю, что expect(a).to.equal(b) делает понятнее для читателя, что вы проверяете, в отличие от assert.equal(a, b). Также существует гораздо больше методов, чем просто equal(), которые вы можете использовать в своих утверждениях, например, expect(foo).to.be.a(‘string’). Вы можете увидеть их все, перечисленные в документации chai.

Еще одно замечание: передавать стрелочные функции в Mocha не рекомендуется. Стрелочные функции связывают this, поэтому вы не можете получить доступ к контексту Mocha. Иногда это может приводить к некоторым ошибкам в ваших тестах, и хотя стрелочные функции обычно работают, их избегание вызовет меньше проблем в будущем.

И это все, о чем я собираюсь рассказать сегодня при написании тестов JavaScript с помощью Mocha. Я думаю, что заложил хорошую основу для того, чтобы начать писать тесты для базового проекта JavaScript. В следующем посте я расскажу о некоторых наиболее интересных вещах, которые можно делать с помощью тестов Mocha.