CI Code Coverage + Tests in 5 Minutes!

by Zach Silveira •  Filed under javascript

Building open source software can be lots of fun. For some reason, it brings me way too much joy seeing code coverage and tests run on every push to github. It doesn't need to be hard to setup; I'm going to show you how to add automated testing and code coverage reporting to your apps and libraries for every push, pull request, and merge! Here's what we need to get started:

Jest

Jest is the best test runner out there right now. It may not be the absolute fastest, but it has the easiest and most useful features that you're going to need. If you use mocha, you'll end up installing istanbul or something else that will run coverage. You want snapshot testing? Jest has that built in too.

Coveralls

Coveralls is a free service for open source projects that will store your coverage report and give you a badge to add in your repo with the latest stats! We'll use node-coveralls to handle sending it over.

CircleCI

I use circleci for automated builds, it's free for open source as well. This will trigger a build that runs our tests and coverage report on every push to github.

That's all we need! If you're overwhelmed, you'll be shocked to find out how easy this is to setup. We only need to create a few files and then our app is set up!

App Setup

yarn add jest babel-jest node-coveralls  

Now, create config.json in your app:

{
  "testMatch": ["<rootDir>/tests/unit/*.js"],
  "setupFiles": ["<rootDir>/tests/setup.js"],
  "transform": {".*": "<rootDir>/node_modules/babel-jest"},
  "moduleFileExtensions": ["js"],
  "collectCoverageFrom": [
    "src/*.js",
    "!src/index.js" //exclude files
  ]
}

Modify this to your needs! It should be easy to understand, if not, take a look at the jest docs.

Now, let's make the file for circleci, it needs to be circle.yml in the root of your app:

machine:  
  node:
    version: 7.7.4
test:  
  override:
    - npm run test-ci

Let's add that command to our package.json:

    "test-ci": "jest --config config.json --coverage && cat ./coverage/lcov.info | ./node_modules/coveralls/bin/coveralls.js"

We are so close! Go sign in to circleci, find your project and tell it to build. Now go to this page:

https://circleci.com/gh/organization/project/edit#env-vars  

Change that to your github org / project name. Open a new tab, sign up for coveralls. It will be a similar process as signing up for CircleCI.

Once you add your repo, you will be presented with a repo_token. Copy this key, go back into circle ci, and add an env variable called COVERALLS_REPO_TOKEN and paste the value from coveralls.

Now if you add some tests to jest and push it up to github, it will be tested and coverage will be sent to coveralls.

Conclusion

Phew, I can breathe now. After copying, pasting, and signing up for these services, you should have clocked in at just under 5 minutes!

Add this to the top of your project readme, and let me know if you liked this quick guide!

[![CircleCI](https://circleci.com/gh/organization/project.svg?style=svg)](https://circleci.com/gh/organization/project)
[![Coverage Status](https://coveralls.io/repos/github/organization/project/badge.svg?branch=master)](https://coveralls.io/github/organization/project?branch=master)

If anything needs clarification, feel free to comment or tweet me.

zach.codes newsletter

If you liked this post, please consider subscribing to my semi-weekly newsletter!