Проксирование запросов

Karma — это тестовый раннер для JavaScript, который позволяет запускать тесты в реальных браузерах. Одной из часто используемых возможностей Karma является проксирование HTTP-запросов, что особенно важно при тестировании приложений, взаимодействующих с бекендом через API.

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

Настройка прокси в Karma

Для проксирования используется конфигурационный файл karma.conf.js, где в объекте config задаются необходимые опции. Основные параметры:

module.exports = function(config) {
  config.set({
    basePath: '',
    frameworks: ['jasmine'],
    files: [
      'src/**/*.js',
      'test/**/*.spec.js'
    ],
    proxies: {
      '/api/': 'http://localhost:3000/api/',
      '/images/': 'http://cdn.example.com/images/'
    },
    port: 9876,
    browsers: ['ChromeHeadless'],
    singleRun: true
  });
};
  • proxies — объект, где ключи представляют исходные пути, а значения — URL, на который нужно перенаправлять запросы.
  • Прокси работает на уровне HTTP, что позволяет тестам делать обычные fetch или XMLHttpRequest, а Karma автоматически перенаправляет запрос на указанный URL.
  • Пути должны оканчиваться слэшем, чтобы корректно обрабатывались вложенные ресурсы.

Примеры использования

  1. Тестирование API без запуска полноценного сервера

Если приложение делает запросы на /api/users, но бекенд пока недоступен или необходимо имитировать определённые данные, можно проксировать запросы на локальный мок-сервер:

proxies: {
  '/api/': 'http://localhost:3000/mock-api/'
}

Таким образом, тесты будут получать предсказуемый ответ и не зависеть от внешнего API.

  1. Проксирование статических ресурсов

Для фронтенд-приложений с динамическими ресурсами можно проксировать запросы на CDN:

proxies: {
  '/assets/': 'http://cdn.example.com/assets/'
}

Тесты смогут загружать файлы точно так же, как в реальном приложении.

Особенности работы с прокси

  • Karma использует встроенный сервер Express, поэтому прокси-настройки работают на уровне HTTP.
  • Проксированные запросы не изменяют заголовки по умолчанию, но можно комбинировать их с middleware для изменения поведения.
  • Для работы с разными методами HTTP (GET, POST, PUT, DELETE) Karma прокси полностью поддерживает все стандартные методы.
  • Путь запроса в браузере должен совпадать с ключом из объекта proxies, иначе прокси не сработает.

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

Middleware для проксированных запросов

Можно добавлять собственные функции middleware через параметр middleware:

module.exports = function(config) {
  config.set({
    frameworks: ['jasmine'],
    files: ['test/**/*.spec.js'],
    proxies: {
      '/api/': 'http://localhost:3000/api/'
    },
    middleware: ['custom'],
    customMiddleware: function(req, res, next) {
      if (req.url.startsWith('/api/')) {
        req.headers['X-Test-Header'] = 'karma';
      }
      next();
    }
  });
};

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

Проксирование нескольких путей

Karma поддерживает множественные прокси:

proxies: {
  '/api/': 'http://localhost:3000/api/',
  '/auth/': 'http://localhost:3001/auth/',
  '/static/': 'http://cdn.example.com/static/'
}

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

Отладка проксированных запросов

Для проверки корректности работы прокси:

  1. Включить логирование в Karma:
logLevel: config.LOG_DEBUG
  1. Следить за URL, на который фактически уходят запросы.
  2. Проверять ответы через Network в DevTools браузера, запущенного Karma.
  3. Убедиться, что ключи в объекте proxies соответствуют путям запросов в приложении.

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

  • Использовать прокси для изоляции тестов от внешних сервисов.
  • Для мокирования API лучше запускать локальный сервер с тестовыми данными.
  • Проверять корректность слэшей в ключах и значениях proxies.
  • В сложных случаях комбинировать прокси с middleware для контроля заголовков и обработки специфичных сценариев.

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

Оглавление