Интеграция с Mocha

Karma — это тестовый раннер для JavaScript, обеспечивающий запуск тестов в реальных браузерах и интеграцию с различными фреймворками. Mocha — один из самых популярных фреймворков для написания тестов, предоставляющий гибкую структуру описания тестов и богатый API для ассертов и хуков. Интеграция Karma с Mocha позволяет запускать тесты Mocha в браузерной среде, сочетая преимущества обоих инструментов: возможность тестирования в реальных условиях и удобный синтаксис Mocha.

Установка и настройка

Для работы Karma с Mocha необходимо установить несколько пакетов через npm:

npm install --save-dev karma karma-mocha mocha
npm install --save-dev karma-chrome-launcher karma-coverage

Объяснение пакетов:

  • karma — ядро тестового раннера.
  • karma-mocha — адаптер для интеграции Mocha с Karma.
  • mocha — сам фреймворк тестирования.
  • karma-chrome-launcher — позволяет запускать тесты в браузере Chrome.
  • karma-coverage — инструмент для генерации отчётов о покрытии кода.

После установки необходимо создать файл конфигурации Karma, обычно karma.conf.js, и настроить основные параметры.

Конфигурация Karma для Mocha

Пример минимальной конфигурации:

module.exports = function(config) {
  config.set({
    frameworks: ['mocha'],
    files: [
      'src/**/*.js',
      'test/**/*.spec.js'
    ],
    browsers: ['ChromeHeadless'],
    reporters: ['progress', 'coverage'],
    preprocessors: {
      'src/**/*.js': ['coverage']
    },
    coverageReporter: {
      type: 'html',
      dir: 'coverage/'
    },
    singleRun: true
  });
};

Ключевые моменты конфигурации:

  • frameworks — указывает Mocha как фреймворк для тестирования.
  • files — список файлов с исходным кодом и тестами.
  • browsers — браузеры, в которых будут запускаться тесты; ChromeHeadless подходит для CI.
  • reporters — способы отображения результатов тестирования.
  • preprocessors — обработка файлов перед тестированием (например, генерация покрытия кода).
  • singleRun — если true, Karma запускает тесты один раз и завершает работу.

Структура тестов Mocha

Mocha использует блоки describe и it для организации тестов:

describe('Математические функции', function() {
  it('должна корректно складывать два числа', function() {
    const result = 2 + 3;
    if (result !== 5) throw new Error('Сумма неверна');
  });

  it('должна корректно умножать два числа', function() {
    const result = 4 * 5;
    if (result !== 20) throw new Error('Произведение неверно');
  });
});

Особенности Mocha в браузере через Karma:

  • Mocha выполняется синхронно или асинхронно с использованием колбэков или промисов.
  • Для асинхронных тестов используется done() или async/await.
  • Karma автоматически собирает все тестовые файлы и выполняет их в указанном браузере.

Асинхронное тестирование

Mocha и Karma позволяют тестировать асинхронный код:

describe('Асинхронные операции', function() {
  it('должна вернуть данные после задержки', async function() {
    function fetchData() {
      return new Promise(resolve => setTimeout(() => resolve(42), 100));
    }

    const result = await fetchData();
    if (result !== 42) throw new Error('Данные неверны');
  });
});

Karma корректно отслеживает завершение асинхронных тестов, если используется async/await или done().

Использование хуков Mocha

Mocha предоставляет хуки для подготовки и очистки состояния:

describe('Работа с базой данных', function() {
  let db;

  before(function() {
    db = initializeDatabase();
  });

  after(function() {
    db.close();
  });

  beforeEach(function() {
    db.reset();
  });

  it('должен добавлять запись', function() {
    db.add({ id: 1 });
    if (db.count() !== 1) throw new Error('Запись не добавлена');
  });
});
  • before и after выполняются один раз перед всеми тестами и после них.
  • beforeEach и afterEach выполняются перед и после каждого теста.

Генерация покрытия кода

Karma в сочетании с karma-coverage позволяет создавать отчёты о покрытии:

preprocessors: {
  'src/**/*.js': ['coverage']
},
coverageReporter: {
  type: 'html',
  dir: 'coverage/'
}

Результат — HTML-отчёт, показывающий процент покрытия каждой функции и строки кода. Это важно для оценки качества тестов и нахождения необработанных сценариев.

Настройка CI/CD

Для интеграции с системами CI/CD используется ChromeHeadless или FirefoxHeadless. Пример команды для запуска тестов в CI:

npx karma start karma.conf.js --single-run
  • --single-run гарантирует завершение процесса после выполнения тестов.
  • Отчёты о покрытии могут быть загружены на сервисы типа Coveralls или Codecov.

Расширенные возможности

  • Плагины Karma позволяют подключать другие инструменты: karma-webpack для сборки модулей, karma-sourcemap-loader для поддержки sourcemap.
  • Мультибраузерное тестирование: Karma может одновременно запускать тесты в нескольких браузерах, обеспечивая проверку совместимости.
  • Настройка времени ожидания: параметры browserNoActivityTimeout и captureTimeout позволяют управлять тайм-аутами тестов, особенно для долгих асинхронных операций.

Интеграция Karma с Mocha обеспечивает гибкое и надёжное тестирование JavaScript-кода в реальных браузерных условиях, поддерживая как синхронные, так и асинхронные сценарии, с возможностью расширения под различные инструменты анализа и CI/CD.

Оглавление