Кастомные репортеры

Karma — это мощный тест-раннер для JavaScript, который предоставляет возможность гибкой настройки отчетности о результатах тестирования через кастомные репортеры. Репортеры отвечают за сбор и вывод информации о прохождении тестов, их успехах и ошибках, а также за интеграцию с внешними системами, такими как CI/CD.

Архитектура репортеров

Репортер в Karma реализуется как JavaScript-класс, который подписывается на события тест-раннера. Основные события, на которые реагируют репортеры:

  • onRunStart(browsers): запускается перед началом тестирования, получает список браузеров.
  • onBrowserStart(browser): срабатывает при старте каждого браузера.
  • onSpecComplete(browser, result): вызывается после выполнения каждого теста, получает объект result с информацией о тесте: название, статус (success, failed, skipped), ошибки и длительность выполнения.
  • onBrowserComplete(browser): вызывается после завершения всех тестов в конкретном браузере.
  • onRunComplete(browsers, results): срабатывает после завершения всего тестирования, получает агрегированные результаты по всем браузерам.

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

Создание кастомного репортера

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

function MyCustomReporter(baseReporterDecorator, config, logger, helper, formatError) {
    baseReporterDecorator(this);

    const log = logger.create('reporter.mycustom');

    this.onRunSt art = function(browsers) {
        log.info('Начало тестирования на ' + browsers.length + ' браузерах.');
    };

    this.onSpecCompl ete = function(browser, result) {
        if (result.success) {
            log.info(`Тест "${result.description}" прошел успешно.`);
        } else {
            log.error(`Тест "${result.description}" не прошел: ${formatError(result.log)}`);
        }
    };

    this.onRunCompl ete = function(browsers, results) {
        log.info(`Тестирование завершено. Успешных: ${results.success}, неудачных: ${results.failed}`);
    };
}

MyCustomReporter.$inject = ['baseReporterDecorator', 'config', 'logger', 'helper', 'formatError'];

module.exports = {
    'reporter:mycustom': ['type', MyCustomReporter]
};

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

  • baseReporterDecorator(this) — обязательный вызов, который добавляет базовый функционал, включая форматирование ошибок и подсчет статистики.
  • logger — объект для логирования сообщений, вместо console.log рекомендуется использовать его.
  • formatError — утилита для форматирования ошибок в человекочитаемый вид.
  • $inject — массив зависимостей, которые Karma автоматически передает в конструктор.
  • Экспорт через объект с ключом вида 'reporter:имя' необходим для регистрации репортера в системе.

Подключение кастомного репортера

После создания файла с репортером, его необходимо подключить в конфигурации Karma (karma.conf.js):

module.exports = function(config) {
    config.set({
        frameworks: ['jasmine'],
        files: ['src/**/*.js', 'test/**/*.spec.js'],
        reporters: ['progress', 'mycustom'],
        plugins: [
            'karma-jasmine',
            'karma-chrome-launcher',
            require('./reporters/mycustom-reporter.js')
        ],
        browsers: ['ChromeHeadless']
    });
};
  • reporters — массив репортеров, которые будут использованы.
  • plugins — массив подключаемых плагинов, включая кастомные репортеры.

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

Кастомные репортеры позволяют реализовать:

  1. Вывод в нестандартные форматы: JSON, XML, CSV. Используется для интеграции с CI/CD, генерации отчетов для QA.
  2. Отправка результатов на сервер: через HTTP-запросы или WebSocket, чтобы хранить статистику тестов централизованно.
  3. Анализ производительности тестов: фиксация времени выполнения каждого теста и визуализация «тяжелых» тестов.
  4. Фильтрация и категоризация тестов: группировка по тегам, папкам или другим признакам для подробной отчетности.

Пример отправки результатов на сервер:

this.onRunCompl ete = function(browsers, results) {
    const payload = {
        total: results.success + results.failed + results.skipped,
        passed: results.success,
        failed: results.failed,
        timestamp: new Date().toISOString()
    };
    fetch('https://example.com/test-report', {
        method: 'POST',
        headers: {'Content-Type': 'application/json'},
        body: JSON.stringify(payload)
    });
};

Полезные рекомендации

  • Использовать baseReporterDecorator обязательно, чтобы не терялась базовая функциональность Karma.
  • Стараться не блокировать основной поток — длительные операции, такие как сетевые запросы или запись больших файлов, лучше выполнять асинхронно.
  • Для сложных репортеров можно наследовать существующие (например, mocha или junit) и расширять их функционал.
  • Локально тестировать репортер удобно, используя комбинацию log.info и onSpecComplete, чтобы видеть, как выводятся результаты.

Интеграция с CI/CD

Кастомные репортеры особенно полезны в автоматизированных пайплайнах:

  • Возможность генерации отчетов в формате XML позволяет интегрироваться с Jenkins, GitLab CI, TeamCity.
  • Возможность отправки метрик производительности тестов помогает выявлять узкие места в коде.
  • Централизованное логирование ошибок повышает прозрачность тестирования при множестве разработчиков.

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

Оглавление