Setting baseUrl in protractor.conf is not working

[jared-christensen]

Versions

Angular CLI: 6.0.7
Node: 10.2.1
OS: darwin x64
Angular: 6.0.3
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.6.7
@angular-devkit/build-angular     0.6.7
@angular-devkit/build-optimizer   0.6.7
@angular-devkit/core              0.6.7
@angular-devkit/schematics        0.6.7
@angular/cli                      6.0.7
@ngtools/webpack                  6.0.7
@schematics/angular               0.6.7
@schematics/update                0.6.7
rxjs                              6.2.0
typescript                        2.7.2
webpack                           4.8.3

node: v10.2.1
npm: 6.1.0
macOS High Sierra 10.13.4

Repro steps

• In a new Angular Cli project, in the e2e folder open protractor.conf.js
• change baseUrl to https://google.com
• run ng e2e

Observed behavior

The brower opens up to http://localhost:4200/ and not https://google.com

Desired behavior

I think it should go to what the baseurl is set to.

Mention any other details that might be useful (optional)

I add browser.sleep(900000) in the first test after navigateTo so I have time to see what is going on.

[flodan]

I have the same problem here. Is there any information about when this is fixed? Or is there a certain workaround?

[Schmaga]

It seems to have to do with using the "serve" target for that configuration, which for some reason overwrites the baseUrl from the protractor.conf. We managed to work around it by either modifying the default "production" e2e config to not use the "serve" as "devServerTarget", or creating a separate configuration in the e2e project part of the angular.json for accessing a different webserver, like this:

"e2e": {
  "builder": "@angular-devkit/build-angular:protractor",
  "options": {
   },
  "configurations": {
     "local": {
        "protractorConfig": "./protractor.conf.js"
        "devServerTarget": "my-app:serve:production",
      },
     "remote": {
        "protractorConfig": "./protractor.conf.remote.js",
      }
   }
}

The first "local" config is used for e2e testing against a locally running "ng served" web server, and the "remote" config is used to run the test suite against a remote web server, which is configured using the baseUrl in the different protractor.conf.remote.js.

Maybe this will help other people with the same problem.

Update: Just to clarify, you don't need a separate protractor.conf in case you only want to overwrite the baseUrl. You can simply do that using the "baseUrl" property of the configuration, or the "base-url" command line parameter:

"remote": {
  "baseUrl": "http://mytestserver",
}

[SaydChada]

You can pass --public-host arg to your ng e2e call (i.e: ng e2e --public-host="https://hostname.com")

[mtaylor769]

@Schmaga - Leaving the "options" block empty like that causes the following error:
Schema validation failed with the following errors: Data path "" should have required property 'protractorConfig'.

I have a local build that needs to point to a dedicated selenium server (not localhost) and while I was hopeful this would work, isn't acting as expected even when I add distinct 'baseURL' arguments to both "remote" and "local" blocks within "configurations"

[mtaylor769]

Here's my angular.json block for 'e2e':

"e2e": {
  "builder": "@angular-devkit/build-angular:protractor",
  "options": {
    "protractorConfig": "./tests/e2e/protractor.conf.js",
    "devServerTarget": "my-app:serve",
  },
  "configurations": {
    "local": {
      "protractorConfig": "./tests/e2e/protractor.conf.js",
      "devServerTarget": "my-app:serve",
      "baseUrl": "https://my.qa.app.server.com/"
    },
    "remote": {
      "baseUrl": "https://my.prod.app.server.com/"
    }
  }
}

[Schmaga]

@mtaylor769 Sorry I should have explained that the options block was omitted for brevity

[mtaylor769]

@Schmaga understood, but I'm still seeing the issue of it redirecting to localhost:4200 in the 'beforeEach' in the spec unless I prepend some sort of 'baseURL' that's hardcoded in a config somewhere. My understanding was that the variables declared and set in the beforeEach were then in scope for the subsequent tests.

One note, however, I am using Page Object Models and it's the browser.get() calls in those that I am seeing this behavior in.

(https://github.com/angular/protractor/blob/master/docs/page-objects.md)

[Schmaga]

@mtaylor769 Are you sure you are not still using the "serve" target? That always seems to overwrite the baseUrl.

[aniruddhadas9]

Anyone facing this issue, please an answer here.

https://stackoverflow.com/questions/50744266/angular-cli-use-configuration-with-e2e-tests/52542761#52542761

[intellix]

I'm setting up a Selenium grid and after getting it to work, wanted to share a composition of what you need to do.

Basically the workaround is to remove the devServerTarget from myapp-e2e.targets.e2e.options and manually serve, so something like this for an external e2e server that needs to talk to your app:

angular.json snippet:

"myapp-e2e": {
  "root": "e2e/",
  "projectType": "application",
  "targets": {
    "e2e": {
      "builder": "@angular-devkit/build-angular:protractor",
      "options": {
        "protractorConfig": "e2e/protractor.conf.js"
      },
      "configurations": {
        "production": {
          "devServerTarget": "myapp:serve:production"
        }
      }
    },

protractor.conf.js:

directConnect: false,
seleniumAddress: 'https://salenium.myapp.com/wd/hub',
baseUrl: 'http://somewhere-where-selenium-can-access-ng-serve:4200',

commands to run in parallel:

ng serve --host=0.0.0.0 --disable-host-check
ng e2e

ng e2e will instruct the external Selenium server to run tests against the server accessible via baseUrl