CODEWITHSUNDEEP
angularsonarqubeangular-clibambootest-coverage
m1b
m1b

Reputation: 11

How to "Enable front-end code coverage in sonarqube" for a Angular project

This is my dahsboard from Bamboo related to Sonarqube: https://i.sstatic.net/FU7c9.jpg

The project build result page looks like this: https://i.sstatic.net/DRltU.jpg

So, I want enable somehow test coverage in Bamboo to see unit tests reports. I mention that we have local coverage for my angular project.

Can you help me with this?

Upvotes: 1

Views: 16957

Answers (2)

Wesley Rolnick
Wesley Rolnick

Reputation: 891

You'll need to get the results into a format that SonarQube can interpret. Assuming you are using Jasmine/Karma this would be an LCOV format.

  1. Modify your build script to include the following line:

    ng test --code-coverage

  2. This should create a coverage folder in your angular project. However it will be in an html format. You'll also need to change the Karma runner so that it generates an lcov.info file:

    // karma.conf.js
// ....
coverageIstanbulReporter: {
   dir: require('path').join(__dirname, '../coverage'),
   reports: ['lcovonly'],
   fixWebpackSourcePaths: true
},
// ....

  3. Finally, Update the sonar-project.properties file with the following line so that SonarQube knows where to find the coverage:

    sonar.typescript.lcov.reportPaths=coverage/lcov/lcov.info

Upvotes: 8

Mark
Mark

Reputation: 116

Are you outputting the results to some sort of file or trying to get the results from SonarQube directly?

Generally, the test results are published in Bamboo by adding a Test Parser task and pointing it to a supported test output file.

Atlassian does have some good articles around writing your own test collector and reporter though, so you probably could write a custom parser to report directly from SonarQube over their API.

Upvotes: 0

Related Questions