Angular-cli: [RFC] host & port in config file

[Nek-]

Bug Report or Feature Request

- [ ] bug report -> please search issues before submitting
- [x] feature request

Desired functionality.

e2e overrides host. When you have a custom host the only way to change it is to use the command line and add the option host (same for the port, which is less disturbing).

This option should be configurable in the config file. Or at least taking care of the option of protractor.

Mention any other details that might be useful.

This idea comes from the fact we use docker-compose with a deported selenium (for front e2e and back e2e tests) that needs to work on the hostname and not localhost. This implies we need some config file where to specify the related hostname.

Please hit :+1: if you're ok with the idea. I can handle it if you don't want to do it.

[filipesilva]

Yeah I think this would be a nice addition. We're still moving options to the .angular-cli.json file and that one isn't there yet.

If you're willing to take it on, it's easy using the existing code:

• this bit loads the defaults: https://github.com/angular/angular-cli/blob/master/packages/@angular/cli/commands/serve.ts#L12-L14
• you also need to the new options to the schema: https://github.com/angular/angular-cli/blob/master/packages/@angular/cli/lib/config/schema.json#L502

[prashit]

Having similar config for disableHostCheck would be very much helpful.

[prashit]

@filipesilva , Can you please review the patch for disableHostCheck and get it merged? Host and Port are already implemented. The thread can be closed.

[maximelafarie]

@filipesilva Please, according to @Nek-'s issue, can you tell me what do you think about that :

1. Set the hosts directly into the angular-cli.json file:

...
"environmentSource": "environments/environment.ts",
"environments": {
  "dev": "environments/environment.ts",
  "prod": "environments/environment.prod.ts"
},
"hosts": {
  "dev": "http://localhost:1337/",
  "prod": "http://localhost:80/api/"
},
...

or:

1. Set the hosts into the environment files (e.g.: environment.prod.ts):

export const environment = {
  production: true,
  host: "http://localhost:80/api/"
};

[filipesilva]

@maximelafarie I think it's worth it to clarify what this issue is about... as I understand, @Nek- would like to use host and port from the config file while using ng e2e.

This is possible for serve by using the defaults entry in .angular-cli.json:

{
// ...
  "defaults": {
    "styleExt": "css",
    "component": {},
    "serve": {
      "host": "localhost",
      "port": 4201
    }
  }
}

But not possible for e2e because it does not pick up the defaults as serve does.

I don't think port should be picked up from the serve options because otherwise you wouldn't be able to run ng e2e and ng serve at the same time (they would try the same port). But picking up host automatically should be fine and make sense.

To automatically pick up the port you would need to use similar code to https://github.com/angular/angular-cli/blob/master/packages/@angular/cli/commands/serve.ts#L12-L14 in the e2e command.

[stephaneeybert]

@filipesilva You'd know the configuraiton for Angular 6 ?

[filipesilva]

@stephaneeybert same thing, but inside the serve target:

"serve": {
  "builder": "@angular-devkit/build-angular:dev-server",
  "options": {
    "browserTarget": "project-name:build",
    "host": "localhost",
    "port": 4201
  },

[Nrusingha1]

Thanks

[callmepills]

One gotcha that I noticed with 6.1.2 is that the host option defined in the serve target is not respected by the e2e builder. I thought the option override would work like:

e2e.host --> serve.host --> default.host

For now, I had to configure both builders with the 0.0.0.0 value while disableHostCheck was only configured in the serve option set.

[tiaguinho]

@filipesilva can you give me a hint on how to implement this?

[filipesilva]

@tiaguinho heya, thanks for reaching out about taking on this issue!

I'm looking at the source code for the e2e builder and actually think we support this already:

https://github.com/angular/angular-cli/blob/7d15c5dd0284ea2d8e8097172c5b14afeb37489e/packages/angular_devkit/build_angular/src/protractor/index.ts#L64-L66

You should be able to specify a host/port combo in the e2e target:

      "architect": {
        "e2e": {
          "builder": "@angular-devkit/build-angular:protractor",
          "options": {
            "protractorConfig": "e2e/protractor.conf.js",
            "devServerTarget": "latest-project:serve"
            "host": "localhost",
            "port": 1234
          },

So I don't think there's anything else to do here now.

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}