How to convert existing istanbul json file to html

Question

I want to convert istanbul coverage report file fetched from client in JSON format to html format. Currently I'm using remap-istanbul for this but actually that particular that particular tool is designed to remap coverage data for code which was originally written in different languages (like typescript).

So I guess whether there's more convenient way to do the same

Answer 1

I guess as istanbul has decided to move towards mono-repo, you will not be able to do the above mentioned method if you use mono-repo istanbul.

You can do something as described here: link . You can generate a coverage map and then pass it to generate the report in the desired format.

Answer 2

Use istanbul report html to convert existing coverage data from JSON to HTML:

istanbul report html

By default, the above looks in the current directory (and its subdirectories) for any file starting with "coverage" and ending with ".json", and outputs the HTML reports to the./coverage/ directory.

To convert a specific file to a specific directory:

istanbul report --include path/to/my-coverage-file.json --dir my-coverage-dir html

Another way to only read coverage reports from a specific directory (e.g. all JSON files in path/to) is as follows, using the --root option:

istanbul report --root path/to --include=*.json --dir my-coverage-dir html

Use istanbul help report to see more options (the following is generated with istanbul 0.4.5):

Usage: istanbul report <options> [ <format> ... ]

Options are:

      --config <path-to-config>
              the configuration file to use, defaults to .istanbul.yml

      --root <input-directory>
              The input root directory for finding coverage files

      --dir <report-directory>
              The output directory where files will be written. This defaults
              to ./coverage/

      --include <glob>
              The glob pattern to select one or more coverage files, defaults
              to **/coverage*.json

      --verbose, -v
              verbose mode


<format> is one of 
      clover  XML coverage report that can be consumed by the clover tool
      cobertura
              XML coverage report that can be consumed by the cobertura tool
      html    Navigable HTML coverage report for every file and directory
      json    prints the coverage object as JSON to a file
      json-summary
              prints a summary coverage object as JSON to a file
      lcov    combined lcovonly and html report that generates an lcov.info
              file as well as HTML
      lcovonly
              lcov coverage report that can be consumed by the lcov tool
      none    Does nothing. Useful to override default behavior and suppress
              reporting entirely
      teamcity
              report with system messages that can be interpreted with TeamCity
      text    text report that prints a coverage line for every file, typically
              to console
      text-lcov
              lcov coverage report that can be consumed by the lcov tool
      text-summary
              text report that prints a coverage summary across all files,
              typically to console

 Default format is lcov unless otherwise specified in the config file. In
 addition you can tweak the file names for various reports using the config
 file. Type `istanbul help config` to see what can be tweaked.

The value of --input is a glob pattern. For more documentation on glob patterns, see the documentation at the glob package on NPM.