Is there a karma plugin / or another way that can generate a coverage .xml suited for Sonarqube?

Question

Issue: SonarQube coverage is 0% after I configured karma and sonar. Unit tests are recognized.

Arch: Angular 13, Node v11.11 and latest SonarQube.

Issue Desc: The code coverage is always displayed as 0% because SonarQube wants a separate .xml for coverage – yet the only plugin that I found that creates .xml reports is cobertua, but its formatting doesn't fit with what SonarQube expects.

There is a sonarQubeUnitReporter that creates correct unit-test .xml files, but I couldn't find anything similar for coverage .xml files.

Please see my code as below:

karma.conf.js:

// Karma configuration file, see link for more information
// https://karma-runner.github.io/1.0/config/configuration-file.html

module.exports = function (config) {
  config.set({
    basePath: '',
    frameworks: ['jasmine', '@angular-devkit/build-angular'],
    plugins: [
      require('karma-jasmine'),
      require('karma-chrome-launcher'),
      require('karma-jasmine-html-reporter'),
      require('karma-coverage'),
      require('@angular-devkit/build-angular/plugins/karma'),
      require('karma-sonarqube-unit-reporter'),
    ],
    client: {
      clearContext: false, // leave Jasmine Spec Runner output visible in browser
    },
    coverageReporter: {
      dir: require('path').join(__dirname, './coverage'),
      reporters: [
        { type: 'html', subdir: 'html-report' },
        { type: 'lcov', subdir: 'lcov-report' },
        { type: 'cobertura', subdir: 'reports/coverage.xml'}
      ],
      fixWebpackSourcePaths: true,
    },
    reporters: ['progress', 'kjhtml', 'coverage', 'sonarqubeUnit'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['ChromeHeadless'],
    singleRun: false,
    restartOnFileChange: true,
    sonarQubeUnitReporter: {
      sonarQubeVersion: 'LATEST',
      outputFile: 'reports/ut_report.xml',
      overrideTestDescription: true,
      testPaths: ['./src'],
      testFilePattern: '.spec.ts',
      useBrowserName: false
    },
  });
};

sonar.project.properties:

sonar.projectKey=TEST
sonar.token= ***
sonar.sourceEncoding=UTF-8
sonar.sources=src
sonar.tests=src
sonar.exclusions=**/node_modules/**
sonar.test.inclusions=**/*.spec.ts
sonar.javascript.lcov.reportPaths=./coverage/lcov-report/
# sonar.coverageReportPaths =./coverage/reports/cobertura-coverage.xml
sonar.testExecutionReportPaths=src/reports/ut_report.xml

Had to disable the sonar.coverageReportPaths because the cobertura-coverage.xml threw an exeption.

Required .xml formatting from SonarQube documentation:

https://docs.sonarsource.com/sonarqube/latest/analyzing-source-code/test-coverage/generic-test-data/

<coverage version="1">
  <file path="xources/hello/NoConditions.xoo">
    <lineToCover lineNumber="6" covered="true"/>
    <lineToCover lineNumber="7" covered="false"/>
  </file>
  <file path="xources/hello/WithConditions.xoo">
    <lineToCover lineNumber="3" covered="true" branchesToCover="2" coveredBranches="1"/>
  </file>
</coverage>Generic Test Execution Report Format

How my report looks like: