feat: allow pages dev to proxy websockets

[Skye-31]

From a bug report in the #wrangler channel in the Discord, I noticed that wrangler pages dev --proxy SOME_PORT was not correctly proxying websocket requests (such as with /_next/webpack-hmr). After speaking with @mrbbot about the best way to fix this, I made these changes to resolve the issue.

Note: Has been tested by original user, and does resolve their issue

[changeset-bot[bot]]

🦋 Changeset detected

Latest commit: f7a4c80a12e8372455d270505e5d3e5e7f607555

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
wrangler	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[github-actions[bot]]

A wrangler prerelease is available for testing. You can install this latest build in your project with:

npm install --save-dev https://prerelease-registry.developers.workers.dev/runs/2817502815/npm-package-wrangler-1616

You can reference the automatically updated head of this PR with:

npm install --save-dev https://prerelease-registry.developers.workers.dev/prs/1616/npm-package-wrangler-1616

Or you can use npx with this latest build directly:

npx https://prerelease-registry.developers.workers.dev/runs/2817502815/npm-package-wrangler-1616 dev path/to/script.js

[codecov[bot]]

Codecov Report

Merging #1616 (f7a4c80) into main (fa8cb73) will decrease coverage by 0.01%. The diff coverage is n/a.

@@            Coverage Diff             @@
##             main    #1616      +/-   ##
==========================================
- Coverage   82.02%   82.01%   -0.02%     
==========================================
  Files          89       89              
  Lines        5882     5884       +2     
  Branches     1509     1509              
==========================================
+ Hits         4825     4826       +1     
- Misses       1057     1058       +1     

Impacted Files	Coverage Δ
packages/wrangler/src/pages/projects.tsx	81.15% <0.00%> (-2.43%)	:arrow_down:
packages/wrangler/src/bundle.ts	69.36% <0.00%> (ø)
packages/wrangler/src/pages/dev.tsx	23.97% <0.00%> (ø)
packages/wrangler/src/pages/upload.tsx	84.76% <0.00%> (ø)
...ackages/wrangler/src/__tests__/helpers/mock-bin.ts	100.00% <0.00%> (+5.26%)	:arrow_up:

[Skye-31]

I had to add that in as miniflare was complaining about an Invalid Sec-Websocket-Key header when a browser is requesting new Websocket, it includes it's own key and accept header, which miniflare then attempts to pass through, which causes an error.

According to the documentation, when creating a websocket client in a worker, you should not provide these headers yourself, and instead let the runtime deal with it. So it makes sense that miniflare is complaining when these headers are mistakenly provided.

[dalbitresb12]

Hi there! Sorry to bother, is there anything else needed to merge this?

[JacobMGEvans]

Hi there! Sorry to bother, is there anything else needed to merge this?

This PR is too far out of sync with current Wrangler implementations, if a rebase fails, it would likely need to be revisited or reimplemented.

[Skye-31]

I would rebase it, but I don't even have write access to this branch anymore 😅

[dalbitresb12]

I applied this fix with the latest version of Wrangler (2.3.0) using Yarn patch as you can see in https://github.com/dalbitresb12/easyleasing-app/commit/1a837bbdc496637fe15a73a046eab8d0efc568a6. I had to modify it a little bit, but it didn't seem that hard.

Maybe it's easier to reapply it in a new branch and make a new PR? I can make that in a fork if needed and of course I would co-author @Skye-31.

[Skye-31]

Feel free to remake @dalbitresb12 - I'm rather busy atm 🙂

[dalbitresb12]

Just opened #2212, which has the changes from this PR but rebased with the latest changes from main.

[Skye-31]

Thanks!