In your package.json file you will need to include jest and jest-junit as dev dependencies setup the Jest testing to output results in Cobertura format, e.g.
"test": "jest --ci --coverage --reporters=jest-junit --reporters=default --coverageReporters=html --coverageReporters=cobertura",
Here is an example of what a simple Azure pipeline yml might look like. Items of special note are the exclusion of Views and Tests when the .NET Core testing is undertaken (I don’t want the 0% coverage of those items contaminating my overall results), and the combining of the Javasctipt cobertura-coverage.xml and .NET Core coverage.cobertura.xml files in the Report Generator step.
steps: - task: DotNetCoreCLI@2 displayName: Restore inputs: command: restore projects: '$(Parameters.RestoreBuildProjects)' steps: - task: Npm@1 displayName: 'npm install' inputs: workingDir: TestProject verbose: false steps: - task: Npm@1 displayName: 'npm test' inputs: command: custom workingDir: TestProject verbose: false customCommand: test steps: - task: PublishTestResults@2 displayName: 'Publish JS Test Results' inputs: testResultsFiles: junit.xml searchFolder: TestProject mergeTestResults: true steps: - task: DotNetCoreCLI@2 displayName: Build inputs: projects: '$(Parameters.RestoreBuildProjects)' arguments: '--configuration $(BuildConfiguration)' steps: - task: DotNetCoreCLI@2 displayName: 'Test dotnet' inputs: command: test projects: '$(Parameters.TestProjects)' arguments: '--configuration $(BuildConfiguration) /p:CollectCoverage=true /p:CoverletOutputFormat=cobertura /p:Exclude=[TestProject.Views]*%2c[TestProject.Tests]*' steps: - script: | dotnet tool install -g dotnet-reportgenerator-globaltool reportgenerator -reports:$(Build.SourcesDirectory)/**/*[Tt]ests/**/coverage.cobertura.xml;$(Build.SourcesDirectory)/**/coverage/cobertura-coverage.xml -targetDir:$(Build.SourcesDirectory)/CodeCoverage -reporttypes:HtmlInline_AzurePipelines;Cobertura displayName: 'Create Code Coverage Report' steps: - task: PublishCodeCoverageResults@1 displayName: 'Publish code coverage' inputs: codeCoverageTool: Cobertura summaryFileLocation: '$(Build.SourcesDirectory)/CodeCoverage/Cobertura.xml' reportDirectory: '$(Build.SourcesDirectory)/CodeCoverage' steps: - task: DotNetCoreCLI@2 displayName: Publish inputs: command: publish publishWebProjects: True arguments: '--configuration $(BuildConfiguration) --output $(build.artifactstagingdirectory)' steps: - task: PublishBuildArtifacts@1 displayName: 'Publish Artifact' inputs: PathtoPublish: '$(build.artifactstagingdirectory)'
Once you have the pipeline running you will end up with a new tab in the results named “Code Coverage”, here is an example test project output:
Underneath the summary are more detailed coverage results that you can drill into to see where you can improve.