Покрытие кода

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

Предварительные требования

Чтобы создавать отчёты о покрытии кода с помощью Vitest, необходимо установить пакет @vitest/coverage-v8:

npm install --save-dev @vitest/coverage-v8

yarn add --dev @vitest/coverage-v8

pnpm add -D @vitest/coverage-v8

bun add --dev @vitest/coverage-v8

Создание отчёта

Чтобы создать отчёт о покрытии кода, добавьте флаг --coverage к команде ng test:

ng test --coverage

После выполнения тестов команда создаст в проекте новый каталог coverage/. Откройте файл index.html, чтобы просмотреть отчёт с исходным кодом и значениями покрытия кода.

Если вы хотите создавать отчёты о покрытии кода при каждом запуске тестов, можно задать для параметра coverage значение true в файле angular.json:

{
  "projects": {
    "your-project-name": {
      "architect": {
        "test": {
          "builder": "@angular/build:unit-test",
          "options": {
            "coverage": true
          }
        }
      }
    }
  }
}

Контроль пороговых значений покрытия кода

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

Например, предположим, что вы хотите, чтобы покрытие кодовой базы составляло не менее 80%. Чтобы включить это ограничение, добавьте параметр coverageThresholds в файл angular.json:

{
  "projects": {
    "your-project-name": {
      "architect": {
        "test": {
          "builder": "@angular/build:unit-test",
          "options": {
            "coverage": true,
            "coverageThresholds": {
              "statements": 80,
              "branches": 80,
              "functions": 80,
              "lines": 80
            }
          }
        }
      }
    }
  }
}

Теперь, если при запуске тестов покрытие опустится ниже 80%, команда завершится с ошибкой.

Расширенная конфигурация

В файле angular.json можно настроить несколько других параметров покрытия:

• coverageInclude: шаблоны glob для файлов, включаемых в отчёт о покрытии.
• coverageExclude: шаблоны glob для файлов, исключаемых из отчёта о покрытии.
• coverageReporters: массив средств формирования отчётов (например, html, lcov, json).
• coverageWatermarks: объект, задающий [low, high] для HTML-отчёта, которые могут влиять на цветовое выделение данных в отчёте.

{
  "projects": {
    "your-project-name": {
      "architect": {
        "test": {
          "builder": "@angular/build:unit-test",
          "options": {
            "coverage": true,
            "coverageReporters": ["html", "lcov"],
            "coverageWatermarks": {
              "statements": [50, 80],
              "branches": [50, 80],
              "functions": [50, 80],
              "lines": [50, 80]
            }
          }
        }
      }
    }
  }
}