Add html-cov reporter #10

Closed
limpbrains opened this Issue Oct 3, 2012 · 19 comments

Comments

Projects
None yet
8 participants

Hi, thanks for the great tool.

Can you add support of html-cov/json-cov reporters from mocha.

Thanks

@metaskills metaskills closed this in 613bc19 Oct 5, 2012

Collaborator

metaskills commented Oct 5, 2012

Done, could you tell me how you instrument mocha-phantomjs with node-jscoverage to utilize these? Would be a good addition to the README.

Ok, will try.
First of all you need to instrument you JS code, using jscoverage tool. I'm using one from ubuntu repos, but it's outdated and I have to run it with jscoverage --nohighlight. Another one comes with node-jscoverage.

Then you just run phantomjs mocha-phantomjs.coffee http://localhost:3000/ json-cov and recieve coverage report in JSON format. There is a script to apply json report to your src files and recive nice html output. Can't find it now, will attach later.

Currently html-cov doestn't work in mocha-phantomjs.
phantomjs mocha-phantomjs.coffee http://localhost:3000/ html-cov
Failed to start mocha.

before it will start to work you need to fix a few things:

  • add jade template engine, so mocha can render templates
  • mocha tries to load it via require call. you need to patch it
  • also mocha tries to load templates using fs... call, that also doesn't working
  • mocha tries to output data using process.stdout.write.

@metaskills metaskills reopened this Oct 8, 2012

lazd commented Oct 8, 2012

Mocha doesn't have to be patched to have access to fs, Jade, stdout etc to make this work. Instead, HTMLCov.customizeProcessStdout could simply evaluate the jade templates provided by Mocha with the JSON from json-cov, similar to the way that mocha.js does.

If you can get jade working inside of PhantomJS, the code goes something like the following. You'll also need the templates/ folder from Mocha for the Jade templates.

class HtmlCov extends Reporter

  constructor: -> super 'json-cov'

  customizeProcessStdout: (options) ->
    process.stdout.write = (string) ->
      file = 'templates/coverage.jade'

      # Read in the template
      str = fs.readFileSync file, 'utf8'

      # Compile the template
      fn = jade.compile str, { filename: file }

      # Parse the JSON returned by json-cov
      cov = JSON.parse string

      # Define the coverage class function
      coverageClass = (n) ->
        if n >= 75
          'high'
        else if n >= 50
          'medium'
        else if n >= 25
          'low'
        else
          'terrible'

      # Evaluate the template
      html = fn {
        cov: cov,
        coverageClass: coverageClass
      }

      # Dump out the HTML
      console.log html

I, however, was unable to get Jade working in PhantomJS as require only supports fs, system, webpage, etc.

A quick workaround via an external JS file gets the job done:

buildHTML.js:

var jade = require('jade');
var fs = require('fs');

// Strings for code coverage classes
function coverageClass(n) {
  if (n >= 75) return 'high';
  if (n >= 50) return 'medium';
  if (n >= 25) return 'low';
  return 'terrible';
}

// Read in templates
var file = __dirname + '/templates/coverage.jade';
var str = fs.readFileSync(file, 'utf8');
var fn = jade.compile(str, { filename: file });

// Read JSON from stdin
var cov = JSON.parse(fs.readFileSync('/dev/stdin').toString());

// Dump HTML
console.log(fn({
    cov: cov,
    coverageClass: coverageClass
}));

Dump the templates/ folder from Mocha next to buildHTML.js and run the following command:

phantomjs components/mocha-phantomjs/lib/mocha-phantomjs.coffee test.html json-cov | node buildHTML.js > coverage.html

And coverage.html contains all the good stuff.

lepture commented Dec 13, 2012

@lazd thanks.

yiwang commented Dec 27, 2012

created an npm binary json2htmlcov from @lazd 's buildHTML.js and templates/ folder from Mocha

lepture commented Dec 27, 2012

@yiwang it's not a good idea for using /dev/stdin, have a look at my solution: https://github.com/aralejs/nico-arale/blob/master/html-cov.js

Collaborator

metaskills commented Dec 27, 2012

PhantomJS does not have process/stream support.

lepture commented Dec 27, 2012

@metaskills it's not for PhantomJS, it's a command for pipe.

Collaborator

metaskills commented Dec 27, 2012

Well in this thread we are talking about PhantomJS and you mentioned how we use /dev/stdin which is the only thing we can. I am having a hard time threading your comments in if you both talking about PhantomJS and not.

lepture commented Dec 27, 2012

@metaskills my thread is a reply to @yiwang , what he did is a binary command, it has nothing to do with PhantomJS, and it would be better to do it with process and stream.

I am sorry for the misleading.

Collaborator

metaskills commented Jun 7, 2013

Version v3.0.0 is out which requires PhantomJS 1.9.1 with proper stream support. Please test this and let me know.

princed commented Jul 11, 2013

I've tested HTMLCov with PhantomJS 1.9.1 and it's still Failed to start mocha.
JSONCov works but ignores output option.

lepture commented Jul 11, 2013

@princed Mine works well on html-cov: https://github.com/lepture/mocha-browser

And you can even send coverage to coverall.io, take an example: https://github.com/aralejs/class

Collaborator

metaskills commented Jul 11, 2013

@lepture Can you make a pull request to this project with any fixes you would like to see?

lepture commented Jul 11, 2013

@metaskills Are you sure? This will change a lot of code. I'll have a try.

Collaborator

metaskills commented Jul 11, 2013

This will change a lot of code. I'll have a try.

Will it? I would be interested in knowing what it takes. Open to ideas.

princed commented Jul 11, 2013

@lepture Oh, I did this through grunt-mocha-phantomjs, so some issue are probably there.

Owner

nathanboktae commented Jul 11, 2015

Closing this very old issue. html-cov requires jscoverage a native project that has no binary distribution that deprecated. Even TJ says not to use it.

If you need coverage, checkout mocha-phantomjs-istanbul or using blanket.js with hooks (see #99)

posva commented Nov 12, 2015

LGTM. 👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment