В своих последних нескольких сообщениях в блоге я потратил время на разговоры о важности тестирования при разработке программного обеспечения и дал введение в написание тестов с помощью 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.