Skip to content

Commit

Permalink
feat: adding exclude env var for compatibility with Cypress 10
Browse files Browse the repository at this point in the history
* feat: adding exclude env var for compatibility with cypress v10

* moving webpack processor to deps

* chore: updating examples for new and legacy cypress config

* chore: renaming examples folder to test-apps and updating refs

* chore: ability to publish dev branch

* update cypress package

* update brand

* updating cypress to bust circle cache

* ensuring deps install in main test
  • Loading branch information
elylucas authored May 26, 2022
1 parent acd756f commit 7a32564
Show file tree
Hide file tree
Showing 385 changed files with 83,197 additions and 11,930 deletions.
698 changes: 157 additions & 541 deletions .circleci/config.yml

Large diffs are not rendered by default.

7 changes: 3 additions & 4 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1,12 +1,11 @@
node_modules/
cypress/videos
cypress/screenshots
**/cypress/videos
**/cypress/screenshots
coverage/
.nyc_output/
dist/
.cache/
.vscode/
cypress-coverage/
examples/*/cypress/videos
examples/*/cypress/screenshots
yarn.lock
.parcel-cache
14 changes: 14 additions & 0 deletions .releaserc
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
{
"branches": [
"master",
"next",
{
"name": "besta",
"prerelease": true
},
{
"name": "dev",
"prerelease": true
}
]
}
51 changes: 32 additions & 19 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@ This plugin **DOES NOT** instrument your code. You have to instrument it yoursel
}
```

Please see the [Examples](#examples) section down below, you can probably find a linked project matching your situation to see how to instrument your application's source code before running end-to-end tests to get the code coverage.
Please see the [Test Apps](#test-apps) section down below, you can probably find a linked project matching your situation to see how to instrument your application's source code before running end-to-end tests to get the code coverage.

If your application has been instrumented correctly, then you should see additional counters and instructions in the application's JavaScript resources, like the image down below shows.

Expand All @@ -66,7 +66,7 @@ That should be it! You should see messages from this plugin in the Cypress Comma

### App vs unit tests

You need to instrument your web application. This means that when the test does `cy.visit('localhost:3000')` any code the `index.html` requests should be instrumented by YOU. See [Examples](#examples) section for advice, usually you need to stick `babel-plugin-istanbul` into your pipeline somewhere.
You need to instrument your web application. This means that when the test does `cy.visit('localhost:3000')` any code the `index.html` requests should be instrumented by YOU. See [Test Apps](#test-apps) section for advice, usually you need to stick `babel-plugin-istanbul` into your pipeline somewhere.

If you are testing individual functions from your application code by importing them directly into Cypress spec files, this is called "unit tests" and Cypress can instrument this scenario for you. See [Instrument unit tests](#instrument-unit-tests) section.

Expand Down Expand Up @@ -136,7 +136,7 @@ module.exports = (on, config) => {

Now the code coverage from spec files will be combined with end-to-end coverage.

Find example of a just the unit tests and JavaScript source files with collected code coverage in [examples/unit-tests-js](./examples/unit-tests-js).
Find example of a just the unit tests and JavaScript source files with collected code coverage in [test-apps/new-cypress-config/unit-tests-js](./test-apps/new-cypress-config/unit-tests-js).

### Alternative for unit tests

Expand All @@ -155,7 +155,7 @@ module.exports = (on, config) => {

## Instrument backend code

Example in [examples/backend](examples/backend) folder.
Example in [test-apps/new-cypress-config/backend](test-apps/backend) folder.

You can also instrument your server-side code and produce combined coverage report that covers both the backend and frontend code

Expand Down Expand Up @@ -275,7 +275,7 @@ Sometimes NYC tool might be installed in a different folder not in the current o

TypeScript source files should be automatically included in the report, if they are instrumented.

See [examples/ts-example](examples/ts-example), [bahmutov/cra-ts-code-coverage-example](https://github.com/bahmutov/cra-ts-code-coverage-example) or [bahmutov/cypress-angular-coverage-example](https://github.com/bahmutov/cypress-angular-coverage-example).
See [test-apps/new-cypress-config/ts-example](test-apps/ts-example), [bahmutov/cra-ts-code-coverage-example](https://github.com/bahmutov/cra-ts-code-coverage-example) or [bahmutov/cypress-angular-coverage-example](https://github.com/bahmutov/cypress-angular-coverage-example).

## Include code

Expand All @@ -292,7 +292,7 @@ For example, if you want to make sure the final report includes all JS files fro
}
```

See example [examples/all-files](./examples/all-files)
See example [test-app/all-files](./test-apps/new-cypress-config/all-files)

## Exclude code

