Конфигурация специфичная для фреймворков

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

Настройка фреймворка

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

Пример базовой конфигурации с Jasmine:

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

Особенности:

  • Порядок указания фреймворков важен, особенно при использовании нескольких библиотек (например, Jasmine с Sinon).
  • Karma автоматически ищет плагин, соответствующий названию фреймворка, и подгружает его. Для Jasmine это karma-jasmine.

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

При использовании Mocha необходимо учитывать конфигурацию интерфейса и assertion-библиотеки. Karma поддерживает разные интерфейсы Mocha (bdd, tdd, qunit) через параметр client.mocha.

Пример конфигурации с Mocha и Chai:

module.exports = function(config) {
  config.set({
    frameworks: ['mocha', 'chai'],
    files: [
      'src/**/*.js',
      'test/**/*.spec.js'
    ],
    client: {
      mocha: {
        ui: 'bdd',
        timeout: 5000
      }
    },
    browsers: ['ChromeHeadless'],
    reporters: ['progress']
  });
};

Ключевые моменты:

  • client.mocha.ui определяет стиль описания тестов (describe/it для bdd, suite/test для tdd).
  • client.mocha.timeout задает максимальное время выполнения теста, что особенно важно для асинхронных операций.
  • Chai подключается через плагин karma-chai, что позволяет использовать различные assertion-стили: expect, should или assert.

Настройка специфичных для фреймворка плагинов

Каждый фреймворк может иметь собственные плагины Karma, которые расширяют возможности тестирования. Примеры таких плагинов:

  • karma-jasmine-html-reporter — визуальный HTML-репортер для Jasmine.
  • karma-mocha-reporter — удобный текстовый вывод для Mocha.
  • karma-phantomjs-launcher или karma-chrome-launcher — запуск тестов в разных браузерах.

Плагины подключаются через параметр plugins или автоматически, если они установлены через npm.

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

module.exports = function(config) {
  config.set({
    frameworks: ['jasmine'],
    files: ['src/**/*.js', 'test/**/*.spec.js'],
    reporters: ['progress', 'kjhtml'],
    browsers: ['Chrome'],
    plugins: [
      'karma-jasmine',
      'karma-chrome-launcher',
      'karma-jasmine-html-reporter'
    ],
    client: {
      clearContext: false
    }
  });
};

Обратите внимание:

  • client.clearContext: false оставляет HTML-отчет Jasmine видимым после запуска тестов.
  • Репортеры можно комбинировать для одновременного отображения результатов в консоли и в браузере.

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

Фреймворки требуют специфической конфигурации для асинхронных тестов. В Jasmine это достигается использованием done callback или async/await. В Mocha необходимо настроить таймаут через client.mocha.timeout для предотвращения ложных срабатываний.

Пример конфигурации для асинхронных тестов в Mocha:

client: {
  mocha: {
    timeout: 10000
  }
}

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

Особенности работы с Angular и React

Karma часто используется вместе с фреймворками, такими как Angular и React.

Angular:

  • Karma интегрируется через @angular/cli, который генерирует karma.conf.js.
  • Используется karma-jasmine и karma-chrome-launcher.
  • Файлы тестов автоматически включаются через angular.json.

React:

  • Karma менее распространен для React, но поддержка возможна через Babel и Webpack.
  • Необходима транспиляция JSX с помощью karma-webpack и babel-loader.
  • Конфигурация frameworks обычно включает Mocha/Chai или Jasmine в зависимости от выбранного стиля тестирования.

Практические советы

  • Указывать конкретные версии плагинов, чтобы избежать конфликтов с обновлениями фреймворков.
  • Настраивать browsers в зависимости от среды CI/CD (ChromeHeadless предпочтительнее для автоматизированных сборок).
  • Использовать singleRun: true для CI, и autoWatch: true для локальной разработки.
  • Совмещать несколько репортеров для визуального и консольного контроля качества тестов.

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