The default Angular project template executes end-to-end tests using the development environment. If you’re like me and switch to a Mac from Windows quite frequently, you may want to have the ability to execute your e2e tests in a different configuration. We will enable executing Angular e2e tests in different environments by modifying the angular.json
:
First of all, you need to ensure the project has been setup with multiple environments in the first place. I happen to use the following environments, each with its own environment.ts
file under src/environments
folder.
- dev environment (environment.ts)
- dev environment for MacOs (environment.mac.ts)
- production environment (environment.prod.ts)
The default Angular project template comes with environment.ts
and environment.prod.ts
already configured. I have added the mac environment to configurations
for project configuration in angular.json
file. In my case, the mac configuration is for purely storing a different API URL (127.0.0.1 instead of localhost).
Modify angular.json
file to add additional e2e environment configuration like below. Make sure to add these inside the e2e
setup:
"project-xyz-e2e": {
"root": "e2e/",
"projectType": "application",
"architect": {
"e2e": {
"builder": "@angular-devkit/build-angular:protractor",
"options": {
"protractorConfig": "e2e/protractor.conf.js"
},
"configurations": {
"production": {
"devServerTarget": "project-timify:serve:production"
},
"mac": {
"devServerTarget": "project-timify:serve:mac"
}
}
}
....
}
Code language: JSON / JSON with Comments (json)
This allows you to specify the environment you wish to execute the end to end tests with the --configuration
flag:
ng e2e // Execute using dev environment
ng e2e --configuration=mac // Execute using mac environment
ng e2e --configuration=production // Execute using production environment
Code language: Bash (bash)
That’s how you execute Angular end-to-end tests in different environments with the CLI.