Expand Down Expand Up @@ -335,7 +335,20 @@ switch (foo) {

### Exclude files and folders

See [`nyc` configuration](https://github.com/istanbuljs/nyc#common-configuration-options) and [ include and exclude options](https://github.com/istanbuljs/nyc#using-include-and-exclude-arrays). You can include and exclude files using `minimatch` patterns in `.nycrc` file or using "nyc" object inside your `package.json` file.
The code coverage plugin will automatically exclude any test/spec files you have defined in `testFiles` (Cypress < v10) or `specPattern` (Cypress >= v10) configuration options. Additionaly, you can set the `exclude` pattern glob in the code coverage environment variable to specify additional files to be excluded:

```javascript
// cypress.config.js or cypress.json
env: {
codeCoverage: {
exclude: ['cypress/**/*.*'],
},
},
```

Cypress 10 and later users should set the `exclude` option to exclude any items from the `cypress` folder they don't want to be included in the coverage reports.

Additionaly, you can use [`nyc` configuration](https://github.com/istanbuljs/nyc#common-configuration-options) and [include and exclude options](https://github.com/istanbuljs/nyc#using-include-and-exclude-arrays). You can include and exclude files using `minimatch` patterns in `.nycrc` file or using "nyc" object inside your `package.json` file.

For example, if you want to only include files in the `app` folder, but exclude `app/util.js` file, you can set in your `package.json`

Expand All @@ -350,7 +363,7 @@ For example, if you want to only include files in the `app` folder, but exclude

**Note:** if you have `all: true` NYC option set, this plugin will check the produced `.nyc_output/out.json` before generating the final report. If the `out.json` file does not have information for some files that should be there according to `include` list, then an empty placeholder will be included, see [PR 208](https://github.com/cypress-io/code-coverage/pull/208).

Another important option is `excludeAfterRemap`. By default it is false, which might let excluded files through. If you are excluding the files, and the instrumenter does not respect the `nyc.exclude` setting, then add `excludeAfterRemap: true` to tell `nyc report` to exclude files. See [examples/exclude-files](examples/exclude-files).
Another important option is `excludeAfterRemap`. By default it is false, which might let excluded files through. If you are excluding the files, and the instrumenter does not respect the `nyc.exclude` setting, then add `excludeAfterRemap: true` to tell `nyc report` to exclude files. See [test-apps/exclude-files](test-apps/new-cypress-config/exclude-files).

## Disable plugin

Expand Down Expand Up @@ -392,19 +405,19 @@ npm run dev:no:coverage

## Examples

### Internal examples
### Internal test apps

Full examples we use for testing in this repository:

- [examples/backend](examples/backend) only instruments the backend Node server and saves the coverage report
- [examples/fullstack](examples/fullstack) instruments and merges backend, e2e and unit test coverage into a single report
- [examples/before-all-visit](examples/before-all-visit) checks if code coverage works when `cy.visit` is made once in the `before` hook
- [examples/before-each-visit](examples/before-each-visit) checks if code coverage correctly keeps track of code when doing `cy.visit` before each test
- [examples/one-spec.js](examples/one-spec.js) confirms that coverage is collected and filtered correctly if the user only executes a single Cypress test
- [examples/ts-example](examples/ts-example) uses Babel + Parcel to instrument and serve TypeScript file
- [examples/use-webpack](examples/use-webpack) shows Webpack build with source maps and Babel
- [examples/unit-tests-js](examples/unit-tests-js) runs just the unit tests and reports code coverage (JavaScript source code)
- [examples/unit-tests-ts](examples/unit-tests-ts) **NOT WORKING** runs just the unit tests and reports code coverage (TypeScript source code)
- [test-apps/backend](test-apps/new-cypress-config/backend) only instruments the backend Node server and saves the coverage report
- [test-apps/fullstack](test-apps/new-cypress-config/fullstack) instruments and merges backend, e2e and unit test coverage into a single report
- [test-apps/before-all-visit](test-apps/new-cypress-config/before-all-visit) checks if code coverage works when `cy.visit` is made once in the `before` hook
- [test-apps/before-each-visit](test-apps/new-cypress-config/before-each-visit) checks if code coverage correctly keeps track of code when doing `cy.visit` before each test
- [test-apps/one-spec.js](test-apps/new-cypress-config/one-spec.js) confirms that coverage is collected and filtered correctly if the user only executes a single Cypress test
- [test-apps/ts-example](test-apps/new-cypress-config/ts-example) uses Babel + Parcel to instrument and serve TypeScript file
- [test-apps/use-webpack](test-apps/new-cypress-config/use-webpack) shows Webpack build with source maps and Babel
- [test-apps/unit-tests-js](test-apps/new-cypress-config/unit-tests-js) runs just the unit tests and reports code coverage (JavaScript source code)
- [test-apps/unit-tests-ts](test-apps/new-cypress-config/unit-tests-ts) **NOT WORKING** runs just the unit tests and reports code coverage (TypeScript source code)

### External examples

Expand Down Expand Up @@ -459,7 +472,7 @@ module.exports = (on, config) => {
}
```

See [examples/use-plugins-and-support](examples/use-plugins-and-support)
See [test-apps/use-plugins-and-support](test-apps/new-cypress-config/use-plugins-and-support)

## Debugging

Expand Down
5 changes: 0 additions & 5 deletions cypress/index.html
Original file line number Diff line number Diff line change
@@ -1,8 +1,3 @@
<body>
<nav>
<a href="/about.html">About</a>
</nav>
<h2>Test page</h2>
<p>Open the DevTools to see console messages</p>
<script src="app.js"></script>
</body>
Loading

0 comments on commit 7a32564

Please sign in to comment.