Cypress plugin to handle multi environment
Easily manage and streamline your Cypress test scripts across multiple environments with the cypress-env npm library. This lightweight utility simplifies the process of handling different environments (such as test, staging, and production) by providing a environment-specific settings in your Cypress tests.
Install
$ npm install cypress-env --save-dev
or as a global module
$ npm install -g cypress-env
Configuration
Code in cypress.config.js:
In your cypress.config.js file:
module.exports = defineConfig({
e2e: {
setupNodeEvents(on, config) {
require('cypress-env')(on, config, __dirname)
},
},
})
Create the env.config folder:
Then configure a folder named `env.config' with your environments.json files:
├── cypress
│ ├── e2e
│ ├── fixtures
│ └── support
├── cypress.config.js
├── env.config
│ ├── test.json
│ ├── stage.json
│ └── prod.json
├── node_modules
├── README.md
├── package-lock.json
├── package.json
└── .gitignore
Add your environment.json files:
JSON files must respect this syntax:
{
"baseUrl": "https://www.google.com",
"specPattern": "cypress/e2e/**/**.js",
"excludeSpecPattern": "cypress/e2e/**/toExclude.js",
"supportFile": "cypress/support/customName.js",
"env": {
"var1": "value1",
"var2": "value2",
"var3": "value3",
"envName": "environment"
}
}
Parameter | Mandatory | Overwrites value in cypress.config.js | Notes |
---|
baseUrl | FALSE | TRUE | Overwrites value in cypress.config.js |
specPattern | FALSE | TRUE | Overwrites value in cypress.config.js |
excludeSpecPattern | FALSE | TRUE | Overwrites value in cypress.config.js |
supportFile | FALSE | TRUE | Needs the parameters "supportFile" in the main e2e or component object set to false |
env | FALSE | FALSE | OBJ added to values in cypress.config.js |
| | | |
Open or run cypress with the correct environment variables:
Open cypress and inject the envName variables:
npx cypress open -e envName=test
or run cypress and inject the envName variables:
npx cypress run -e envName=test
Results example
Correct configuration
====================================================================================================
Starting plugin: cypress-env
Extracting local configurations from: "path/to/environment.json"
- baseUrl: "https://www.google.com"
- specPattern: "cypress/e2e/**/**.js"
- excludeSpecPattern: "cypress/e2e/**/toExclude.js",
- supportFile: "cypress/support/customName.js",
- env: "{
"var1": "value1",
"var2": "value2",
"var3": "value3",
"envName": "test"
}"
√ Configurations loaded correctly for the environment: < TEST >
====================================================================================================
No configuration specified
====================================================================================================
Starting plugin: cypress-env
√ No environment configuration specified, using basic configuration!
====================================================================================================
Wrong configuration (missing __dirname)
====================================================================================================
Starting plugin: cypress-env
ConfigurationError!
You must specify the "__dirname" element in the config, change the require to:
require("cypress-env")(on, config, __dirname)
====================================================================================================
Little tip for you
In your package.json file create a script like this:
{
"scripts": {
"cy:test": "npx cypress open -e envName=test",
"cy:stage": "npx cypress open -e envName=stage",
"cy:prod": "npx cypress open -e envName=prod"
}
}
So you'll only have to type this command to open cypress in the correct environment:
npm run cy:test
Compatibility with cypress-aws-secrets-manager
"cypress-aws-secrets-manager" is a plugin that allows a secret stored in the AWS secret manager to be loaded into cypress as an environment variable.
To make life easier I added a new key inside ENV: AWS_SECRET_MANAGER_CONFIG.
Parameter | Mandatory | Overwrites value in cypress.config.js | Notes |
---|
AWS_SECRET_MANAGER_CONFIG | FALSE | TRUE | OBJ used by cypress-aws-secrets-manager |
The secret manager plugin will automatically handle this obj to recover the secret archived on AWS secret manager.
{
"baseUrl": "https://www.google.com",
"specPattern": "cypress/e2e/**/**.js",
"excludeSpecPattern": "cypress/e2e/**/toExclude.js",
"supportFile": "cypress/support/customName.js",
"env": {
"var1": "value1",
"var2": "value2",
"var3": "value3",
"envName": "test",
"AWS_SECRET_MANAGER_CONFIG": {
"secretName": "...",
"profile": "...",
"region": "..."
}
}
}
THE JOB IS DONE!
Happy testing to everyone!
ALEC-JS
🙌 Donate to support my work & further development! 🙌