Codecov, Github actions and Angular 11 "No coverage report found"

Question

I am trying to publish a code coverage of an Angular (v11) library to Codecov.io through Github actions

I have set it up the official Codecov github actions from the marketplace

name: tests

on:
  pull_request:
    branches: [ master ]

jobs:
  build:
    # Machine environment:
    # We specify the Node.js version manually below, and use versioned Chrome from Puppeteer.
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - name: Use Node.js 14
        uses: actions/setup-node@v1
        with:
          node-version: 14
      - name: Install dependencies
        run: npm install
      - name: Build
        run: npm run build-lib
      - name: Test
        run: npm run test-lib-headless

      - name: Codecov
        uses: codecov/[email protected]

task in package.json

"test-lib-headless": "ng test ngx-scrollbar --watch=false --no-progress --browsers=ChromeHeadless --code-coverage",

karma.conf.js

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')
    ],
    client: {
      jasmine: {
        // you can add configuration options for Jasmine here
        // the possible options are listed at https://jasmine.github.io/api/edge/Configuration.html
        // for example, you can disable the random execution with `random: false`
        // or set a specific seed with `seed: 4321`
      },
      clearContext: false // leave Jasmine Spec Runner output visible in browser
    },
    jasmineHtmlReporter: {
      suppressAll: true // removes the duplicated traces
    },
    coverageReporter: {
      dir: require('path').join(__dirname, './coverage'),
      subdir: '.',
      reporters: [
        { type: 'html' },
        { type: 'text-summary' }
      ]
    },
    reporters: ['progress', 'kjhtml'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['Chrome'],
    customLaunchers: {
      ChromeHeadlessCI: {
        base: 'ChromeHeadless',
        flags: ['--no-sandbox']
      }
    },
    singleRun: false,
    restartOnFileChange: true,
    capabilities: {
      chromeOptions: {
        args: ["--headless"]
      },
      'browserName': 'chrome'
    },
  });
};

The coverage files are created in the coverage directory

In Github actions CI, it shows that codecov didn't find the files!

Why is the files not found even that they were generated locally? does Codecov look for different report extension? How can I make it work?

Answer 1

This is because default generated coverage report is not supported by codecov.

Simple solution is just adding lcov reporter to your config.

https://istanbul.js.org/docs/advanced/alternative-reporters/#lcovonly

coverageReporter: {
      dir: require('path').join(__dirname, './coverage/peach-tree'),
      subdir: '.',
      reporters: [
        { type: 'html' },
        { type: 'text-summary' },
        { type: 'lcovonly' },
      ]
    },

Then bash script provided from codecov will upload your report without any issue.