feat(client): allow sock port to use browser location's port

[jkrehm]

Add the ability to set sockPort: 'location' to make the sock port dynamic.

This change would allow the port to be specified by an individual proxy, e.g. if different team members have their environments configured differently.

• This is a bugfix
• This is a feature
• This is a code refactor
• This is a test update
• This is a docs update
• This is a metadata update

For Bugs and Features; did you add new tests?

I added the scenario to an existing test.

Motivation / Use-Case

Related to #1664 which was semi-addressed by #1792 and then reverted by #1838.

This change provides a way for the sock port to use the browser location's port which may or may not be known at build time. For example,

• one team member hits webpack-dev-server directly at http://localhost:3000
• another uses a Docker container that proxies it via http://localhost.example.com
• a third uses Nginx to proxy through SSL with https://dev.example.com

For all three to be able to use it the way they want they would have to modify their local copy of webpack.config.js to set the sockPort to either 3000, 80, or 443 and then remember to never check in their change. Alternatively a "magic" value (in this case "location") would be set and the client JS would swap in the browser's port number and all three developers would happily use their current setup.

Breaking Changes

No breaking changes (additive only).

Additional Info

N/A

[jsf-clabot]

Thank you for your submission, we really appreciate it. Like many open source projects, we ask that you sign our Contributor License Agreement before we can accept your contribution.

---

Jonathan Rehm seems not to be a GitHub user. You need a GitHub account to be able to sign the CLA. If you have already a GitHub account, please add the email address used for this commit to your account.

[codecov]

Codecov Report

Merging #2341 into master will increase coverage by <.01%.
The diff coverage is 100%.

@@            Coverage Diff             @@
##           master    #2341      +/-   ##
==========================================
+ Coverage   93.94%   93.95%   +<.01%     
==========================================
  Files          34       34              
  Lines        1289     1291       +2     
  Branches      367      368       +1     
==========================================
+ Hits         1211     1213       +2     
  Misses         77       77              
  Partials        1        1

Impacted Files	Coverage Δ
client-src/default/utils/createSocketUrl.js	100% <100%> (ø)	⬆️

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update a599f99...0835a19. Read the comment docs.

[jkrehm]

I committed using my work email address and I did not have that attached to my Github account. I do now. I've signed the CLA. Is there a way to kick the bot and tell it to try again?

[rishabh3112]

@jkrehm closing and reopening the PR would help here.

[jkrehm]

Closing and re-opening fixed the CLA issue. I'm not sure what that latest Windows node-12 failure is about. I don't think it's related to my changes (all the rest succeeded and its complaint is that a port is already in use).

What would you like me to do? Are you all right with ignoring the failure as a false-negative?

[rishabh3112]

@jkrehm I don't think so we could ignore. Tagging @hiroppy for more info on this.

[jkrehm]

I closed the PR and re-opened again and now the Windows node-10 pipeline failed with the same "address already in use" error. Maybe the pipelines are running on the same agent? If so and if two of the tests run at the same time and both try to bind to the same port it would generate that error.

[rishabh3112]

I got the problem. I have tagged one of the code maintainer of the dev server. He will look into it soon.

[hiroppy]

CI was re-executed and CI became green. CI is sometimes flaky.

[alexander-akait]

Thanks for the PR

[jkrehm]

Thank you!

[saiqulhaq]

this feature should be written on documentation

[alexander-akait]

PR welcome to docs