diff --git a/content/_data/plugins.json b/content/_data/plugins.json index 906279a290..9b13e2bb29 100644 --- a/content/_data/plugins.json +++ b/content/_data/plugins.json @@ -342,6 +342,13 @@ "link": "https://github.com/nils-hoyer/cypress-fail-on-console-error", "keywords": ["console", "error", "fail"], "badge": "community" + }, + { + "name": "Cypress Chrome Recorder Extension", + "description": "Official Cypress extension for Chrome DevTools that allows you to export Cypress tests directly from the Recorder panel.", + "link": "https://chrome.google.com/webstore/detail/cypress-chrome-recorder/fellcphjglholofndfmmjmheedhomgin", + "keywords": ["recording", "chrome", "extension", "devtools"], + "badge": "official" } ] }, @@ -608,7 +615,13 @@ "name": "cypress-forced-colors", "description": "Cypress commands to enable and disable browser forced colors mode", "link": "https://github.com/ling1726/cypress-forced-colors", - "keywords": ["forced colors", "high contrast", "high contrast mode", "contrast", "testing"], + "keywords": [ + "forced colors", + "high contrast", + "high contrast mode", + "contrast", + "testing" + ], "badge": "community" }, { @@ -650,12 +663,12 @@ "link": "https://picklejs.com", "keywords": ["cucumber", "collection", "actions", "commands"], "badge": "community" - }, + }, { "name": "Pact Cypress Adapter", "description": "Simple commands to generate Pact contracts from your existing Cypress tests, maintained by the Pactflow team", "link": "https://github.com/pactflow/pact-cypress-adapter", - "keywords": ["pact","pactflow", "contract testing", "commands"], + "keywords": ["pact", "pactflow", "contract testing", "commands"], "badge": "community" } ] @@ -961,10 +974,7 @@ "name": "Cypress Chrome Recorder", "description": "Tool for exporting Cypress Tests from Google Chrome DevTools' Recordings", "link": "https://github.com/cypress-io/cypress-chrome-recorder", - "keywords": [ - "visual testing", - "recorder" - ], + "keywords": ["visual testing", "recorder"], "badge": "experimental" } ] diff --git a/content/api/plugins/browser-launch-api.md b/content/api/plugins/browser-launch-api.md index b4db037704..2e60d61c1f 100644 --- a/content/api/plugins/browser-launch-api.md +++ b/content/api/plugins/browser-launch-api.md @@ -48,10 +48,11 @@ following properties: | `preferences` | `object` | An object describing browser preferences. Differs between browsers. See [Changing browser preferences](#Changing-browser-preferences) for details. | | `args` | `string[]` | An array of strings that will be passed as command-line args when the browser is launched. Has no effect on Electron. See [Modify browser launch arguments](#Modify-browser-launch-arguments) for details. | | `extensions` | `string[]` | An array of paths to folders containing unpacked WebExtensions to be loaded before the browser starts. Note: Electron currently only supports Chrome DevTools extensions. See [Add browser extensions](#Add-browser-extensions) for details. | +| `env` | `object` | An object of environment variables to pass to the launched browser. See [Configure browser environment](#Configure-browser-environment) for details. | ## Usage -### Modify browser launch arguments, preferences, and extensions +### Modify browser launch arguments, preferences, extensions, and environment Using the [setupNodeEvents](/guides/tooling/plugins-guide#Using-a-plugin) function you can tap into the `before:browser:launch` event and modify how @@ -120,6 +121,24 @@ on('before:browser:launch', (browser, launchOptions) => { ::: +#### Configure browser environment: + + +This option is not supported when targeting Electron. + + +:::cypress-plugin-example + +```js +on('before:browser:launch', (browser, launchOptions) => { + launchOptions.env.CUSTOM_ENV_VALUE = '1' + + return launchOptions +}) +``` + +::: + #### Changing browser preferences: Here are preferences available for the currently supported browsers: diff --git a/content/guides/component-testing/component-framework-configuration.md b/content/guides/component-testing/component-framework-configuration.md index 73a33b3c32..af54219aec 100644 --- a/content/guides/component-testing/component-framework-configuration.md +++ b/content/guides/component-testing/component-framework-configuration.md @@ -215,6 +215,15 @@ module.exports = defineConfig({ devServer: { framework: 'react', bundler: 'vite', + // optionally pass in vite config + viteConfig: require('./webpack.config'), + // or a function - the result is merged with + // any `vite.config` file that is detected + viteConfig: async () => { + // ... do things ... + const modifiedConfig = await injectCustomConfig(baseConfig) + return modifiedConfig + }, }, }, }) @@ -225,12 +234,22 @@ module.exports = defineConfig({ ```ts import { defineConfig } from 'cypress' +import customViteConfig from './customConfig' export default defineConfig({ component: { devServer: { framework: 'react', bundler: 'vite', + // optionally pass in vite config + viteConfig: customViteConfig, + // or a function - the result is merged with + // any `vite.config` file that is detected + viteConfig: async () => { + // ... do things ... + const modifiedConfig = await injectCustomConfig(baseConfig) + return modifiedConfig + }, }, }, }) @@ -260,6 +279,13 @@ module.exports = { bundler: 'webpack', // optionally pass in webpack config webpackConfig: require('./webpack.config'), + // or a function - the result is merged with any + // webpack.config that is found + webpackConfig: async () => { + // ... do things ... + const modifiedConfig = await injectCustomConfig(baseConfig) + return modifiedConfig + }, }, }, } @@ -279,6 +305,13 @@ export default defineConfig({ bundler: 'webpack', // optionally pass in webpack config webpackConfig, + // or a function - the result is merged with any + // webpack.config that is found + webpackConfig: async () => { + // ... do things ... + const modifiedConfig = await injectCustomConfig(baseConfig) + return modifiedConfig + }, }, }, }) @@ -472,6 +505,13 @@ module.exports = { bundler: 'webpack', // optionally pass in webpack config webpackConfig: require('./webpack.config'), + // or a function - the result is merged with any + // webpack.config that is found + webpackConfig: async () => { + // ... do things ... + const modifiedConfig = await injectCustomConfig(baseConfig) + return modifiedConfig + }, }, }, } @@ -491,6 +531,11 @@ export default defineConfig({ bundler: 'webpack', // optionally pass in webpack config webpackConfig, + webpackConfig: async () => { + // ... do things ... + const modifiedConfig = await injectCustomConfig(baseConfig) + return modifiedConfig + }, }, }, }) @@ -675,6 +720,12 @@ module.exports = { bundler: 'webpack', // optionally pass in webpack config webpackConfig: require('./webpack.config'), + // or a function - the result is merged with the base config + webpackConfig: async () => { + // ... do things ... + const modifiedConfig = await injectCustomConfig(baseConfig) + return modifiedConfig + }, }, }, } diff --git a/netlify.toml b/netlify.toml index 4af6967cfe..59c08f8175 100644 --- a/netlify.toml +++ b/netlify.toml @@ -148,6 +148,12 @@ to = "/guides/references/bundled-libraries" status = 301 force = true + +[[redirects]] + from = "/guides/references/bundled-tools.html" + to = "/guides/references/bundled-libraries" + status = 301 + force = true [[redirects]] from = "/guides/component-testing/props-vue"