Get code coverage reports with Github Actions and Codecov

#coverage #jest #github #testing

So, you've spent some time getting tests set up on your project. How do you show the world?

A popular service is Codecov, and you'll probably recognise their badges from Github repositories:

However

Codecov is a static analysis tool, which means you have to upload reports that have already been tested. One option is to commit your coverage folder, but this is a bad idea:

You have to run your tests before every commit. Chances are you'll forget, and your coverage will be out of date.
You won't be able to edit away from your main computer (i.e. you can't update the tests from your phone).
It isn't automated enough, and everyone knows more automation is better.
Probably loads of bad things.

Github Actions to the rescue!

Github Actions is a fairly new (I think?) feature that allows you to add CI to your project.

There's a few default templates, but unfortunately none that I could find for running tests and sending the reports over to Codecov.

Set up a Github Action

Github actions are stored in .github/workflows, and are YAML files that specify how the job should run. Check out the docs to find out more.

We'll set up a simple task by adding a file called codecov-test-suites.yml and adding the following:

# .github/workflows/codecov-test-suites.yml

name: Run Test Suites

on: [push]

This sets up a new workflow that triggers for every push.

Now we need to make it do things! You need to add a job to this file, which does the following:

Fetches the files
Installs the dependencies
Runs the test
Uploads the test to Codecov

This is easy. Add this to the codecov-test-suites.yml file:

jobs:
  test:
    runs-on: ubuntu-latest
    steps:
    - uses: actions/checkout@v2 # Check out your repository
    - run: yarn # Install dependencies
    - run: yarn test --coverage # Run test
    - run: bash <(curl -s https://codecov.io/bash) # Upload to Codecov

Your test should run, but apparently you have 0% coverage. What?

It turns out the tests are run in a weird folder, and this doesn't tie up with your repository structure, so Codecov gets confused.

To fix this, you need to add a codecov.yml file to your project root. In here, we'll specify how to fix the file paths:

# codecov.yml

fixes:
  - "/home/runner/work/<project name>/<project name>/::" # Correct paths

Edit <project name> to your repository name from Github, and commit this.

Huzzah! Github Actions should now be automagically running tests every time you push and sending to Codecov!

Be sure to head to Codecov's badge settings and get that sweet SVG goodness:

Remember that 100% badge from earlier?

The money

// package.json

{
  // Make sure jest creates lcov reports
  "jest": {
    "collectCoverage": true,
    "coverageReporters": ["html", "lcov"]
  }
}

# .github/workflows/codecov-test-suites.yml

name: Run Test Suites

on: [push]

jobs:
  test:
    runs-on: ubuntu-latest
    steps:
    - uses: actions/checkout@v2 # Check out your repository
    - run: yarn # Install dependencies
    - run: yarn test --coverage # Run test
    - run: bash <(curl -s https://codecov.io/bash) # Upload to Codecov

# codecov.yml

fixes:
  - "/home/runner/work/<project name>/<project name>/::" # Correct paths

Top comments (3)

Se-ok Jeon • Oct 17 '21

Thx for this! This is really what I wanted. Helped A LOT.
Can I translate in Korean this article? If you don't mind, I wanna share this awesome information in Korean. Surely, There will be a link directing to this original one.