Условная загрузка файлов

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

Конфигурация файлов через karma.conf.js

Основной способ управления файлами — секция files в конфигурационном файле Karma. Она принимает массив объектов или строк, описывающих ресурсы:

files: [
  'src/**/*.js',
  { pattern: 'test/helpers/*.js', included: false },
  { pattern: 'test/data/*.json', watched: true, served: true, included: false }
]

Ключевые параметры объектов:

  • pattern — путь к файлу или шаблон (glob).
  • included — определяет, будет ли файл автоматически вставлен через <script> в браузер при запуске тестов. Значение false полезно для библиотек или JSON-данных, которые подгружаются динамически.
  • served — указывает, будет ли файл доступен через HTTP-сервер Karma.
  • watched — определяет, будет ли Karma следить за изменениями файла и перезапускать тесты при его изменении.

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

Karma поддерживает динамическое формирование списка файлов через функцию:

files: function(config) {
  const env = process.env.TEST_ENV || 'default';
  const commonFiles = ['src/**/*.js', 'test/helpers/*.js'];

  if (env === 'integration') {
    return commonFiles.concat(['test/integration/**/*.spec.js']);
  }

  return commonFiles.concat(['test/unit/**/*.spec.js']);
}

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

Предварительная обработка файлов (preprocessors)

Условная загрузка часто комбинируется с предобработкой:

preprocessors: {
  'src/**/*.js': ['babel'],
  'test/**/*.spec.js': ['babel', 'coverage']
}

Это позволяет:

  • Транспилировать код ES6+ через Babel только при запуске тестов.
  • Собирать покрытие кода через karma-coverage.
  • Исключать ненужные файлы из обработки в зависимости от окружения.

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

Загрузка JSON и других ресурсов

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

files: [
  { pattern: 'test/data/*.json', included: false, served: true }
],
proxies: {
  '/data/': '/base/test/data/'
}

В тестах можно динамически получать данные:

fetch('/data/sample.json')
  .then(response => response.json())
  .then(data => {
    expect(data).toHaveProperty('name');
  });

Параметр base указывает на корень проекта, под которым Karma обслуживает файлы. Использование proxies позволяет создавать удобные алиасы для путей.

Интеграция с модулями и сборщиками

При работе с системами модулей (CommonJS, ES Modules) условная загрузка файлов выполняется через механизмы сборщиков (Webpack, Rollup) и Karma-плагины:

frameworks: ['mocha', 'webpack'],
files: [
  { pattern: 'test/**/*.spec.js', watched: false }
],
webpack: {
  mode: 'development',
  module: {
    rules: [
      { test: /\.js$/, loader: 'babel-loader' }
    ]
  }
}

Файлы подключаются через Webpack, а Karma получает готовый бандл. Условное включение модулей можно реализовать с помощью динамического import() внутри тестов, что позволяет загружать модули только при необходимости:

if (process.env.FEATURE_X_ENABLED) {
  const moduleX = await import('../. ./src/moduleX.js');
  moduleX.doSomething();
}

Совмещение с плагинами Karma

Многие плагины Karma (например, karma-coverage, karma-sourcemap-loader) позволяют настраивать файлы с условной предобработкой. Использование шаблонов glob и флагов included: false или served: true совместно с плагинами обеспечивает:

  • Гибкое управление зависимостями.
  • Отдельную обработку тестовых данных.
  • Поддержку разных окружений без дублирования конфигурации.

Практические рекомендации

  • Для больших проектов разделять файлы по типу: код приложения, тестовые сценарии, фикстуры, вспомогательные скрипты.
  • Использовать переменные окружения для определения, какие тесты и ресурсы загружать.
  • Всегда проверять параметры included и served, чтобы файлы не дублировались и не мешали друг другу.
  • При динамическом import() учитывать, что браузер должен поддерживать промисы и модульную систему, либо использовать транспиляцию через Babel.

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

Оглавление