Vite crash because of RangeError: Invalid Websocket Frame 1006 WS_ERR_INVALID_CLOSE_CODE

[samelie]

Describe the bug

If the ws dependency module emits an error while HMR is running, it goes unhandled and causes Vite's node process to crash.

node:events:491
throw er; // Unhandled 'error' event

This particular ws throws after the computer goes to sleep and wakes up.

Afaik, this is not reproducible via vite.new

Reproduction

https://stackblitz.com/edit/vitejs-vite-3cq32j?file=index.html&terminal=dev

Steps to reproduce

1. Start Vite with HMR
2. Visit your localhost app (Chrome was used)
3. Put computer to sleep, wait a few seconds
4. Observe this on your page

And in terminal:

I have a fix for this and will make a PR

In summary,
We need to put an error handler on socket here

You can see the creator of ws approving how the handler was done here

By catching the error on socket, Vite does not crash.

System Info

System:
    OS: macOS 12.6.2
    CPU: (10) arm64 Apple M1 Max
    Memory: 135.20 MB / 64.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 19.0.0 - ~/.nvm/versions/node/v19.0.0/bin/node
    Yarn: 3.3.1 - ~/.nvm/versions/node/v19.0.0/bin/yarn
    npm: 8.19.2 - ~/.nvm/versions/node/v19.0.0/bin/npm
  Browsers:
    Chrome: 109.0.5414.119
    Firefox: 109.0.1
    Safari: 16.3

Used Package Manager

yarn

Logs

Click to expand! This is the crash

RangeError: Invalid WebSocket frame: invalid status code 1006
at Receiver.controlMessage (file:///Users/XXX/node_modules/vite/dist/node/chunks/dep-3007b26d.js:55108:18)
at Receiver.getData (file:///Users/XXX/node_modules/vite/dist/node/chunks/dep-3007b26d.js:54984:42)
at Receiver.startLoop (file:///Users/XXX/node_modules/vite/dist/node/chunks/dep-3007b26d.js:54700:22)
at Receiver._write (file:///Users/XXX/node_modules/vite/dist/node/chunks/dep-3007b26d.js:54626:10)
 at writeOrBuffer (node:internal/streams/writable:392:12)
 at _write (node:internal/streams/writable:333:10)
 at Writable.write (node:internal/streams/writable:337:10)
at TLSSocket.socketOnData (file:///Users/XXX/node_modules/vite/dist/node/chunks/dep-3007b26d.js:57408:37)
 at TLSSocket.emit (node:events:513:28)
 at addChunk (node:internal/streams/readable:324:12)
 at readableAddChunk (node:internal/streams/readable:297:9)
 at Readable.push (node:internal/streams/readable:234:10)
 at TLSWrap.onStreamRead (node:internal/stream_base_commons:190:23)
Emitted 'error' event on WebSocket instance at:
at Receiver.receiverOnError (file:///Users/XXX/node_modules/vite/dist/node/chunks/dep-3007b26d.js:57294:13)
 at Receiver.emit (node:events:513:28)
 at emitErrorNT (node:internal/streams/destroy:151:8)
 at emitErrorCloseNT (node:internal/streams/destroy:116:3)
 at process.processTicksAndRejections (node:internal/process/task_queues:82:21) {
code: 'WS_ERR_INVALID_CLOSE_CODE',
[Symbol(status-code)]: 1002
}

Node.js v19.0.0

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[github-actions]

Hello @samelie. We like your proposal/feedback and would appreciate a contribution via a Pull Request by you or another community member. We thank you in advance for your contribution and are looking forward to reviewing it!

[fc]

@bluwy he already created the PR

[samelie]

#12007

[bluwy]

Ah thanks, I didn't catch the link somehow 😅

[samelie]

It's on me Bjorn - I wrote this issue and didn't update it. Just linked to the issue from the PR Thanks for taking a look

…

On Tue, Feb 14, 2023 at 1:46 AM Bjorn Lu ***@***.***> wrote: Ah thanks, I didn't catch the link somehow 😅 — Reply to this email directly, view it on GitHub <#11991 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AAHGA4BJOQNT5ILO6A4VC4LWXNH6BANCNFSM6AAAAAAUV3J3JE> . You are receiving this because you were mentioned.Message ID: ***@***.***>