angular-cli: e2e devServerTarget doesn't seem to be working correctly

Versions

Angular CLI: 6.0.0
Node: 8.9.4
OS: darwin x64
Angular: 6.0.0
... animations, cdk, cli, common, compiler, compiler-cli, core
... elements, forms, http, language-service, material
... platform-browser, platform-browser-dynamic, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.6.0
@angular-devkit/build-angular     0.5.12
@angular-devkit/build-optimizer   0.5.12
@angular-devkit/core              0.6.0
@angular-devkit/schematics        0.6.0
@ngtools/webpack                  6.0.0-rc.10
@schematics/angular               0.6.0
@schematics/update                0.6.0
rxjs                              6.0.0
typescript                        2.7.2
webpack                           4.6.0

Repro steps

This may not be an issue, but rather a lack of understanding of how the new cli config works.

Update port option in myapp-app:serve to 8080
Set myapp-app-e2e:e2e option of devServerTarget to myapp-app:serve
Run ng e2e
Server starts up on localhost:4200 rather than specified port.

Again, maybe I am not understanding how this works, but I would think that if I set the devServerTarget e2e option then whatever configuration that server has it should pull through during the e2e task.

Observed behavior

ng e2e
** Angular Live Development Server is listening on localhost: 4200, open your browser on http://localhost:4200/ **

Desired behavior

I would expect server to startup on the specified port that is set in myapp-app:serve.

Mention any other details that might be useful (optional)

If I set the port option directly in the myapp-app-e2e:e2e options section, then it does respect that and starts up the server on that port.

About this issue

Original URL
State: closed
Created 6 years ago
Reactions: 4
Comments: 21 (6 by maintainers)

Commits related to this issue

fix(@angular-devkit/build-angular): don't override missing options in protractor Fix #10697 — committed to filipesilva/angular-cli by filipesilva 6 years ago
fix(@angular-devkit/build-angular): don't override missing options in protractor (#12507) Fix #10697 — committed to angular/angular-cli by filipesilva 6 years ago
fix(@angular-devkit/build-angular): don't override missing options in protractor (#12507) Fix #10697 — committed to angular/angular-cli by filipesilva 6 years ago

Most upvoted comments

I am a god damn legend. I got it working, here is an example for you guys.

 "serve": {
                    "builder": "@angular-devkit/build-angular:dev-server",
                    "options": {
                        "browserTarget": "Project:build",
                        "hmrWarning": false,
                        "host": "myproject.com",
                        "port": 8000
                    },
                    "configurations": {
                        "hmr": {
                            "hmr": true,
                            "browserTarget": "Project:build:hmr"
                        },
                        "production": {
                            "hmr": false,
                            "browserTarget": "Projectbuild:production"
                        }
                    }
                },

Output message from Angular:

Angular Live Development Server is listening on myproject.com: 8000, open your browser on http://myproject.com:8000/ **

pjmagee on Jun 1, 2018

This doesn’t work for me, because it strips the appended path.

When I run the tests it opens https://localhost not https://localhost/test/local/ which is the production build I need to test. It strips the path information. This used to work before without any issue. It was highly configurable but has now become too opinionated, please revert back, or have a deprecation warning or something.

I can get http://localhost to work for now, but this is not a complete test and bugs will arrive in the future and I’ll can do is blame the angular framework to my VP, which makes me look silly.

Please add the previous functionality back.

        "e2e": {
          "configurations": {
            "noserve": {
              "devServerTarget": "",
              "baseUrl": "https://localhost/test/local/"
            }
          },

MRHarrison on Jan 23, 2019

I was able to delete devServerTarget from angular.json, the change the baseUrl parameter in the e2e project’s protractor.conf.js file and point the e2e test to another port on localhost. I imagine adjusting baseUrl to point to another server would work just as well.

Angular 6.0.8

tongfa on Jul 13, 2018

I am confused too. Documentation is very minimal and there needs to be more verbose examples of how to configure the angular.json file. Especially since the basic examples only show the argument way to define options, e.g --public-host, but doesnt explain if this is “publicHost” in the angular.json

pjmagee on Jun 1, 2018

I found solution … or the problem. Default generated E2E is accessing '/' instead of browser.baseUrl. See e2e/src/app.po.ts

loganmzz on Jan 25, 2019

@Bjeaurn I changed the protractor.conf.js and removed baseUrl from angular.json file but same result.

const { SpecReporter } = require('jasmine-spec-reporter');

exports.config = {
  allScriptsTimeout: 11000,
  specs: [
    './e2e/**/*.e2e-spec.ts'
  ],
  capabilities: {
    'browserName': 'chrome'
  },
  directConnect: true,
  baseUrl: 'https://localhost/test/local/',
  framework: 'jasmine',
  jasmineNodeOpts: {
    showColors: true,
    defaultTimeoutInterval: 30000,
    print: function() {}
  },
  onPrepare() {
    require('ts-node').register({
      project: 'e2e/tsconfig.e2e.json'
    });
    jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
  }
};

MRHarrison on Jan 23, 2019

Heya, we weren’t computing host and port correctly in our Protractor setup. https://github.com/angular/angular-cli/pull/12507 should fix it. Sorry about that!

filipesilva on Oct 8, 2018