webpack / webpack-dev-server

Serves a webpack app. Updates the browser on changes. Documentation https://webpack.js.org/configuration/dev-server/.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Error with 'ws' library after updating to v8.14.2 in webpack-dev-server

SimonVriesema opened this issue · comments

Bug report

Actual Behavior

I'm encountering a "Invalid WebSocket frame: RSV1 must be clear" error when running my Vue.js application with webpack-dev-server. This issue appeared after updating the 'ws' library to version 8.14.2. The error stacktrace indicates the problem is in the 'ws' library used by webpack-dev-server.

Expected Behavior

I expected webpack-dev-server to run my Vue.js application without any WebSocket-related errors after updating the 'ws' library. The WebSocket functionality should work as expected.

How Do We Reproduce?

I'm not providing a complete GitHub repository, but the issue is reproducible by updating the 'ws' library to version 8.14.2 and running a Vue.js application with webpack-dev-server.

Please paste the results of npx webpack-cli info here, and mention other relevant information

System:
OS: macOS 14.0
CPU: (8) arm64 Apple M1 Pro
Memory: 407.77 MB / 16.00 GB
Binaries:
Node: 20.6.1 - /opt/homebrew/bin/node
Yarn: 1.22.19 - /usr/local/bin/yarn
npm: 9.8.1 - /opt/homebrew/bin/npm
Browsers:
Safari: 17.0
Packages:
webpack-dev-server: ^4.15.1 => 4.15.1

Here is the error:

node:events:492
throw er; // Unhandled 'error' event
^

RangeError: Invalid WebSocket frame: RSV1 must be clear
at Receiver.getInfo (/Users/simon_vriesema/IdeaProjects/TaskEaseWebApp/node_modules/webpack-dev-server/node_modules/ws/lib/receiver.js:218:14)
at Receiver.startLoop (/Users/simon_vriesema/IdeaProjects/TaskEaseWebApp/node_modules/webpack-dev-server/node_modules/ws/lib/receiver.js:155:22)
at Receiver._write (/Users/simon_vriesema/IdeaProjects/TaskEaseWebApp/node_modules/webpack-dev-server/node_modules/ws/lib/receiver.js:93:10)
at writeOrBuffer (node:internal/streams/writable:399:12)
at _write (node:internal/streams/writable:340:10)
at Writable.write (node:internal/streams/writable:344:10)
at Socket.socketOnData (/Users/simon_vriesema/IdeaProjects/TaskEaseWebApp/node_modules/webpack-dev-server/node_modules/ws/lib/websocket.js:1286:35)
at Socket.emit (node:events:514:28)
at addChunk (node:internal/streams/readable:343:12)
at readableAddChunk (node:internal/streams/readable:316:9)
Emitted 'error' event on WebSocket instance at:
at Receiver.receiverOnError (/Users/simon_vriesema/IdeaProjects/TaskEaseWebApp/node_modules/webpack-dev-server/node_modules/ws/lib/websocket.js:1172:13)
at Receiver.emit (node:events:514: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_UNEXPECTED_RSV_1',
[Symbol(status-code)]: 1002
}

The critical information is that the 'ws' library is updated to version 8.14.2, and the error occurs when running the application with webpack-dev-server. The error message mentions "Invalid WebSocket frame: RSV1 must be clear," and it appears to be related to the 'ws' library used by webpack-dev-server.