Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/scinos/module-coverage


https://github.com/scinos/module-coverage

Last synced: 5 days ago
JSON representation

Awesome Lists containing this project

README

        

# module-coverage

Displays information about module coverage (on a webpack bundle) using Code Coverage report from Chrome DevTools.

## Usage

### Pre-requisites
This assume your bundle (split into one or more chunks) will have the structure:

```
(window.webpackJsonp = window.webpackJsonp || []).push([[], {
"": function() {...},
"": function() {...},
...
})
```

It works best if `module-name-1` is not hashed (i.e. if you use `moduleId: "named"`) in webpack config.

### Running the tool

1. Generate the code coverage from Chrome Dev Tools (see https://developer.chrome.com/docs/devtools/coverage/)
2. Export it as a JSON
3. Run `yarn dlx module-coverage -f `

### Getting size info

Optionally, you can also display the size information of unused modules. Please note this will desplay the raw unminified, uncompressed size.

This works by specifying the root of your projects, where your `node_modules` are.

```
yarn dlx module-coverage -f -r
```

## Details

This tool will look for the AST path `Program > ExpressionStatement > CallExpression > ArrayExpression > ObjectExpression`, and expect that object to have module names as keys, and their implementation as values.

Then it will extract the ranges from the Code Coverage report, and interset those ranges with the AST mentioned above to determine if there is an overlapping range with the module implementation. If there is not, it will mark that module as unused.