Istanbul coverage nested directories in HTML report

Question

The unit test coverage report from Istanbul in HTML format displays every single folder of the project in the index.html.

It actually flattens the directory structure. Is there an option to render the html report with nested folders?

Answer 1

If you use the coverage reporter attribute with 'lcov', it should be possible to view using a tool. It does give a folder structure. eg: https://lcov-viewer.netlify.app/report

Answer 2

Copying my answer from a potential duplicate question:

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

See available options.

Answer 3

With Istanbul's new CLI, nyc, it is possible to create a .nycrc configuration file and specify using an array of globs, what files you want to include in your coverage report:

{
    ...
    "include": [
        "**/dist/myfile*.js",
        "**/test/**/*.spec.js"
    ],
    ...
}

Also it is possible to specify what files should be excluded too:

{
    ...
    "exclude": [
        "**/dist/myfile*.js",
        "**/test/**/*.spec.js"
    ],
    ...
}

More about this on GitHub.