From 7d357a4040ac82ea91a42890d0a786801982fef6 Mon Sep 17 00:00:00 2001 From: Reto Lehmann Date: Tue, 27 Jun 2017 17:46:44 +0200 Subject: [PATCH] fix(@angular/cli): Fixed e2e task to respect --publicHost setting as baseUrl for protractor (#6266) https://github.com/angular/angular-cli/pull/6173 added two new settings to the serve task. The --publicHost setting is not respected as baseUrl for protractor in the e2e-task. With this fix, if --publicHost is set, it will be used as baseUrl for protrator. --- packages/@angular/cli/tasks/e2e.ts | 10 +++++- tests/e2e/tests/misc/live-reload.ts | 49 ++++++++++++++++++++++++----- 2 files changed, 50 insertions(+), 9 deletions(-) diff --git a/packages/@angular/cli/tasks/e2e.ts b/packages/@angular/cli/tasks/e2e.ts index cb6cfe626434..3b2cec98991e 100644 --- a/packages/@angular/cli/tasks/e2e.ts +++ b/packages/@angular/cli/tasks/e2e.ts @@ -26,7 +26,15 @@ export const E2eTask = Task.extend({ }; // use serve url as override for protractors baseUrl - if (e2eTaskOptions.serve) { + if (e2eTaskOptions.serve && e2eTaskOptions.publicHost) { + let publicHost = e2eTaskOptions.publicHost; + if (!/^\w+:\/\//.test(publicHost)) { + publicHost = `${e2eTaskOptions.ssl ? 'https' : 'http'}://${publicHost}`; + } + const clientUrl = url.parse(publicHost); + e2eTaskOptions.publicHost = clientUrl.host; + additionalProtractorConfig.baseUrl = url.format(clientUrl); + } else if (e2eTaskOptions.serve) { additionalProtractorConfig.baseUrl = url.format({ protocol: e2eTaskOptions.ssl ? 'https' : 'http', hostname: e2eTaskOptions.host, diff --git a/tests/e2e/tests/misc/live-reload.ts b/tests/e2e/tests/misc/live-reload.ts index c32b4fdcf5c0..a8809f646404 100644 --- a/tests/e2e/tests/misc/live-reload.ts +++ b/tests/e2e/tests/misc/live-reload.ts @@ -1,7 +1,9 @@ +import * as os from 'os'; +import * as _ from 'lodash'; import * as express from 'express'; import * as http from 'http'; -import { appendToFile, writeMultipleFiles } from '../../utils/fs'; +import {appendToFile, writeMultipleFiles, writeFile} from '../../utils/fs'; import { killAllProcesses, silentExecAndWaitForOutputToMatch, @@ -18,21 +20,32 @@ export default function () { const app = express(); const server = http.createServer(app); let liveReloadCount = 0; - let liveReloadClientCalled = false; function resetApiVars() { liveReloadCount = 0; - liveReloadClientCalled = false; } server.listen(0); app.set('port', server.address().port); + + const firstLocalIp = _(os.networkInterfaces()) + .values() + .flatten() + .filter({ family: 'IPv4', internal: false }) + .map('address') + .first(); + const publicHost = `${firstLocalIp}:4200`; + const apiUrl = `http://localhost:${server.address().port}`; // This endpoint will be pinged by the main app on each reload. app.get('/live-reload-count', _ => liveReloadCount++); - // This endpoint will be pinged by webpack to check for live reloads. - app.get('/sockjs-node/info', _ => liveReloadClientCalled = true); + const proxyConfigFile = 'proxy.config.json'; + const proxyConfig = { + '/live-reload-count': { + target: apiUrl + } + }; return Promise.resolve() .then(_ => writeMultipleFiles({ @@ -122,15 +135,35 @@ export default function () { .then(_ => killAllProcesses(), (err) => { killAllProcesses(); throw err; }) .then(_ => resetApiVars()) // Serve with live reload client set to api should call api. + .then(() => writeFile(proxyConfigFile, JSON.stringify(proxyConfig, null, 2))) + // Update the component to call the webserver + .then(() => writeFile('./src/app/app.component.ts', + ` + import { Component } from '@angular/core'; + import { Http } from '@angular/http'; + @Component({ + selector: 'app-root', + template: '

Live reload test

' + }) + export class AppComponent { + constructor(private http: Http) { + http.get('http://${publicHost + '/live-reload-count'}').subscribe(res => null); + } + }`)) .then(_ => silentExecAndWaitForOutputToMatch( 'ng', - ['e2e', '--watch', `--public-host=${apiUrl}`], + ['e2e', '--watch', '--host=0.0.0.0', '--port=4200', `--public-host=${publicHost}`, '--proxy', proxyConfigFile], protractorGoodRegEx )) .then(_ => wait(2000)) + .then(_ => appendToFile('src/main.ts', 'console.log(1);')) + .then(_ => waitForAnyProcessOutputToMatch(webpackGoodRegEx, 5000)) + .then(_ => wait(2000)) .then(_ => { - if (!liveReloadClientCalled) { - throw new Error(`Expected live-reload client to have been called but it was not.`); + if (liveReloadCount != 2) { + throw new Error( + `Expected API to have been called 2 times but it was called ${liveReloadCount} times.` + ); } }) .then(_ => killAllProcesses(), (err) => { killAllProcesses(); throw err; })