Sonarqube coverage configuration for React and Jest

B.Ohara picture B.Ohara · Aug 2, 2018 · Viewed 19.4k times · Source

I have problem with configuration sonarqube to work properly with React + Jest.

My configuration:

my_moudle.sonar.projectBaseDir=front_app my_module.sonar.javascript.file.suffixes=.js,.jsx

my_module.sonar.tests=src

my_module.sonar.test.inclusions=**/__tests__/** my_module.sonar.javascript.lcov.reportPaths=coverage/lcov.info

Currently I point to the src folder as tests folder because I have set of tests for each component in tests folder at the same project folder. Thanks to SonarJS I have proper coverege for my project, but I don't know why I can't see amount of unit tests in coverage measures metrics. Any checked configuration will be appreciate.

Thanks, Barb

Answer

dubes picture dubes · Aug 21, 2018

SonarJS is not responsible for Unit test reports, (Relevant FAQ entry) It is the responsibility of SonarQube to import the Unit test report.

I have managed to do it with the following setup.

First we need to convert the jest results into sonar consumable format. For this, I used the following npm module: jest-sonar-reporter.

Snippet of my package.json:

"devDependencies": {
   ...
    "jest": "^21.1.0",
    "jest-sonar-reporter": "^1.3.0",
    ...
  },
  "jestSonar": {
    "sonar56x": true,
    "reportPath": "testResults",
    "reportFile": "sonar-report.xml",
    "indent": 4
  }

You can will now need to tell jest to use this module as a processor and tell sonar scanner to use the file produced by this module. The instructions are in the official documentation.

If you are using create-react-app/react-scripts though, you may need a few additional steps, as all configuration is not exposed by them.

You will need to modify your entry for test in scripts block in package.json to:

"test": "react-scripts test --env=jsdom --testResultsProcessor ./node_modules/jest-sonar-reporter/index.js