V8 coverage

.github/ISSUE_TEMPLATE/bug_report.md

@@ -7,18 +7,18 @@ assignees: ''
 ---
 
 **Logs and screenshots**
-Please provide debug logs by running Cypress from the terminal with `DEBUG=code-coverage` environment variable set. See the [Debugging](https://github.com/cypress-io/code-coverage#debugging) section of the README file.
+Please provide debug logs by running Cypress from the terminal with `DEBUG=code-coverage` environment variable set. See the [Debugging](https://github.com/rohit-gohri/cypress-code-coverage-v8#debugging) section of the README file.
 
 **Versions**
 
-- What is this plugin's version? If this is NOT the latest [released version](https://github.com/cypress-io/code-coverage/releases), can you try the latest version, please?
-- If the plugin worked before in version X but stopped after upgrading to version Y, please try the [released versions](https://github.com/cypress-io/code-coverage/releases) between X and Y to see where the breaking change was.
+- What is this plugin's version? If this is NOT the latest [released version](https://github.com/rohit-gohri/cypress-code-coverage-v8/releases), can you try the latest version, please?
+- If the plugin worked before in version X but stopped after upgrading to version Y, please try the [released versions](https://github.com/rohit-gohri/cypress-code-coverage-v8/releases) between X and Y to see where the breaking change was.
 - What is the Cypress version?
 - What is your operating system?
 - What is the shell?
 - What is the Node version?
 - What is the NPM version?
-- How do you instrument your application? Cypress [does not instrument web application code](https://github.com/cypress-io/code-coverage#instrument-your-application), so you must do it yourself.
+- How do you instrument your application? Cypress [does not instrument web application code](https://github.com/rohit-gohri/cypress-code-coverage-v8#instrument-your-application), so you must do it yourself.
 - When running tests, if you open the web application in a regular browser and open DevTools, do you see `window.__coverage__` object? Can you paste a screenshot?
 - Is there a `.nyc_output` folder? Is there a `.nyc_output/out.json` file? Is it empty? Can you paste at least part of it so we can see the keys and file paths?
 - Do you have any custom NYC settings in `package.json` (`nyc` object) or in other [NYC config files](https://github.com/istanbuljs/nyc#configuration-files)?

.gitignore

@@ -5,7 +5,13 @@ coverage/
 .nyc_output/
 dist/
 .cache/
-.vscode/
 cypress-coverage/
 yarn.lock
 .parcel-cache
+
+.DS_Store
+
+# dist
+./*.js
+./middleware
+./lib

.nycrc.json

@@ -1,6 +1,3 @@
 {
-  "exclude": [
-    "support.js",
-    "task-utils.js"
-  ]
+  "exclude": ["src/**/*"]
 }

.vscode/settings.json

@@ -0,0 +1,11 @@
+{
+  "cSpell.words": ["execa"],
+  "editor.formatOnSave": true,
+  "editor.defaultFormatter": "esbenp.prettier-vscode",
+  "[javascript]": {
+    "editor.formatOnSave": true
+  },
+  "[typescript]": {
+    "editor.formatOnSave": true
+  }
+}

LICENSE.md

@@ -1,6 +1,18 @@
 ## MIT License
 
-Copyright (c) 2019 Cypress.io https://www.cypress.io
+Copyright (c) 2024 Rohit Gohri
+
+Copyright (c) 2020 Gleb Bahmutov
+<https://github.com/bahmutov/cypress-native-chrome-code-coverage-example>
+
+Copyright (c) 2021 Lefty
+<https://github.com/leftyio/v8-cypress-coverage-plugin>
+
+Copyright (c) 2019 Cypress.io <https://www.cypress.io>
+<https://github.com/cypress-io/code-coverage>
+
+Copyright JS Foundation and other contributors
+<https://github.com/webpack-contrib/source-map-loader>
 
 Permission is hereby granted, free of charge, to any person
 obtaining a copy of this software and associated documentation

README.md

@@ -1,11 +1,11 @@
-# @cypress/code-coverage [![renovate-app badge][renovate-badge]][renovate-app] [![CircleCI](https://circleci.com/gh/cypress-io/code-coverage.svg?style=svg)](https://circleci.com/gh/cypress-io/code-coverage)
+# cypress-code-coverage-v8
 
 > Saves the code coverage collected during Cypress tests
 
 ## Install
 
 ```shell
-npm install -D @cypress/code-coverage
+npm install -D cypress-code-coverage-v8
 ```
 
 **Note:** This plugin assumes that `cypress` is a peer dependency already installed in your project.
@@ -14,7 +14,7 @@ Then add the code below to the `supportFile` and `setupNodeEvents` function.
 
 ```js
 // cypress/support/e2e.js
-import '@cypress/code-coverage/support'
+import 'cypress-code-coverage-v8'
 ```
 
 ```js
@@ -26,7 +26,7 @@ module.exports = defineConfig({
   // the e2e or component configuration
   e2e: {
     setupNodeEvents(on, config) {
-      require('@cypress/code-coverage/task')(on, config)
+      require('cypress-code-coverage-v8/plugin')(on, config)
       // include any other plugin code...
 
       // It's IMPORTANT to return the config object
@@ -113,54 +113,13 @@ ERROR: Coverage for lines (100%) does not meet global threshold (101%)
 
 Watch the video [How to read code coverage report](https://youtu.be/yVvCYtsmkZU) to see how to read the HTML coverage report.
 
-## Instrument unit tests
-
-If you test your application code directly from `specs`, you might want to instrument them and combine unit test code coverage with any end-to-end code coverage (from iframe). You can easily instrument spec files using [babel-plugin-istanbul](https://github.com/istanbuljs/babel-plugin-istanbul), for example.
-
-Install the plugin
-
-```shell
-npm i -D babel-plugin-istanbul
-```
-
-Set your `.babelrc` file.
-
-```json
-{
-  "plugins": ["istanbul"]
-}
-```
-
-Put the following in the `cypress/plugins/index.js` file to use the `.babelrc` file.
-
-```js
-module.exports = (on, config) => {
-  require('@cypress/code-coverage/task')(on, config)
-  on('file:preprocessor', require('@cypress/code-coverage/use-babelrc'))
-  return config
-}
-```
+## Unit tests
 
 The code coverage from spec files will be combined with end-to-end coverage.
 
 Find examples of just the unit tests and JavaScript source files with collected code coverage in [test-apps/unit-tests-js](./test-apps/unit-tests-js).
 
-### Alternative for unit tests
-
-If you cannot use `.babelrc` (maybe it is used by other tools?), try using the Browserify transformer included with this module in the `use-browserify-istanbul` file.
-
-```js
-module.exports = (on, config) => {
-  require('@cypress/code-coverage/task')(on, config)
-  on(
-    'file:preprocessor',
-    require('@cypress/code-coverage/use-browserify-istanbul')
-  )
-  return config
-}
-```
-
-## Instrument backend code
+## Backend code
 
 Example in [test-apps/backend](test-apps/backend) folder.
 
@@ -172,25 +131,7 @@ You can also instrument your server-side code and produce a combined coverage re
 ```js
 const express = require('express')
 const app = express()
-require('@cypress/code-coverage/middleware/express')(app)
-```
-
-**Tip:** You can register the endpoint only if there is a global code coverage object, and you can exclude the middleware code from the coverage numbers
-
-```js
-// https://github.com/gotwarlost/istanbul/blob/master/ignoring-code-for-coverage.md
-/* istanbul ignore next */
-if (global.__coverage__) {
-  require('@cypress/code-coverage/middleware/express')(app)
-}
-```
-
-If you use a Hapi server, define the endpoint yourself and return the object.
-
-```js
-if (global.__coverage__) {
-  require('@cypress/code-coverage/middleware/hapi')(server)
-}
+require('cypress-code-coverage-v8/dist/middleware/express')(app)
 ```
 
 For any other server, define the endpoint yourself and return the coverage object:
@@ -319,16 +260,7 @@ if (window.Cypress) {
 
 ### Exclude the next logical statement
 
-Often needed to skip a statement.
-
-```js
-/* istanbul ignore next */
-if (global.__coverage__) {
-  require('@cypress/code-coverage/middleware/express')(app)
-}
-```
-
-Or a particular `switch` case
+Often needed to skip a statement or a particular `switch` case
 
 ```js
 switch (foo) {
@@ -428,96 +360,7 @@ Full examples we use for testing in this repository:
 
 ### External examples
 
-Look up the list of examples under the GitHub topic [cypress-code-coverage-example](https://github.com/topics/cypress-code-coverage-example)
-
-- [cypress-io/cypress-realworld-app](https://github.com/cypress-io/cypress-realworld-app) is an easy to set up and run a real-world application with E2E, API, and unit tests that achieves 100% code-coverage for both front and back end code. Its CI pipeline also reports code-coverage reports across parallelized test runs to [Codecov](https://codecov.io/gh/cypress-io/cypress-realworld-app).
-- [cypress-io/cypress-example-todomvc-redux](https://github.com/cypress-io/cypress-example-todomvc-redux) is a React / Redux application with 100% code coverage.
-- [cypress-io/cypress-example-conduit-app](https://github.com/cypress-io/cypress-example-conduit-app) shows how to collect the coverage information from both back and frontend code and merge it into a single report. The E2E test step runs parallel in several CI containers, each saving just partial test coverage information. Then, a merge job runs, taking artifacts and combining coverage into the final report to be sent to an external coverage as a service app.
-- [bahmutov/code-coverage-webpack-dev-server](https://github.com/bahmutov/code-coverage-webpack-dev-server) shows how to collect code coverage from an application that uses webpack-dev-server.
-- [bahmutov/code-coverage-vue-example](https://github.com/bahmutov/code-coverage-vue-example) collects code coverage for Vue.js single file components.
-- [lluia/cypress-typescript-coverage-example](https://github.com/lluia/cypress-typescript-coverage-example) shows coverage for React App that uses TypeScript. See discussion in issue [#19](https://github.com/cypress-io/code-coverage/issues/19).
-- [bahmutov/cypress-and-jest](https://github.com/bahmutov/cypress-and-jest) shows how to run Jest unit tests and Cypress unit tests, collecting code coverage from both test runners and then producing a merged report.
-- [bahmutov/cypress-angular-coverage-example](https://github.com/bahmutov/cypress-angular-coverage-example) forked from [skylock/cypress-angular-coverage-example](https://github.com/skylock/cypress-angular-coverage-example) shows Angular 8 + TypeScript application with instrumentation done using [istanbul-instrumenter-loader](https://github.com/webpack-contrib/istanbul-instrumenter-loader).
-- [bahmutov/testing-react](https://github.com/bahmutov/testing-react) shows how to get code coverage for a React application created using [CRA v3](https://github.com/facebook/create-react-app) without ejecting `react-scripts`.
-- [bahmutov/cra-ts-code-coverage-example](https://github.com/bahmutov/cra-ts-code-coverage-example) instruments TypeScript React application on the fly without ejecting `react-scripts` by using [@cypress/instrument-cra](https://github.com/cypress-io/instrument-cra).
-- [bahmutov/next-and-cypress-example](https://github.com/bahmutov/next-and-cypress-example) shows how to get backend and frontend coverage for a [Next.js](https://nextjs.org) project. Uses [middleware/nextjs.js](middleware/nextjs.js).
-- [kylemh/next-ts-with-cypress-coverage](https://github.com/kylemh/next-ts-with-cypress-coverage) This example project contains Next.js with TypeScript, instrumented coverage reporting, @testing-library/react, and instructions on how to type custom commands.
-- [akoidan/vue-webpack-typescript](https://github.com/akoidan/vue-webpack-typescript) Pure webpack config with vue + typescript with codecov reports. This setup uses a babel-loader with a TS checker as a separate thread.
-- [bahmutov/code-coverage-subfolder-example](https://github.com/bahmutov/code-coverage-subfolder-example) shows how to instrument the `app` folder using `nyc instrument` as a separate step before running E2E tests
-- [bahmutov/docker-with-cypress-included-code-coverage-example](https://github.com/bahmutov/docker-with-cypress-included-code-coverage-example) runs tests inside pre-installed Cypress using [cypress/included:x.y.z](https://github.com/cypress-io/cypress-docker-images/tree/master/included) Docker image and reports code coverage.
-- [bahmutov/app-in-docker-coverage-example](https://github.com/bahmutov/app-in-docker-coverage-example) shows an app running inside a Docker container, while Cypress runs on the local machine. Before generating the report, Cypress can still [discover the source files](https://github.com/cypress-io/code-coverage/pull/197).
-- [bahmutov/gatsby-cypress-with-code-coverage](https://github.com/bahmutov/gatsby-cypress-with-code-coverage) shows code coverage using the official Gatsby "Hello World" starter.
-- [muratkeremozcan/angular-playground](https://github.com/muratkeremozcan/angular-playground) is an Angular TypeScript application with combined unit and E2E coverage.
-- [nefayran/cypress-react-vite](https://github.com/nefayran/cypress-react-vite) React with Vite and Istanbul plugin for code coverage.
-
-## Migrations
-
-### Cypress v9 to v10
-
-With the removal of the `plugins` directory in Cypress version 10+, you'll need to add all of your configuration into the configuration file (`cypress.config.js` by default).
-
-```js
-// BEFORE
-// Register tasks in your `cypress/plugins/index.js` file.
-
-module.exports = (on, config) => {
-  require('@cypress/code-coverage/task')(on, config)
-
-  // add other tasks to be registered here
-
-  // IMPORTANT to return the config object
-  // with the any changed environment variables
-  return config
-}
-```
-
-```js
-// AFTER
-// cypress.config.js
-const { defineConfig } = require('cypress')
-
-module.exports = defineConfig({
-  // setupNodeEvents can be defined in either
-  // the e2e or component configuration
-  e2e: {
-    setupNodeEvents(on, config) {
-      require('@cypress/code-coverage/task')(on, config)
-      // include any other plugin code...
-
-      // It's IMPORTANT to return the config object
-      // with any changed environment variables
-      return config
-    },
-  },
-})
-```
-
-### v2 to v3
-
-Change the plugins file `cypress/plugins/index.js`
-
-```js
-// BEFORE
-module.exports = (on, config) => {
-  on('task', require('@cypress/code-coverage/task'))
-}
-// AFTER
-module.exports = (on, config) => {
-  require('@cypress/code-coverage/task')(on, config)
-  // IMPORTANT to return the config object
-  // with the any changed environment variables
-  return config
-}
-```
-
-**Tip:** We include [plugins.js](plugins.js) file you can point at from your code in simple cases. From your `cypress.json` file:
-
-```json
-{
-  "pluginsFile": "node_modules/@cypress/code-coverage/plugins",
-  "supportFile": "node_modules/@cypress/code-coverage/support"
-}
-```
+Look up the list of examples under the GitHub topic [cypress-code-coverage-v8-example](https://github.com/topics/cypress-code-coverage--v8-example)
 
 ## Debugging
 
@@ -539,11 +382,9 @@ DEBUG_DEPTH=10 DEBUG=code-coverage npm run dev
 
 ### Common issues
 
-Common issue: [not instrumenting your application when running Cypress](#instrument-your-application).
+If the plugin worked before in version X but stopped after upgrading to version Y, please try the [released versions](https://github.com/rohit-gohri/cypress-code-coverage-v8/releases) between X and Y to see where the breaking change was.
 
-If the plugin worked before in version X but stopped after upgrading to version Y, please try the [released versions](https://github.com/cypress-io/code-coverage/releases) between X and Y to see where the breaking change was.
-
-If you decide to open an issue in this repository, please fill in all information the [issue template](https://github.com/cypress-io/code-coverage/blob/master/.github/ISSUE_TEMPLATE/bug_report.md) asks for. The issues most likely to be resolved have debug logs, screenshots, and hopefully public repository links so we can try running the tests ourselves.
+If you decide to open an issue in this repository, please fill in all information the [issue template](https://github.com/rohit-gohri/cypress-code-coverage-v8/blob/master/.github/ISSUE_TEMPLATE/bug_report.md) asks for. The issues most likely to be resolved have debug logs, screenshots, and hopefully public repository links so we can try running the tests ourselves.
 
 ## Contributing
 
@@ -570,6 +411,3 @@ npm run check:markdown
 ## License
 
 This project is licensed under the terms of the [MIT license](LICENSE.md).
-
-[renovate-badge]: https://img.shields.io/badge/renovate-app-blue.svg
-[renovate-app]: https://renovateapp.com/

cypress-backend.json

@@ -3,7 +3,9 @@
   "integrationFolder": "cypress/test-backend",
   "env": {
     "codeCoverage": {
-      "url": "http://localhost:3003/__coverage__"
+      "timeout": 60000,
+      "url": "http://localhost:3003/__coverage__",
+      "ssr": "/api/__coverage__"
     }
   }
 }

cypress/e2e/combine.cy.js

@@ -1,5 +1,6 @@
 /// <reference types="Cypress" />
-const { combineNycOptions, defaultNycOptions } = require('../../common-utils')
+const { combineNycOptions, defaultNycOptions } = require('../../lib/common/common-utils')
+
 describe('Combine NYC options', () => {
   it('overrides defaults', () => {
     const pkgNycOptions = {

cypress/e2e/filtering.cy.js

@@ -1,4 +1,4 @@
-const { filterFilesFromCoverage } = require('../../support-utils')
+const { filterFilesFromCoverage } = require('../../lib/support/support-utils')
 
 describe('minimatch', () => {
   it('string matches', () => {

cypress/e2e/fix-source-paths.cy.js

@@ -1,4 +1,4 @@
-import { fixSourcePaths } from '../../support-utils'
+import { fixSourcePaths } from '../../lib/support/support-utils'
 
 describe('fixSourcePaths', () => {
   it('fixes webpack loader source-map pathes', () => {

cypress/e2e/merge.cy.js

@@ -4,7 +4,7 @@ const coverage = require('../fixtures/coverage.json')
 const {
   fileCoveragePlaceholder,
   removePlaceholders
-} = require('../../common-utils')
+} = require('../../lib/common/common-utils')
 
 /**
  * Extracts just the data from the coverage map object

cypress/plugins/index.js

@@ -1,15 +1,6 @@
 module.exports = (on, config) => {
   require('../../task')(on, config)
 
-  // also use .babelrc file when bundling spec files
-  // to get the code coverage from unit tests
-  // https://glebbahmutov.com/blog/combined-end-to-end-and-unit-test-coverage/
-  on('file:preprocessor', require('../../use-babelrc'))
-
-  // or use browserify and just push babel-plugin-istanbul
-  // directory to the list of babelify plugins
-  // on('file:preprocessor', require('../../use-browserify-istanbul'))
-
   // IMPORTANT to return the config object with changed environment variable
   return config
 }