How to use Cobertura and JUnit reporters with LWC Jest?

Question

When creating a new SFDX project, the default Jest configuration for LWC unit tests looks like this:

jest.config.js

const { jestConfig } = require('@salesforce/sfdx-lwc-jest/config');

module.exports = {
  ...jestConfig,
  modulePathIgnorePatterns: ['<rootDir>/.localdevserver']
};

By running...

sfdx-lwc-jest --coverage

...it shows me the current test coverage in the console and generates a lcov coverage report in the /coverage directory of my project. However, I need coverage and test results generated with Cobertura and JUnit to be able to properly use them for reporting and publishing in an automated pipeline run. I wonder if it is possible to overwrite or extend this default predefined LWC Jest configuration in this regard?

Answer 1

I found out via the official Jest documentation that you can also overwrite or extend the configuration (Configuring Jest). If you do this as follows, you can also use Cobertura, JUnit or even other reporters:

Cobertura

To use Cobertura or other coverage reporters and formats you just need to add the following line to the existing Jest configuration file:

coverageReporters: ['clover', 'json', 'text', 'lcov', 'cobertura'],

JUnit

To have JUnit support enabled you need an additional npm package called jest-junit that can be installed as a dev dependency as follows:

npm i jest-junit --save-dev

To then use this reporter in Jest, it must also be added to the configuration file. The final Jest configuration would then look like this:

const { jestConfig } = require('@salesforce/sfdx-lwc-jest/config');

module.exports = {
  ...jestConfig,
  coverageReporters: ['clover', 'json', 'text', 'lcov', 'cobertura'],
  modulePathIgnorePatterns: ['/.localdevserver'],
  reporters: [
    'default',
    [
      'jest-junit',
      {
        outputDirectory: 'tests',
        outputName: 'test-results-lwc.xml'
      }
    ]
  ]
};