Использование Jenkins и SonarQube для создания отчетов о покрытии тестовых модулей

Прошлая неделя была для меня отличной. Наконец-то я получил SonarQube забрать отчет о тестовом покрытии. Я дам вам пошаговое руководство, как я этого добился. Я очень надеюсь, что этот урок окажется для вас полезным.

Я предполагаю, что вы уже используете React и Jenkins, но вы просто хотите, чтобы SonarQube мог читать отчеты о тестовом покрытии. Я также предположил, что вы уже написали свои модульные тесты.

Шаг 1. Настройте файл Package.json

Первый шаг - настроить файл package.json. Create-React-App уже поставляется с файлом package.json и jest в качестве инструмента тестирования по умолчанию. Все, что вам нужно сделать, это настроить другие параметры для шутки, такие как формат отчета о тестовом покрытии или путь покрытия, в зависимости от обстоятельств. Ниже приведен пример конфигурации:

Обратите внимание, что я написал сценарий coverage:prod для модульности. Это помогает нам использовать одну команду для запуска наших тестов в разных средах. Обратите внимание, что он содержит те же команды без --_ 2_ . Команда --_ 3_ отслеживает изменения в файлах и повторно запускает все тесты, когда что-то меняется. В производственной среде или среде CI этот параметр не требуется. Вы можете узнать больше о файле package.json здесь

Шаг 2. Выполнение команд тестирования и тестирования покрытия локально

В вашем терминале введите команду ниже, чтобы запустить тест:

npm test or npm run test

После завершения теста вы должны увидеть что-то вроде изображения ниже.

Также введите в терминале команду ниже, чтобы создать отчет о покрытии:

npm run test --coverage --watchAll

вы должны увидеть новую папку под названием охват в корневом каталоге вашего проекта. Когда вы откроете папку Покрытие, вы должны увидеть что-то вроде следующего.

При переходе к lcov-report ›index.js вы должны увидеть отчет в формате html, который выглядит как на изображении ниже. Если у вас есть эти два, значит, мы на одной странице. Большой! Приступим.

Шаг 3. Настройте Package.json для среды CI

Вам нужно будет немного настроить файл package.json. Существует множество форматов отчетов об испытаниях, поддерживаемых различными инструментами CI. Выше я показал формат отчета html. Основное внимание в этом руководстве уделяется React, Jenkins и SonarQube, поэтому я сосредоточусь больше на форматах отчетов cobertura и lcov. Sonar cube поддерживает множество форматов отчетов, но поскольку это проект React, мы сосредоточимся на формате отчетов lcov.

На локальном компьютере, если вы попытаетесь запустить тест с помощью npm run test, вы заметите, что, когда все тесты завершились, терминал не завершает процесс. Если вы находитесь в среде CI, произойдет то же самое, что приведет к блокированию выполнения других команд. Чтобы решить эту проблему, вам нужно будет сообщить своему терминалу, что вы находитесь в среде CI, используя любую из приведенных ниже команд. Обратите внимание, что команды различаются в зависимости от используемого вами терминала. Вы также можете протестировать это локально, и вы увидите, что ваши тесты теперь завершаются после запуска. Круто, правда?

Windows (cmd.exe)

set CI=true&&npm test
set CI=true&&npm run build

(Примечание: отсутствие пробелов намеренно.)

Windows (Powershell)

($env:CI = "true") -and (npm test)
($env:CI = "true") -and (npm run build)

Linux, macOS (Bash)

CI=true npm test
CI=true npm run build

Чтобы запустить тестовое покрытие, вам нужно будет выполнить следующие команды

npm run test --coverage --watchAll

Шаг 4. Запустите тесты в jenkins

Когда вы будете готовы запустить мои тесты и отчет о покрытии в среде Jenkins CI, я буду использовать следующие команды (при условии, что я использую Windows PowerShell)

($env:CI = "true") -and (npm run coverage:prod -u)

После завершения тестового запуска я смогу увидеть папку с именем охват (или любое другое имя папки, которое вы указали для пути к отчету о покрытии в своем package.json) в папке рабочей области Jenkins. Внутри этой папки вы увидите отчеты об испытаниях, созданные в разных форматах. Файл lcov.info - это именно то, что вам нужно для связи с SonarQube.

Шаг 5. Настройте свойства SonarQube в Jenkins

В файл свойств анализа SonarQube включите следующее:

После завершения установки вы должны сохранить конфигурацию Jenkins и перезапустить сборку. Вы должны увидеть анализ отчетов о покрытии в SonarQube.

Шаг 6. Настройте отчет Cobertura на Jenkins

Обратите внимание, что в приведенном выше файле package.json формат cobertura report является одним из отчетов о покрытии. Этот формат отчета можно использовать для отображения отчетов о тестировании в Jenkins, если вы не хотите использовать SonarQube. В Jenkins добавьте действие пост-сборки под названием опубликовать отчет о покрытии corbertura. Включите путь к файлу покрытия corbertura, как показано ниже.