Keep it Covered

Where you are

So you’ve set up your karma, and you have some tests.
How do you measure your tests ‘effectiveness’?

Code Coverage is how much of your code us covered by your tests.

karma-coverage

Meet karma-coverage. it’s a plugin for karma, that helps you measure the code coverage.
How does it work? It instruments your code before test run, and then it measures all the code that was executed during the test run.


First, install it:

npm install karma-coverage --save-dev

Then, you need to update your karma.conf.js file with the following:

config.set({
    
    ...
    
    preprocessors: {
          'src/**/*.js': ['coverage']
        },
    
    reporters: ['coverage'],  

    // optionally, configure the reporter
    coverageReporter: {
      type : 'html',
      dir : 'coverage/'
    }
    
    ...
    
})
  1. Add 'coverage' to your preprocessors array - instrumentation.
  2. Add 'coverage' to your reporters array.
  3. Configure coverageReporter entry - how do you want your report.

Personally, I also like the text-summary report:

coverageReporter: {
    reporters: [
            {
                type: 'html',
                dir: 'coverage/'
            },
            {
                type: 'text-summary'
            }
        ]
    }

This gives you a nice summary in your console:

====================== Coverage summary =======================
Statements   : 68.41% ( 13267/19394 )
Branches     : 50.21% ( 4262/8488 )
Functions    : 62.07% ( 2540/4092 )
Lines        : 68.46% ( 13249/19352 )
================================================================

Where you want to be

Now, le’ts say that your code coverage is 67%.
What you really want is to keep it that way. You want to fail test run if the code coverage get’s below your threshold.
Why?

  1. Someone might have added new code without proper testing - bad
  2. Someone might commit fdescribe() by mistake - terrible!

Well, since 2015 you can simply add check:

coverageReporter: {
  check: {
    global: {
       statements: 82,
       lines: 67,
       functions: 100,
       branches: 85
    }}
}

Summary

Check out my learn jasmine project, to see full settings.