Skip to content
This repository was archived by the owner on Mar 5, 2022. It is now read-only.

Commit e4e4b6c

Browse files
committed
feat: add react-scripts plugins as alias to cra-v3
1 parent 9efdec5 commit e4e4b6c

File tree

3 files changed

+25
-2
lines changed

3 files changed

+25
-2
lines changed

README.md

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,19 @@ npm install --save-dev cypress cypress-react-unit-test
5050
require('cypress-react-unit-test/support')
5151
```
5252

53-
2. Tell Cypress how your React application is transpiled or bundled (using Webpack), so Cypress can load your components. See [Recipes](./docs/recipes.md)
53+
2. Tell Cypress how your React application is transpiled or bundled (using Webpack), so Cypress can load your components. For example, if you use `react-scripts` do:
54+
55+
```js
56+
// cypress/plugins/index.js
57+
module.exports = (on, config) => {
58+
require('cypress-react-unit-test/plugins/react-scripts')(on, config)
59+
// IMPORTANT to return the config object
60+
// with the any changed environment variables
61+
return config
62+
}
63+
```
64+
65+
See [Recipes](./docs/recipes.md) for more examples.
5466

5567
3. ⚠️ Turn the experimental component support on in your `cypress.json`. You can also specify where component spec files are located. For example, to have them located in `src` folder use:
5668

docs/recipes.md

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ If you are using Create-React-App v3 or `react-scripts`, and want to reuse the b
1818
```js
1919
// cypress/plugins/index.js
2020
module.exports = (on, config) => {
21-
require('cypress-react-unit-test/plugins/cra-v3')(on, config)
21+
require('cypress-react-unit-test/plugins/react-scripts')(on, config)
2222
// IMPORTANT to return the config object
2323
// with the any changed environment variables
2424
return config
@@ -27,6 +27,8 @@ module.exports = (on, config) => {
2727

2828
See example repo [bahmutov/try-cra-with-unit-test](https://github.com/bahmutov/try-cra-with-unit-test)
2929

30+
**Tip:** `plugins/react-scripts` is just loading `plugins/cra-v3`.
31+
3032
## Your webpack config
3133

3234
If you have your own webpack config, you can use included plugins file to load it.

plugins/react-scripts/index.js

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
const filePreprocessor = require('../cra-v3/file-preprocessor')
2+
3+
module.exports = (on, config) => {
4+
require('@cypress/code-coverage/task')(on, config)
5+
on('file:preprocessor', filePreprocessor(config))
6+
// IMPORTANT to return the config object
7+
// with the any changed environment variables
8+
return config
9+
}

0 commit comments

Comments
 (0)