Debug режим

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

Включение Debug режима

Для активации Debug режима в Karma необходимо изменить конфигурацию запуска тестов. Основной инструмент — флаг singleRun и логирование уровня DEBUG. Пример конфигурации:

module.exports = function(config) {
  config.set({
    basePath: '',
    frameworks: ['jasmine'],
    files: [
      'src/**/*.js',
      'test/**/*.spec.js'
    ],
    browsers: ['Chrome'],
    singleRun: false,  // отключает автоматический выход после тестов
    autoWatch: true,   // включает слежение за изменениями файлов
    logLevel: config.LOG_DEBUG // выводит максимальный уровень логов
  });
};

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

singleRun: false позволяет оставлять браузер открытым после выполнения тестов, что удобно для отладки.
autoWatch: true автоматически перезапускает тесты при изменении файлов.
logLevel: config.LOG_DEBUG выводит подробную информацию о загрузке файлов, инициализации фреймворка и выполнении тестов.

Использование Karma Debug Page

При запуске Karma в режиме слежения (autoWatch: true) доступна специальная страница для отладки: http://localhost:9876/debug.html. Она предоставляет возможность:

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

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

Логирование и трассировка ошибок

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

reporters: ['progress', 'kjhtml'],

progress выводит прогресс тестов в терминале.
kjhtml добавляет интерактивный HTML-отчет в браузере, где каждая ошибка сопровождается полным стеком вызовов.

Для асинхронных тестов рекомендуется использовать встроенные функции Jasmine, такие как done() и async/await, чтобы ошибки не терялись при выполнении промисов.

Отладка отдельных тестов

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

Пример фильтрации тестов в Karma:

karma start --grep="название_теста"

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

Совместная работа с DevTools

Использование Chrome DevTools в сочетании с Debug режимом Karma дает максимальную гибкость:

Можно ставить точки останова (breakpoints) прямо в исходном коде и тестах.
Отслеживать вызовы функций и значения переменных.
Пошагово выполнять асинхронный код, промисы и колбэки.

Для этого необходимо запускать Karma с браузером в режиме разработчика и открывать debug.html.

Особенности работы с модульными системами

В проектах с модульными системами (ES Modules, CommonJS, Webpack) Debug режим Karma обеспечивает:

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

Настройка Source Maps:

webpack: {
  mode: 'development',
  devtool: 'inline-source-map'
}

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

Использование плагинов для расширенной отладки

Karma поддерживает плагины, расширяющие возможности Debug режима:

karma-sourcemap-loader — обеспечивает корректную работу Source Maps.
karma-coverage — позволяет видеть, какие части кода покрыты тестами и какие нет.
karma-chrome-launcher с флагом --remote-debugging-port=9222 — дает доступ к Chrome DevTools для внешней отладки.