Home

Awesome

Poncho

Build Status <a href="http://badge.fury.io/js/poncho"><img src="https://badge.fury.io/js/poncho@2x.png" alt="NPM version" height="18"></a> Dependency Status license MIT

Client-side JS code coverage using PhantomJS, Mocha and Blanket.

Install

$ npm i --save-dev poncho

Usage: poncho [options] <file>

Options:

  -h, --help             output usage information
  -V, --version          output the version number
  -R, --reporter [type]  reporter: plain (default) | lcov | json

Usage

Let's imagine that you already have Mocha client-side tests, something like this:

<!DOCTYPE html>

<head>
    <meta charset="utf-8"/>
    <title>Mocha Test</title>
    <link rel="stylesheet" href="mocha/mocha.css"/>
</head>

<body>
    <div id="mocha"></div>

    <!-- mocha -->
    <script src="mocha/mocha.js"></script>
    <script>mocha.setup('bdd');</script>

    <!-- target script -->
    <script src="script.js"></script>
    <!-- test file -->
    <script src="test.js"></script>

    <!-- run -->
    <script>mocha.run();</script>
</body>

All you need to do is add data-cover attribute to the target script tag:

<script src="script.js" data-cover></script>

…and run Poncho:

$ poncho test.html

Send data to coveralls.io

Install node-coveralls:

$ npm i --save-dev coveralls

…and pipe Poncho's lcov reporter to it:

$ poncho --reporter lcov test.html | coveralls

How it works?

You don't want to know. Seriosly. It's so hacky way that it can cause the blood from your eyes.