I'm running a code coverage report for NodeJs using istanbul and the nyc mand.

I'm using mocha for my unit tests

I get a report for each file just as expected, but what I'd like to see is a report that has a single directory summary. Let me explain in a bit more detail what I'm getting verses what I'd like to see

All my source files are in a single folder and I'd like to see a summary of that one folder instead of a full list of every file in that folder

Here is what my folder structure looks like

// This is the folder where all the sources are at 
src
    // This is the folder where coverage is output
    coverage
        NodeJs
            index.html
    file1.js
    file2.js
    file3.js
    // This is the folder where all tests are at
    tests
        test_file1.js
        test_file2.js
        test_file3.js

My .babelrc file looks like this

{
    "presets": ["es2015", "stage-2"],
    "plugins": [
        [
            "istanbul",
            {"exclude": ["**/tests/*.js"]}
        ]
    ]
}

I'm using the following mand to run my tests with coverage

node ./node_modules/.bin/nyc --reporter=html \
    --report-dir=./src/coverage/NodeJs \
    ./node_modules/mocha/bin/_mocha \
    --require babel-core/register \
    --ui bdd src/tests/test*.js

All my tests run fine, they pass, and the report gets output to the src/coverage/NodeJs/index.html file as expected. In a browser, that report looks something like this:

What I'd like to see is something like this where I can see a single full summary of the entire folder and then click on the folder to burrow down into it if necessary like this:

Now, I can kinda get that effect if I have more than 1 folder that's covered. For example... If I get rid of the exclude in my .babelrc file, then there are 2 directories that are being covered (src and src/tests) and I get a summary of each like so

But the problem with this is that I don't want my tests being covered... as you can see, it messes up the numbers. I just want a single folder being covered and would like to see a single folder summary in the HTML output file.

Any suggestions on how I can achieve this? (And if I didn't give enough information, please let me know)

I'm running a code coverage report for NodeJs using istanbul and the nyc mand.

I'm using mocha for my unit tests

I get a report for each file just as expected, but what I'd like to see is a report that has a single directory summary. Let me explain in a bit more detail what I'm getting verses what I'd like to see

All my source files are in a single folder and I'd like to see a summary of that one folder instead of a full list of every file in that folder

Here is what my folder structure looks like

// This is the folder where all the sources are at 
src
    // This is the folder where coverage is output
    coverage
        NodeJs
            index.html
    file1.js
    file2.js
    file3.js
    // This is the folder where all tests are at
    tests
        test_file1.js
        test_file2.js
        test_file3.js

My .babelrc file looks like this

{
    "presets": ["es2015", "stage-2"],
    "plugins": [
        [
            "istanbul",
            {"exclude": ["**/tests/*.js"]}
        ]
    ]
}

I'm using the following mand to run my tests with coverage

node ./node_modules/.bin/nyc --reporter=html \
    --report-dir=./src/coverage/NodeJs \
    ./node_modules/mocha/bin/_mocha \
    --require babel-core/register \
    --ui bdd src/tests/test*.js

All my tests run fine, they pass, and the report gets output to the src/coverage/NodeJs/index.html file as expected. In a browser, that report looks something like this:

What I'd like to see is something like this where I can see a single full summary of the entire folder and then click on the folder to burrow down into it if necessary like this:

Now, I can kinda get that effect if I have more than 1 folder that's covered. For example... If I get rid of the exclude in my .babelrc file, then there are 2 directories that are being covered (src and src/tests) and I get a summary of each like so

But the problem with this is that I don't want my tests being covered... as you can see, it messes up the numbers. I just want a single folder being covered and would like to see a single folder summary in the HTML output file.

Any suggestions on how I can achieve this? (And if I didn't give enough information, please let me know)

• javascript
• node.js
• istanbul
• nyc

• Have you been able to resolve this issue? I am experiencing the same problem. – Benni Commented Jan 22, 2020 at 12:09
• 1 Never did resolve this issue. I just accepted that it isn't possible. Well... I'm sure it's possible, I'd just have to write my own reporter that takes the raw coverage data and outputs a report the way I want it to look. I answered a question about instrumentation and how coverage data gets generated. Take a look here – Ray Perea Commented Jan 22, 2020 at 12:51
• 1 I actually couldn't believe that nobody thought of adding an option to show the coverage data grouped by files - after all, there is a reason I chose to structure my project the way I did. – Benni Commented Jan 22, 2020 at 13:11
• 1 @Benni Agreed. There really should be an option – Ray Perea Commented Jan 22, 2020 at 13:19
• Did you ever consider opening a PR with github./istanbuljs/istanbuljs to add this option, specifically istanbul-reports? – morganney Commented Sep 13, 2021 at 13:31

2 Answers 2

Can't you redirect the output to the same folder, i.e. unify the folder holding all results?

This might help!

Or maybe instead of Instabul alone, try adding NYC too as:

My .babelrc file looks like this

{
    "presets": ["es2015", "stage-2"],
    "plugins": [
        [
            "istanbul","NYC",
            {"exclude": ["**/tests/*.js"]}
        ]
    ]
}

Maybe try the --reporter=html-spa option.

See available options.