How to run Protractor e2e tests using different Angular environment variables
Solution 1
With the new Angular 6 angular.json
config file:
I was able to use my file environment.test.ts
on my e2e tests.
I had to create a new architect on my project, I called it serve-e2e
.
"serve-e2e": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "q-desktop-v2:build:test"
}
}
My build:test config uses the "fileReplacements" configurations :
"test": {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.test.ts"
}
]
}
Then in my project-e2e I use my customized "serve-e2e" option for the devServerTarget:
"options": {
"protractorConfig": "./protractor.conf.js",
"devServerTarget": "q-desktop-v2:serve-e2e"
}
This makes it easy to add or ignore specific code if the app is running on test environment :
if (!environment.test) {
// do something
}
Solution 2
I was able to successfully use a different environment by adding it to the .angular-cli.json
"environments": {
"dev": "environments/environment.ts",
"test": "environments/environment.test.ts",
"prod": "environments/environment.prod.ts"
}
then calling
ng e2e --environment test
Solution 3
Angular 6 removed support for the --environment
option. For build
or serve
you can just switch to ng build --configuration test
or ng serve --configuration test
. However, at least in my project, the Angular upgrade actually created a whole other project configuration named <myproject>-e2e
in my angular.json file.
Inside, it might look something like this.
"myproject-e2e": {
"root": "",
"sourceRoot": "",
"projectType": "application",
"architect": {
"e2e": {
"builder": "@angular-devkit/build-angular:protractor",
"options": {
"protractorConfig": "./protractor.conf.js",
"devServerTarget": "jglite:serve"
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"e2e/tsconfig.e2e.json"
],
"exclude": [
"**/node_modules/**"
]
}
}
}
}
The "devServerTarget": "jglite:serve"
line is pointing the configuration at my default serve
configuration.
In my case, I want to always run my e2e tests with my dev
configuration, so I just changed this line to "devServerTarget": "jglite:serve:dev"
, and then I could run the environment I needed by just calling ng e2e
.
Serhii Shushliapin
Updated on July 06, 2022Comments
-
Serhii Shushliapin almost 2 years
I use Angular environment variables to configure API endpoints:
.\src\environments: environment.ts environment.test.ts environment.prod.ts
The environtment files contain settings like the following which are different for local dev and CI servers:
export const environment = { ... apiUrl: "https://api.sample.com" };
That works fine when I need to build or start the application. I can simply specify the environment parameter:
ng serve --environment=test
... but it appeared that it's impossible to set a specific environment when running e2e Protractor tests. The following command simply ignores the environment (which seems to be expected according to this comment). The default environment is always used:
ng e2e --environment=test // same as `ng e2e`
Are there any other ways to run the tests using a specific environment?