Создание karma.conf.js

Конфигурационный файл karma.conf.js формирует основу окружения, в котором запускаются тесты, определяя тестовый раннер, загрузчики модулей, браузеры и репортеры. Его создание представляет собой важный шаг в интеграции Karma в процесс разработки.

Файл расположивается в корне проекта и экспортирует функцию с объектом настроек. Karma инициализирует этот файл при запуске командой karma start и использует указанные параметры для построения тестового пайплайна.

Основные секции:

  • frameworks: определяет тестовый фреймворк (например, Jasmine или Mocha).
  • files: задаёт шаблоны файлов тестов и тестируемого кода.
  • preprocessors: описывает обработку файлов до запуска (например, трансляция TypeScript или бандлинг Webpack).
  • reporters: формирует вывод результатов тестирования (progress, dots, junit и другие).
  • browsers: выбирает браузеры для прогонки (Chrome, Firefox, Edge, PhantomJS).
  • plugins: подключает плагины Karma, обеспечивающие интеграции и трансформации.
  • singleRun и autoWatch: управляют режимами однократного запуска или слежения за изменениями.
  • port, colors, logLevel: настраивают вспомогательные параметры окружения.

Минимальный пример конфигурации

module.exports = function(config) {
  config.set({
    frameworks: ['jasmine'],
    files: ['src/**/*.js', 'test/**/*.spec.js'],
    browsers: ['Chrome'],
    reporters: ['progress'],
    singleRun: true
  });
};

Такой пример иллюстрирует базовые настройки. Указываются фреймворк, шаблоны файлов и браузер без дополнительной инфраструктуры.

Добавление сборки через Webpack

Для приложений на современном JavaScript/TypeScript требуется сборка модулей перед выполнением тестов. Подключается karma-webpack, а секция preprocessors указывает, что тесты необходимо пропустить через Webpack.

const webpackConfig = require('./webpack.test.js');

module.exports = function(config) {
  config.set({
    frameworks: ['jasmine'],
    files: [
      { pattern: 'src/**/*.ts', included: false },
      { pattern: 'test/**/*.spec.ts', included: false }
    ],
    preprocessors: {
      'src/**/*.ts': ['webpack'],
      'test/**/*.spec.ts': ['webpack']
    },
    webpack: webpackConfig,
    reporters: ['progress'],
    browsers: ['ChromeHeadless'],
    singleRun: true,
    plugins: [
      'karma-webpack',
      'karma-jasmine',
      'karma-chrome-launcher'
    ]
  });
};

Karma передаёт конфигурацию Webpack тестовому раннеру, что обеспечивает поддержку импорта модулей, TypeScript или Babel и инлайновых источников.

Подключение код покрытия

Для анализа покрытия тестирующего кода применяется karma-coverage. В preprocessors добавляется плагин покрытия, а в reporters — репорт об инструментации.

preprocessors: {
  'src/**/*.js': ['coverage'],
  'test/**/*.spec.js': ['webpack']
},
reporters: ['progress', 'coverage'],
coverageReporter: {
  type: 'html',
  dir: 'coverage/'
}

Инструментация сгенерирует отчёты в удобном формате, пригодном для инспекции или CI-пайплайнов.

Управление режимами работы

singleRun: true инициирует полный цикл запуска тестов и завершения процесса, что особенно важно в CI. autoWatch: true активирует отслеживание изменений файлов и повторный запуск тестов. Комбинация этих параметров позволяет адаптировать конфигурацию под локальную разработку или непрерывную интеграцию.

Выбор браузеров

Karma поддерживает множество браузеров через плагины-лаунчеры. Наиболее распространён ChromeHeadless, обеспечивающий запуск без графического интерфейса. Для кросс-браузерного тестирования указываются несколько браузеров:

browsers: ['ChromeHeadless', 'Firefox', 'Edge']

Плагины karma-firefox-launcher и karma-edge-launcher подключаются в секцию plugins.

Перечень плагинов

Karma не активирует плагины автоматически. Каждый плагин требуется явно объявить в plugins. Такой подход повышает контроль за окружением и исключает неожиданности при обновлениях зависимостей.

Типичные плагины:

  • Раннеры: karma-jasmine, karma-mocha.
  • Лаунчеры: karma-chrome-launcher, karma-firefox-launcher.
  • Репортеры: karma-coverage, karma-junit-reporter.
  • Препроцессоры: karma-webpack, karma-babel-preprocessor.

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

Для CI-конвейеров применяются одноразовые запуски в headless-режиме, минимальные репорты и отсутствие интерактивного слежения:

singleRun: true,
autoWatch: false,
browsers: ['ChromeHeadless'],
reporters: ['dots', 'junit']

Такой формат сокращает объём лишнего вывода и ускоряет анализ результатов.

Гибкость и расширяемость

Конфигурационный файл karma.conf.js допускает условные ветвления, работу с внешними файлами конфигурации, объединение нескольких репортов и адаптацию под различную инфраструктуру. За счёт модульности плагины легко заменяются, а окружение остаётся прозрачным и повторяемым.