Как измерить покрытие кода тестами?angular-99

Покрытие кода тестами (test coverage) — это метрика, показывающая, какая часть исходного кода выполняется при запуске тестов. В Angular-проектах для измерения покрытия чаще всего используется инструмент Istanbul (входит в состав Karma/Jest).

Основные метрики покрытия

  1. Function coverage — % покрытых функций/методов
  2. Statement coverage — % выполненных строк кода
  3. Branch coverage — % покрытых ветвлений (if/else, switch)
  4. Line coverage — % покрытых строк (аналогично statement, но с нюансами)

Настройка измерения покрытия в Angular

1. Для Karma

// karma.conf.js
module.exports = function(config) {
  config.set({
    coverageReporter: {
      type: 'html',
      dir: 'coverage/'
    },
    reporters: ['progress', 'coverage'],
    preprocessors: {
      'src/**/*.ts': ['coverage']
    }
  });
};

Запуск тестов с покрытием:

ng test --code-coverage

2. Для Jest

// jest.config.js
module.exports = {
  collectCoverage: true,
  coverageDirectory: "coverage",
  coverageReporters: ["html", "text-summary"],
  collectCoverageFrom: [
    "src/app/**/*.{ts,js}",
    "!src/app/**/*.spec.{ts,js}",
    "!src/app/**/*.module.{ts,js}"
  ]
};

Запуск:

npm test -- --coverage

Интерпретация результатов

После запуска в папке coverage появится:

  1. HTML-отчет (интерактивный просмотр по файлам)
  2. Текстовый отчет (краткая сводка в консоли)

Пример консольного вывода:

----------------|---------|----------|---------|---------|-------------------
File            | % Stmts | % Branch | % Funcs | % Lines | Uncovered Line #s
----------------|---------|----------|---------|---------|-------------------
All files       |   85.42 |    73.33 |   82.35 |   86.36 |
 app/           |   91.3  |    80    |   90    |   92.31 |
  component.ts  |   90    |    75    |   100   |   90    | 24-25
----------------|---------|----------|---------|---------|-------------------

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

  1. Минимальные требования:
    • Критический бизнес-логика: 80-90%
    • Обычные компоненты: 60-70%
  2. Исключайте из отчета:
    • Файлы с декларациями (.module.ts)
    • Тестовые файлы
    • Автогенерируемый код
  3. Интеграция с CI:
    • Добавляйте проверку покрытия в pipeline
    • Используйте threshold (пороговые значения)
// package.json
"scripts": {
  "test:ci": "ng test --no-watch --code-coverage --browsers=ChromeHeadless",
  "check-coverage": "ng test --code-coverage && grep -q 'All files.*80' coverage/coverage-summary.json"
}

Альтернативные инструменты

  1. SonarQube — для enterprise-решений
  2. Coveralls — облачное решение с GitHub интеграцией
  3. Codecov — детализированная аналитика

Резюмируем

измерение покрытия кода в Angular-проектах настраивается за несколько минут через Karma/Jest + Istanbul. Ключевое — не гнаться за 100%, а обеспечить осмысленное покрытие критических участков кода и интегрировать проверку в процесс CI/CD.

Вопросы

Собеседования