monocart-coverage-reports 1.1.0 → 2.0.1

package/README.md

@@ -8,6 +8,11 @@
 
 ## Preview Reports
 - [V8](https://cenfun.github.io/monocart-coverage-reports/v8)
+- [V8 Esbuild](https://cenfun.github.io/monocart-coverage-reports/v8-esbuild)
+- [V8 Rollup](https://cenfun.github.io/monocart-coverage-reports/v8-rollup)
+- [V8 lcov.info](https://cenfun.github.io/monocart-coverage-reports/v8/lcov.info)
+- [V8 Node env](https://cenfun.github.io/monocart-coverage-reports/v8-node-env)
+- [V8 Node Inspector](https://cenfun.github.io/monocart-coverage-reports/v8-node-ins)
 - [V8 Minify](https://cenfun.github.io/monocart-coverage-reports/v8-minify)
 - [V8 to Istanbul](https://cenfun.github.io/monocart-coverage-reports/v8-and-istanbul/istanbul)
 - [Istanbul](https://cenfun.github.io/monocart-coverage-reports/istanbul/)
@@ -26,30 +31,30 @@ await coverageReport.add(coverageData2);
 const coverageResults = await coverageReport.generate();
 console.log(coverageResults.summary);
 ```
-- [example v8](https://github.com/cenfun/monocart-coverage-reports/blob/main/tests/test-v8.js)
-- [example istanbul](https://github.com/cenfun/monocart-coverage-reports/blob/main/tests/test-istanbul.js)
+- [example v8](https://github.com/cenfun/monocart-coverage-reports/blob/main/test/test-v8.js)
+- [example istanbul](https://github.com/cenfun/monocart-coverage-reports/blob/main/test/test-istanbul.js)
 
 ## Default Options
 - [lib/default/options.js](https://github.com/cenfun/monocart-coverage-reports/blob/main/lib/default/options.js)
 
 ## Multiple Reports
-- v8 report
-    - v8
-    - v8-json
-- [istanbul reports](https://github.com/istanbuljs/istanbuljs/tree/master/packages/istanbul-reports/lib)
-    - clover
-    - cobertura
-    - html
-    - html-spa
-    - json
-    - json-summary
-    - lcov
-    - lcovonly
-    - none
-    - teamcity
-    - text
-    - text-lcov
-    - text-summary
+### V8 reports
+- v8 (html)
+- v8-json
+### [Istanbul reports](https://github.com/istanbuljs/istanbuljs/tree/master/packages/istanbul-reports/lib)
+- clover
+- cobertura
+- html
+- html-spa
+- json
+- json-summary
+- lcov
+- lcovonly
+- none
+- teamcity
+- text
+- text-lcov
+- text-summary
 
 ```js
 const CoverageReport = require('monocart-coverage-reports');
@@ -69,7 +74,7 @@ const options = {
 const coverageReport = new CoverageReport(options);
 ```
 
-# Multiprocessing Support
+## Multiprocessing Support
 The data will be added to `[outputDir]/.cache`, and the cache will be removed after reports generated.
 - sub process 1
 ```js
@@ -100,24 +105,29 @@ console.log(coverageResults.summary);
 ## Compare Reports
 | | Istanbul | V8 | V8 to Istanbul |
 | :--------------| :------ | :------ | :----------------------  |
-| Input | Istanbul (Object) | V8 (Array) | V8 (Array) |
-| Output | [Istanbul HTML report](https://cenfun.github.io/monocart-coverage-reports/istanbul) | [V8 HTML report](https://cenfun.github.io/monocart-coverage-reports/v8)  | [Istanbul HTML report](https://cenfun.github.io/monocart-coverage-reports/v8-and-istanbul/istanbul) |
-| Indicators | Covered Lines, Branches, Statements and Functions, Execution Counts | Covered Bytes, Lines❔, Execution Counts | Covered Lines, Branches❔, Statements and Functions❔, Execution Counts |
+| Instrumenting code | Required | No | No |
+| Coverage data | Istanbul (Object) | V8 (Array) | V8 (Array) |
+| Output | [Istanbul reports](#istanbul-reports) | [V8 reports](#v8-reports)  | [Istanbul reports](#istanbul-reports) |
+| - Bytes | ❌ | ✅ | ❌ |
+| - Statements | ✅ | ❌ | ☑️❔ |
+| - Branches | ✅ | ☑️❔ | ☑️❔ |
+| - Functions | ✅ | ✅ | ✅ |
+| - Lines | ✅ | ✅ | ✅ |
+| - Execution counts | ✅ | ✅ | ✅ |
 | CSS coverage | ❌ | ✅ | ✅ |
-| Minified code | N/A | ✅ | ❌ |
-| Code formatting | N/A | ✅ | ❌ |
+| Minified code | ❌ | ✅ | ❌ |
 
 ❔ - Partial or conditional support
 
 ## Compare Workflows
 - Istanbul Workflows
-    - 1, Only for source code: instrumenting code with [babel-plugin-istanbul](https://github.com/istanbuljs/babel-plugin-istanbul)，see [webpack.config-istanbul.js](https://github.com/cenfun/monocart-coverage-reports/blob/main/mock/webpack.config-istanbul.js), or using [nyc](https://github.com/istanbuljs/nyc).
-    - 2, Collecting coverage data from browser `window.__coverage__`, see [example](https://github.com/cenfun/monocart-coverage-reports/blob/main/tests/test-istanbul.js).
+    - 1, Only for source code: instrumenting code with [babel-plugin-istanbul](https://github.com/istanbuljs/babel-plugin-istanbul)，see [webpack.config-istanbul.js](https://github.com/cenfun/monocart-coverage-reports/blob/main/test/webpack.config-istanbul.js), or using [nyc](https://github.com/istanbuljs/nyc).
+    - 2, Collecting coverage data from browser `window.__coverage__` or from node `global.__coverage__`, see [example](https://github.com/cenfun/monocart-coverage-reports/blob/main/test/test-istanbul.js).
     - 3, Generating coverage report.
 
 - V8 Workflows
-    - 1, For any runtime code: nothing to do. For source code: building code with `development` [mode](https://webpack.js.org/configuration/mode/) and [sourcemap](https://webpack.js.org/configuration/devtool/) support, see [webpack.config-v8.js](https://github.com/cenfun/monocart-coverage-reports/blob/main/mock/webpack.config-v8.js).
-    - 2, Collecting coverage data with [Chromium Coverage API](#chromium-coverage-api), see [example](https://github.com/cenfun/monocart-coverage-reports/blob/main/tests/test-v8.js).
+    - 1, For any runtime code: nothing to do. For source code: building code with `development` [mode](https://webpack.js.org/configuration/mode/) and [sourcemap](https://webpack.js.org/configuration/devtool/) support, see [webpack.config-v8.js](https://github.com/cenfun/monocart-coverage-reports/blob/main/test/webpack.config-v8.js).
+    - 2, Collecting coverage data with [Chromium Coverage API](#chromium-coverage-api), see [example](https://github.com/cenfun/monocart-coverage-reports/blob/main/test/test-v8.js).
     - 3, Generating coverage report.
 
 ## Chromium Coverage API
@@ -127,11 +137,88 @@ console.log(coverageResults.summary);
 - [DevTools Protocol for Coverage](https://chromedevtools.github.io/devtools-protocol/tot/Profiler/#method-startPreciseCoverage)
 
 
+## Node.js V8 Coverage Report for Server Side
+There are two ways to collect native V8 coverage data and generate coverage report:
+- Using Node.js env [NODE_V8_COVERAGE](https://nodejs.org/docs/latest/api/cli.html#node_v8_coveragedir)=`dir`
+    - 1, Before running your Node.js application, set env `NODE_V8_COVERAGE`=`dir`. After the application runs and exits, the coverage data will be saved to the `dir` directory in JSON file format.
+    - 2, Read the json file(s) from the `dir` and generate coverage report. see example:
+    > cross-env NODE_V8_COVERAGE=`.temp/v8-coverage` node [./test/test-node-env.js](./test/test-node-env.js) && node [./test/generate-node-report.js](./test/generate-node-report.js)
+    
+- Using [Inspector](https://nodejs.org/docs/latest/api/inspector.html) API
+   - 1, Connecting to the V8 inspector and enable V8 coverage.
+   ```js
+    const inspector = require('inspector');
+    const startV8Coverage = async () => {
+        const session = new inspector.Session();
+        session.connect();
+        await session.post('Profiler.enable');
+        await session.post('Profiler.startPreciseCoverage', {
+            callCount: true,
+            detailed: true
+        });
+        return session;
+    };
+   ```
+   - 2, Taking coverage data and adding to the report after your application runs.
+   ```js
+    const takeV8Coverage = (session) => {
+        return new Promise((resolve) => {
+            session.post('Profiler.takePreciseCoverage', (error, coverage) => {
+                if (error) {
+                    console.log(error);
+                    resolve();
+                    return;
+                }
+                resolve(coverage.result);
+            });
+        });
+    };
+    const coverageList = await takeV8Coverage(session);
+    // filter node internal files
+    coverageList = coverageList.filter((entry) => entry.url && !entry.url.startsWith('node:'));
+    await new CoverageReport(coverageOptions).add(coverageList);
+   ```
+   - 3, Generating coverage report. see example: [./test/test-node-ins.js](./test/test-node-ins.js)
+   ```js
+    await new CoverageReport(coverageOptions).generate();
+   ```
+
+## Using `entryFilter` and `sourceFilter` to filter the results for V8 report
+When you add coverage data with [Chromium Coverage API](#chromium-coverage-api), it actually contains the data of all entry files, for example:
+```
+1, dist/main.js
+2, dist/vendor.js
+3, dist/something-else.js
+```
+We can use `entryFilter` to filter the entry files. For example, we should remove `vendor.js` and `something-else.js` if they are not in our coverage scope. 
+```
+1, dist/main.js
+```
+When inline or linked sourcemap exists to the entry file, the source files will be extracted from the sourcemap for the entry file, and the entry file will be removed if `logging` is not `debug`.
+```
+1, src/index.js
+2, src/components/app.js
+3, node_modules/dependency/dist/dependency.js
+```
+We can use `sourceFilter` to filter the source files. For example, we should remove `dependency.js` if it is not in our coverage scope.
+```
+1, src/index.js
+2, src/components/app.js
+```
+Example:
+```js
+const coverageOptions = {
+    entryFilter: (entry) => entry.url.indexOf("main.js") !== -1,
+    sourceFilter: (sourcePath) => sourcePath.search(/src\//) !== -1
+};
+```
+
 ## Istanbul Coverage
 - [Istanbul coverage report](https://istanbul.js.org/) - Instrumenting source codes and generating coverage reports
 - [babel-plugin-istanbul](https://github.com/istanbuljs/babel-plugin-istanbul)
 - [istanbul-reports](https://github.com/istanbuljs/istanbuljs/tree/master/packages/istanbul-reports/lib)
 - [Code Coverage Introduction](https://docs.cypress.io/guides/tooling/code-coverage)
 
+
 ## Thanks
 - Special thanks to [@edumserrano](https://github.com/edumserrano)

package/lib/converter/ast.js

@@ -0,0 +1,297 @@
+const {
+    acorn, acornLoose, parseCss
+} = require('../packages/monocart-coverage-vendor.js');
+const Util = require('../utils/util.js');
+
+const {
+    createBranches, collectBranches, findInRanges
+} = require('./branches.js');
+
+const getFunctionRange = (start, end, state) => {
+
+    const {
+        functionMap, functionNameMap, functionRanges
+    } = state;
+
+    if (!functionRanges.length) {
+        return;
+    }
+
+    // exact matched in functionMap
+    const range = functionMap.get(start);
+    if (range) {
+        return range;
+    }
+    // exact matched in functionNameMap
+    const nameRange = functionNameMap.get(start);
+    if (nameRange) {
+        return nameRange;
+    }
+
+    // find in functionRanges
+    return findInRanges(start, end, functionRanges);
+};
+
+const collectAstInfo = (ast, state) => {
+
+    const functions = [];
+    const branchMap = new Map();
+
+    Util.visitAst(ast, {
+
+        VariableDeclarator(node, parents) {
+            // id: { type: 'Identifier', name: '__webpack_modules__' },
+            const name = node.id && node.id.name;
+            if (name === '__webpack_modules__' && node.init) {
+                // mark all as wrap function
+                node.init.properties.forEach((it) => {
+                    it.value._wrapKey = it.key && it.key.value;
+                });
+                // console.log('==========================', node.type);
+                // console.log(name, parents.length);
+            }
+        },
+
+        // Function include FunctionDeclaration, ArrowFunctionExpression, FunctionExpression
+        Function(node) {
+
+            const {
+                start, end, id
+            } = node;
+            const functionName = id && id.name;
+
+            const functionInfo = {
+                start,
+                end,
+                functionName,
+                // js default to 1
+                count: 1
+            };
+
+            if (node._wrapKey) {
+                functionInfo.wrap = true;
+            }
+
+            const range = getFunctionRange(start, end, state);
+            if (range) {
+                functionInfo.count = range.count;
+                functionInfo.range = range;
+                // set wrap back to range
+                if (functionInfo.wrap) {
+                    range.wrap = true;
+                }
+            }
+
+            functions.push(functionInfo);
+
+            createBranches(node.body, functionInfo, branchMap);
+
+        }
+
+    });
+
+    const branches = collectBranches(branchMap);
+
+    return {
+        functions,
+        branches
+    };
+
+};
+
+const generateCountState = (coverageList) => {
+    const functionRanges = [];
+    const functionNameMap = new Map();
+    coverageList.forEach((block) => {
+        const { functionName, ranges } = block;
+
+        // first one is function coverage info
+        const functionRange = ranges[0];
+        functionRange.functionName = functionName;
+        if (functionName) {
+            functionNameMap.set(functionRange.startOffset + functionName.length, functionRange);
+        }
+
+        // blocks
+        const len = ranges.length;
+        if (len > 1) {
+            const blockRanges = [].concat(ranges);
+            // remove first one
+            blockRanges.shift();
+            blockRanges.sort((a, b) => {
+                return a.startOffset - b.startOffset;
+            });
+            const blockMap = new Map();
+            blockRanges.forEach((item) => {
+                blockMap.set(item.startOffset, item);
+            });
+            functionRange.blockMap = blockMap;
+            functionRange.blockRanges = blockRanges;
+        }
+
+        functionRanges.push(functionRange);
+
+    });
+
+    // sort ranges
+    functionRanges.sort((a, b) => {
+        return a.startOffset - b.startOffset;
+    });
+
+    // keep map index for exact search
+    const functionMap = new Map();
+    functionRanges.forEach((item) => {
+        functionMap.set(item.startOffset, item);
+    });
+
+    return {
+        functionMap,
+        functionNameMap,
+        functionRanges
+    };
+
+};
+
+const getJsAstInfo = (item, coverageList) => {
+
+    // not for css
+    if (!item.js) {
+        return {
+            functions: [],
+            branches: []
+        };
+    }
+
+    const { source } = item;
+
+    const options = {
+        ecmaVersion: 'latest',
+        // most time for node.js file
+        allowReturnOutsideFunction: true,
+        allowImportExportEverywhere: true,
+        allowSuperOutsideMethod: true,
+        // first line: #!/usr/bin/env node
+        allowHashBang: true
+    };
+
+    let ast;
+    try {
+        ast = acorn.parse(source, options);
+    } catch (e) {
+        Util.logError(`failed to parse source file and fall back to loose: ${item.sourcePath} ${e.message}`);
+        // https://github.com/acornjs/acorn/tree/master/acorn-loose
+        // It is recommended to always try a parse with the regular acorn parser first,
+        // and only fall back to this parser when that one finds syntax errors.
+        ast = acornLoose.parse(source, options);
+    }
+
+    const state = generateCountState(coverageList);
+    // state.item = item;
+
+    return collectAstInfo(ast, state);
+};
+
+// =========================================================================================================
+
+const addCssRules = (rules, coverageList, coveredRanges, locator) => {
+    let hasCovered = false;
+    // line and line is 1-base
+    rules.forEach((rule) => {
+
+        const { type, position } = rule;
+
+        if (type === 'comment') {
+            return;
+        }
+
+        const { start, end } = position;
+
+        // both 1-base
+        // console.log(start, end);
+        const startOffset = locator.locationToOffset({
+            line: start.line,
+            column: start.column - 1
+        });
+
+        const endOffset = locator.locationToOffset({
+            line: end.line,
+            column: end.column - 1
+        });
+
+        // start should offset @media
+        if (type === 'media') {
+            // rules in media
+            // console.log('media', rule.media, startOffset, endOffset);
+            const childCoverageList = [];
+            const hasChildCovered = addCssRules(rule.rules, childCoverageList, coveredRanges, locator);
+            if (hasChildCovered) {
+                childCoverageList.forEach((it) => {
+                    coverageList.push(it);
+                });
+                return;
+            }
+
+            // add whole media as uncovered
+            coverageList.push({
+                start: startOffset,
+                end: endOffset,
+                count: 0
+            });
+            return;
+        }
+
+        let count = 0;
+        if (type === 'charset') {
+            count = 1;
+        } else {
+            const coveredRange = findInRanges(startOffset, endOffset, coveredRanges);
+            if (coveredRange) {
+                count = 1;
+                hasCovered = true;
+            }
+        }
+
+        coverageList.push({
+            start: startOffset,
+            end: endOffset,
+            count
+        });
+
+    });
+
+    return hasCovered;
+};
+
+const getCssAstInfo = (item, locator) => {
+
+    const {
+        source, sourcePath, ranges
+    } = item;
+
+    // sort covered ranges
+    ranges.sort((a, b) => a.start - b.start);
+    // to offset covered ranges
+    const coveredRanges = ranges.map((it) => {
+        return {
+            startOffset: it.start,
+            endOffset: it.end
+        };
+    });
+
+    const time_start_parse = new Date();
+    const ast = parseCss(source);
+    Util.logTime(`parse css: ${sourcePath}`, time_start_parse);
+
+    const coverageList = [];
+    addCssRules(ast.rules, coverageList, coveredRanges, locator);
+
+    return {
+        coverageList
+    };
+};
+
+
+module.exports = {
+    getJsAstInfo,
+    getCssAstInfo
+};