You are currently viewing Execute Angular E2E Tests in Different Environments
Execute E2E Tests in Different Environments

Execute Angular E2E Tests in Different Environments

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 environmentCode language: Bash (bash)

That’s how you execute Angular end-to-end tests in different environments with the CLI.

Umut Esen

I am a software developer and blogger with a passion for the world wide web.

Leave a Reply