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

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

Что такое модульный тест?

Модульный тест проверяет поведение модуля программного обеспечения в системе. Он проверяет, ведет ли себя небольшая и изолированная часть кодовой базы под названием «модуль» так, как задумал разработчик.

Модульные тесты проверяют мельчайшие части или компоненты приложения, сравнивая их фактическое поведение с ожидаемым в полной изоляции. Здесь «полная изоляция» означает, что во время модульного тестирования разработчики не подключают приложение к внешним зависимостям, таким как базы данных, файловая система или службы HTTP. Это позволяет модульным тестам быть быстрыми и стабильными, поскольку они не будут давать сбоев из-за проблем с интеграцией с этими внешними службами.

Зачем писать модульные тесты?

Обычно разработчики пишут модульные тесты, а затем пишут программный код. Этот подход известен как разработка через тестирование (TDD). В TDD требования превращаются в конкретные тестовые примеры, затем программное обеспечение совершенствуется, чтобы пройти новые тесты. В случае модульных тестов это позволяет модифицировать код, не влияя на функциональность других модулей или программного обеспечения в целом. Это облегчает работу разработчиков, поскольку на этом этапе легко найти ошибки, что экономит время и деньги.

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

Наряду с приведенными выше фактами, давайте рассмотрим различные преимущества модульных тестов.

Преимущества модульных тестов:

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

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

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

Рекомендации по созданию модульных тестов

При создании модульных тестов следует придерживаться следующих рекомендаций:

  1. Тесты должны быть быстрыми и простыми, а это означает, что разработчикам нужно, чтобы тестовые примеры выполнялись на более высокой скорости, поскольку это служит цели модульного тестирования. Если они будут медленными, разработчики не будут запускать тестовые примеры так часто, как должны. Кроме того, чем проще примеры модульных тестов, тем точнее результаты тестирования.
  2. Тестовые примеры не должны дублировать логику реализации.
  3. Тестовые случаи должны быть детерминированными — демонстрировать одинаковое поведение, пока их код не меняется. Чтобы тесты оставались детерминированными, QA должны выполнять их в реальных браузерах и устройствах, а не в эмуляторах и симуляторах. Без взаимодействия с реальными производственными средами (настоящими, работающими реальными устройствами) результаты тестирования будут далеки от детерминированных или точных.
  4. Адаптируйте мощное соглашение об именах для тестовых случаев

Модульное тестирование JavaScript

Модульное тестирование JavaScript — это метод, при котором тестовый код JavaScript пишется для веб-страницы или модуля веб-приложения. Затем он объединяется с HTML как встроенный обработчик событий и выполняется в браузере, чтобы проверить, все ли функции работают должным образом. Затем эти модульные тесты объединяются в набор тестов.

Существуют различные фреймворки, полезные для модульного тестирования в JavaScript. Они следующие:

  • Mocha: тестовая среда, работающая как в Node.js, так и в браузере. Эта структура упрощает асинхронное тестирование за счет последовательного запуска тестов. Тесты Mocha запускаются последовательно, что позволяет создавать гибкие и точные отчеты при сопоставлении неперехваченных исключений с правильным тестовым набором.
  • Jest: это среда тестирования с открытым исходным кодом, построенная на JavaScript, разработанная в основном для работы с веб-приложениями на основе React и React Native. Часто модульные тесты не очень полезны при запуске на интерфейсе любого программного обеспечения. В основном это связано с тем, что модульные тесты для внешнего интерфейса требуют обширной и трудоемкой настройки. Эта сложность может быть значительно уменьшена с помощью Jest framework.
  • Jasmine.Jasmine — это популярная среда разработки JavaScript, основанная на поведении, для модульного тестирования приложений JavaScript. Он предоставляет утилиты, используемые для запуска автоматических тестов как для синхронного, так и для асинхронного кода.
  • Karma.Karma – это инструмент для тестирования на основе узлов, который позволяет тестировать код JavaScript в нескольких реальных браузерах. Это делает разработку через тестирование быстрой, увлекательной и простой и технически называется тест-раннером.
  • Cypress:Cypress framework — это среда сквозного тестирования на основе JavaScript, созданная поверх Mocha — многофункциональной среды тестирования JavaScript, работающей в браузере и в браузере, что делает асинхронное тестирование простым и удобные Модульные тесты в Cypress выполняются без запуска веб-сервера. Это делает Cypress идеальным инструментом для тестирования библиотеки JS/TS, предназначенной для использования в браузере.

Написание тестового примера

Здесь мы будем использовать фреймворк and testing. Этот инструмент является одним из де-факто доступных инструментов тестирования, популярным из-за простоты использования и различных функциональных возможностей тестирования. Если вы не знакомы с конфигурацией Jest, сделайте паузу здесь, прочитайте Учебное пособие по Jest Framework и продолжите выполнение следующих шагов.

Необходимые условия для написания тестового примера:

Ниже приведены некоторые библиотеки и пакеты, которые необходимо установить в системе для запуска тестовых сценариев Jest.

  1. NodeJS и диспетчер пакетов Node (npm): NodeJS можно установить с помощью менеджера npm или напрямую с помощью двоичного файла установщика Windows с веб-сайта nodejs.org здесь.
  2. Подходящий драйвер браузера

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

const englishCode = "en-UK";
const frenchCode = "es-FS";
function getAboutUsLink(language){
switch (language.toLowerCase()){
case englishCode.toLowerCase():
return '/about-us';
case frenchCode.toLowerCase():
return '/-à propos de nous';
}
return '';
}
module.exports = getAboutUsLink;

Теперь давайте поместим его в файл index.js. Давайте напишем тесты в одном файле, но лучше записывать отдельные юнит-тесты в отдельный файл. Общие шаблоны именования включают

{имя файла}.test.js и {имя файла}.spec.js. В этом примере используется index.test.js:

const getAboutUsLink = require("./index");
test("Return about-us for english language", () => {
expect(getAboutUsLink("en-UK")).toBe("/about-us");
});

Теперь импортируйте тестируемую функцию. Каждый тест здесь определяется как вызов тестовой функции. Первый параметр — это имя теста.

В этом случае мы вызываем функцию getAboutUsLink с en-UK в качестве языкового параметра. Мы ожидаем, что результатом будет /about-us.

Теперь вызовите Jest CLI глобально и запустите тест:

npm i jest-cli -g

Jest

Если вы получаете ошибку, связанную с конфигурацией, убедитесь, что у вас есть файл package.json. Если нет, сгенерируйте его с помощью npm init.

Ваш вывод выглядит следующим образом:

PASS  ./index.test.js
√ Returns about-us for english language (4ms)
console.log index.js:10
/about-us
Test Suites: 1 passed, 1 total
Tests:       1 passed, 1 total
Snapshots:   0 total
Time:        2.111s

Вот как вы пишете модульные тесты с использованием JavaScript.

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

Первоначально опубликовано на https://www.browserstack.com.