[WDS] Disconnected! with HTTPS and nonstandard port

[dceddia]

I'm submitting a bug report

webpack and webpack-dev-server version:
webpack: 1.13.2
webpack-dev-server: 1.15.1

Please tell us about your environment:
OSX 10.10.5, embedded in create-react-app 0.4.1. This is related to the issue here: facebook/create-react-app#574

Current behavior:
When the dev server is started with https: true, the websocket attempts to connect to the a URL that doesn't include the port, e.g. https://localhost/sockjs-node/... instead of https://localhost:3000/sockjs-node/....

Expected/desired behavior:
It should connect to a URL that includes a port, if the port is present. The previous version (1.14.1) worked correctly.

• If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem along with a gist/jsbin of your webpack configuration. Be sure to specify how you are running the server.

1. npm install -g create-react-app
2. create-react-app test-app && cd test-app
3. HTTPS=true npm start
4. Check the console, notice that WDS is failing to connect.

To fix it:

• From inside test-app, open node_modules/react-scripts/node_modules/webpack-dev-server/client/index.js

• Change line 62 from this:

  protocol: (window.location.protocol === "https:" || urlParts.hostname === '0.0.0.0') ? window.location.protocol : urlParts.protocol,

To this:

protocol: urlParts.protocol,

I couldn't see any good way from the WebpackDevServer config to influence how this protocol is handled. It does seem like the port attribute is being set correctly, so maybe there's a bug in url or SockJS that's causing the port to be ignored?

• What is the expected behavior?
  WDS should connect to the server.
• What is the motivation / use case for changing the behavior?
  To enable HTTPS mode with the webpack-dev-server.

[SpaceK33z]

I tested this by doing cd example && node ../bin/webpack-dev-server.js --open --https --inline, but that appears to work. I'll now check it with create-react-app.

[SpaceK33z]

Ah, I think I found the bug. When using https mode, the protocol in url.format is set to https:. However, the script has no hostname. As a result, the URL becomes https:/sockjs-node.

So what we need to do, is check if the hostname is not empty, and only then try to set the protocol.

[SpaceK33z]

PR #594 was just merged. This should fix the bug. I'm not sure yet if this will be backported to 1.x.

[SpaceK33z]

Ah, that PR only partially fixes this bug. The url now is https://localhost/sockjs-node (still missing the port).

[SpaceK33z]

Fixed in 2.1.0-beta.4

[provstevi]

Any chance this will get merged into 1.15 as well or will we have to wait for 2? We're currently unable to upgrade from 1.14.1 because of this

[SpaceK33z]

@provstevi, I think we'll wait for v2. It would be a PITA to backport this to v1, because there were a lot more changes in handling this path. This could also break backwards compatibility.

[SpaceK33z]

Okay I changed my mind about this. It will be some time before v2 will get stable, and this seems to be a blocking issue for some people. A PR is welcome to backport it.

[provstevi]

Should the PR be done on the webpack-1 branch?

[SpaceK33z]

@provstevi, yes.

[provstevi]

Just submitted PR #604 on webpack-1 branch.