From 409e649bff983d2b1eccf15a67aa2644941e612a Mon Sep 17 00:00:00 2001 From: Lachlan Miller Date: Mon, 15 Mar 2021 11:01:36 +1000 Subject: [PATCH 1/6] docs: document mode argument to plugins --- content/api/plugins/configuration-api.md | 26 ++++++++++++++++--- content/guides/references/configuration.md | 30 ++++++++++++++++++++++ 2 files changed, 52 insertions(+), 4 deletions(-) diff --git a/content/api/plugins/configuration-api.md b/content/api/plugins/configuration-api.md index 3e724e635a..2afa766589 100644 --- a/content/api/plugins/configuration-api.md +++ b/content/api/plugins/configuration-api.md @@ -10,8 +10,8 @@ To modify configuration, you return an object from your plugins file exported fu ```javascript // cypress/plugins/index.js -module.exports = (on, config) => { - console.log(config) // see what all is in here! +module.exports = (on, config, mode) => { + console.log(config) // see everything in here! // modify config values config.defaultCommandTimeout = 10000 @@ -62,7 +62,7 @@ In the plugins file, you can filter the list of browsers passed inside the `conf ```javascript // cypress/plugins/index.js -module.exports = (on, config) => { +module.exports = (on, config, mode) => { // inside config.browsers array each object has information like // { // name: 'chrome', @@ -114,7 +114,7 @@ function getConfigurationByFile(file) { } // plugins file -module.exports = (on, config) => { +module.exports = (on, config, mode) => { // accept a configFile value or use development by default const file = config.env.configFile || 'development' @@ -198,3 +198,21 @@ This would enable you to do things like this: This is a less complicated example. Remember - you have the full power of Node at your disposal. How you choose to edit the configuration is up to you. You don't have to read off of the file system - you could store them all in memory inside of your `pluginsFile` if you wanted. + +### Runner Specific Plugins + +As of Cypress 7.0, Cypress now includes a [Component Testing](/guides/component-testing/introduction/) specific runner. The exported function from the plugins file recevies three arugments; the third is `mode`, which is either `e2e` or `component` depending on which runner was launched. This allows you to configure runner specific plugins. + +#### Use Cypress React Plugin Conditionally + +Conditionally apply the Cypress React Plugin if launching in Component Testing mode: + +```js +module.exports = (on, config, mode) => { + if (mode === 'component') { + require('@cypress/react/plugins/react-scripts')(on, config) + } + + return config +} +``` diff --git a/content/guides/references/configuration.md b/content/guides/references/configuration.md index 4a7149b129..74dc58da78 100644 --- a/content/guides/references/configuration.md +++ b/content/guides/references/configuration.md @@ -178,6 +178,36 @@ For more complex configuration objects, you may want to consider passing a [JSON cypress open --config '{"watchForFileChanges":false,"testFiles":["**/*.js","**/*.ts"]}' ``` +### Runner Specific Overrides + +As of Cypress 7.0, Cypress now includes a [Component Testing](/guides/component-testing/introduction/) specific runner. You can override configuration in `cypress.json` for either the E2E or Component Testing runner using the `e2e` and `component` options in `cypress.json`. + +#### Examples + +Component Testing specific viewports: + +```json +{ + "viewportHeight": 600, + "viewportWidth": 1000, + "component": { + "viewportHeight": 500, + "viewportWidth": 500 + } +} +``` + +E2E specific timeouts: + +```json +{ + "defaultCommandTimeout": 5000, + "e2e": { + "defaultCommandTimeout": 10000 + } +} +``` + ### Plugins You can programmatically modify configuration values using Node within the `pluginsFile`. This enables you to do things like: From 1ff755bc4a0072f3a5dceec543b88e1735873a6e Mon Sep 17 00:00:00 2001 From: Jennifer Shehane Date: Mon, 15 Mar 2021 09:45:33 -0400 Subject: [PATCH 2/6] updates --- content/api/plugins/configuration-api.md | 8 +++++++- content/guides/references/configuration.md | 7 ++++--- 2 files changed, 11 insertions(+), 4 deletions(-) diff --git a/content/api/plugins/configuration-api.md b/content/api/plugins/configuration-api.md index 2afa766589..76976ba3ac 100644 --- a/content/api/plugins/configuration-api.md +++ b/content/api/plugins/configuration-api.md @@ -201,7 +201,7 @@ How you choose to edit the configuration is up to you. You don't have to read of ### Runner Specific Plugins -As of Cypress 7.0, Cypress now includes a [Component Testing](/guides/component-testing/introduction/) specific runner. The exported function from the plugins file recevies three arugments; the third is `mode`, which is either `e2e` or `component` depending on which runner was launched. This allows you to configure runner specific plugins. +The exported function from the plugins file receives three arguments. The third argument is `mode`, which is either `e2e` or `component` depending on if the E2E or [Component Testing](/guides/component-testing/introduction/) runner was launched. This allows you to configure runner specific plugins. #### Use Cypress React Plugin Conditionally @@ -216,3 +216,9 @@ module.exports = (on, config, mode) => { return config } ``` + +## History + +| Version | Changes | +| ------------------------------------- | ---------------------- | +| [7.0.0](/guides/references/changelog) | Added `mode` argument. | diff --git a/content/guides/references/configuration.md b/content/guides/references/configuration.md index 74dc58da78..3411cf47d3 100644 --- a/content/guides/references/configuration.md +++ b/content/guides/references/configuration.md @@ -180,11 +180,11 @@ cypress open --config '{"watchForFileChanges":false,"testFiles":["**/*.js","**/* ### Runner Specific Overrides -As of Cypress 7.0, Cypress now includes a [Component Testing](/guides/component-testing/introduction/) specific runner. You can override configuration in `cypress.json` for either the E2E or Component Testing runner using the `e2e` and `component` options in `cypress.json`. +You can override configuration for either the E2E or [Component Testing](/guides/component-testing/introduction/) runner using the `e2e` and `component` options. #### Examples -Component Testing specific viewports: +Component Testing specific viewports in configuration file (`cypress.json` by default): ```json { @@ -197,7 +197,7 @@ Component Testing specific viewports: } ``` -E2E specific timeouts: +E2E specific timeouts in configuration file (`cypress.json` by default): ```json { @@ -547,6 +547,7 @@ DEBUG=cypress:cli,cypress:server:specs | Version | Changes | | -------------------------------------------- | ------------------------------------------------------- | +| [7.0.0](/guides/references/changelog) | Added `e2e` and `component` options. | | [6.1.0](/guides/references/changelog#6-1-0) | Added option `scrollBehavior` | | [5.2.0](/guides/references/changelog#5-2-0) | Added `includeShadowDom` option. | | [5.0.0](/guides/references/changelog) | Added `retries` configuration. | From 439ce3228934a17a500a257385fc2b8a6fc05f30 Mon Sep 17 00:00:00 2001 From: Lachlan Miller Date: Thu, 18 Mar 2021 14:30:14 +1000 Subject: [PATCH 3/6] docs: update docs to include testingType --- content/_data/en.json | 1 + content/_data/sidebar.json | 1 + content/api/cypress-api/testing-type.md | 39 ++++++++++++++++++++++++ content/api/plugins/configuration-api.md | 10 +++--- content/guides/tooling/plugins-guide.md | 2 +- 5 files changed, 47 insertions(+), 6 deletions(-) create mode 100644 content/api/cypress-api/testing-type.md diff --git a/content/_data/en.json b/content/_data/en.json index 40bc461dbb..9f0884cc95 100644 --- a/content/_data/en.json +++ b/content/_data/en.json @@ -222,6 +222,7 @@ "configuration-api": "Configuration", "version": "version", "arch": "arch", + "testing-type": "testingType", "browser": "browser", "platform": "platform", "selector-playground-api": "SelectorPlayground", diff --git a/content/_data/sidebar.json b/content/_data/sidebar.json index f01964cb2c..4a162c6ba5 100644 --- a/content/_data/sidebar.json +++ b/content/_data/sidebar.json @@ -207,6 +207,7 @@ "cypress-log": "cypress-log.html", "platform": "platform.html", "spec": "spec.html", + "testing-type": "testing-type.html", "version": "version.html" }, "plugins": { diff --git a/content/api/cypress-api/testing-type.md b/content/api/cypress-api/testing-type.md new file mode 100644 index 0000000000..357158b7cd --- /dev/null +++ b/content/api/cypress-api/testing-type.md @@ -0,0 +1,39 @@ +--- +title: Cypress.testingType +--- + +`Cypress.testingType` returns the current testing type, determined by the test runner. It is either `e2e` for the regular Cypress test runner, or `component` for experimental [Component Testing](guides/component-testing/introduction). + +## Syntax + +```javascript +Cypress.testingType // returns 'e2e' or 'component' +``` + +## Examples + +### Testing Type + +```javascript +it('is running experimental component testing mode', () => { + expect(Cypress.testingType).to.be.equal('component') +}) +``` + +### Conditionals + +```javascript +it('does something differently', () => { + if (Cypress.testingType === 'e2e') { + cy.exec('something') + } else { + cy.exec('something else') + } +}) +``` + +## History + +| Version | Changes | +| ------------------------------------- | ------------------ | +| [7.0.0](/guides/references/changelog) | Added `testingType | diff --git a/content/api/plugins/configuration-api.md b/content/api/plugins/configuration-api.md index 76976ba3ac..25ed463c58 100644 --- a/content/api/plugins/configuration-api.md +++ b/content/api/plugins/configuration-api.md @@ -208,8 +208,8 @@ The exported function from the plugins file receives three arguments. The third Conditionally apply the Cypress React Plugin if launching in Component Testing mode: ```js -module.exports = (on, config, mode) => { - if (mode === 'component') { +module.exports = (on, config) => { + if (config.testingType === 'component') { require('@cypress/react/plugins/react-scripts')(on, config) } @@ -219,6 +219,6 @@ module.exports = (on, config, mode) => { ## History -| Version | Changes | -| ------------------------------------- | ---------------------- | -| [7.0.0](/guides/references/changelog) | Added `mode` argument. | +| Version | Changes | +| ------------------------------------- | ----------------------------------------- | +| [7.0.0](/guides/references/changelog) | Added `testingType` property to `config`. | diff --git a/content/guides/tooling/plugins-guide.md b/content/guides/tooling/plugins-guide.md index 8df117d09a..ea5ebb643c 100644 --- a/content/guides/tooling/plugins-guide.md +++ b/content/guides/tooling/plugins-guide.md @@ -159,7 +159,7 @@ Plugins from our [official list](/plugins/plugins/index) are npm modules. This e You can install any published plugin using NPM: ```shell -npm install <plugin name> --save-dev +npm install --save-dev ``` ## Using a plugin From 4a3ef47ea64ac45ca69e650bef8754f95c5eaf28 Mon Sep 17 00:00:00 2001 From: Lachlan Miller Date: Fri, 19 Mar 2021 10:39:39 +1000 Subject: [PATCH 4/6] fix test --- content/api/cypress-api/testing-type.md | 6 +++--- cypress/integration/api.spec.js | 1 + 2 files changed, 4 insertions(+), 3 deletions(-) diff --git a/content/api/cypress-api/testing-type.md b/content/api/cypress-api/testing-type.md index 357158b7cd..c8bd6ee1ca 100644 --- a/content/api/cypress-api/testing-type.md +++ b/content/api/cypress-api/testing-type.md @@ -34,6 +34,6 @@ it('does something differently', () => { ## History -| Version | Changes | -| ------------------------------------- | ------------------ | -| [7.0.0](/guides/references/changelog) | Added `testingType | +| Version | Changes | +| ------------------------------------- | ------------------- | +| [7.0.0](/guides/references/changelog) | Added `testingType` | diff --git a/cypress/integration/api.spec.js b/cypress/integration/api.spec.js index 962543b27b..6a916f35f9 100644 --- a/cypress/integration/api.spec.js +++ b/cypress/integration/api.spec.js @@ -74,6 +74,7 @@ describe('APIs', () => { 'cypress-log': 'Cypress.log', platform: 'Cypress.platform', spec: 'Cypress.spec', + 'testing-type': 'Cypress.testingType', version: 'Cypress.version', 'configuration-api': 'Configuration API', 'preprocessors-api': 'Preprocessors API', From 853d7e5f1d12cecbcf5d2b1cb722c39db7b44a39 Mon Sep 17 00:00:00 2001 From: Jennifer Shehane Date: Mon, 29 Mar 2021 10:13:10 -0400 Subject: [PATCH 5/6] Minor updates --- content/api/cypress-api/testing-type.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/content/api/cypress-api/testing-type.md b/content/api/cypress-api/testing-type.md index c8bd6ee1ca..ddfe0d36b4 100644 --- a/content/api/cypress-api/testing-type.md +++ b/content/api/cypress-api/testing-type.md @@ -2,7 +2,7 @@ title: Cypress.testingType --- -`Cypress.testingType` returns the current testing type, determined by the test runner. It is either `e2e` for the regular Cypress test runner, or `component` for experimental [Component Testing](guides/component-testing/introduction). +`Cypress.testingType` returns the current testing type, determined by the Test Runner chosen to run. The `Cypress.testingType` returns `e2e` for Cypress Test Runner `integration` tests, or `component` for experimental [Component Testing](guides/component-testing/introduction). ## Syntax @@ -16,7 +16,7 @@ Cypress.testingType // returns 'e2e' or 'component' ```javascript it('is running experimental component testing mode', () => { - expect(Cypress.testingType).to.be.equal('component') + expect(Cypress.testingType).to.equal('component') }) ``` @@ -34,6 +34,6 @@ it('does something differently', () => { ## History -| Version | Changes | -| ------------------------------------- | ------------------- | -| [7.0.0](/guides/references/changelog) | Added `testingType` | +| Version | Changes | +| ------------------------------------- | --------------------------- | +| [7.0.0](/guides/references/changelog) | Added `Cypress.testingType` | From a92add59f209b8719fea4e1b156e2da25bd2d699 Mon Sep 17 00:00:00 2001 From: Jennifer Shehane Date: Mon, 29 Mar 2021 13:24:12 -0400 Subject: [PATCH 6/6] Remove mention of 'mode' arg from plugins - this is not in PR --- content/api/plugins/configuration-api.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/content/api/plugins/configuration-api.md b/content/api/plugins/configuration-api.md index 25ed463c58..ef06c389da 100644 --- a/content/api/plugins/configuration-api.md +++ b/content/api/plugins/configuration-api.md @@ -10,7 +10,7 @@ To modify configuration, you return an object from your plugins file exported fu ```javascript // cypress/plugins/index.js -module.exports = (on, config, mode) => { +module.exports = (on, config) => { console.log(config) // see everything in here! // modify config values @@ -62,7 +62,7 @@ In the plugins file, you can filter the list of browsers passed inside the `conf ```javascript // cypress/plugins/index.js -module.exports = (on, config, mode) => { +module.exports = (on, config) => { // inside config.browsers array each object has information like // { // name: 'chrome', @@ -114,7 +114,7 @@ function getConfigurationByFile(file) { } // plugins file -module.exports = (on, config, mode) => { +module.exports = (on, config) => { // accept a configFile value or use development by default const file = config.env.configFile || 'development' @@ -201,11 +201,11 @@ How you choose to edit the configuration is up to you. You don't have to read of ### Runner Specific Plugins -The exported function from the plugins file receives three arguments. The third argument is `mode`, which is either `e2e` or `component` depending on if the E2E or [Component Testing](/guides/component-testing/introduction/) runner was launched. This allows you to configure runner specific plugins. +You can access the type of tests running via the `config.testingType` property. The testing type is either `e2e` or `component` depending on if the E2E or [Component Testing](/guides/component-testing/introduction/) runner was launched. This allows you to configure runner specific plugins. #### Use Cypress React Plugin Conditionally -Conditionally apply the Cypress React Plugin if launching in Component Testing mode: +Conditionally apply the Cypress React Plugin if launching via Component Testing: ```js module.exports = (on, config) => {