[webpack-dev-server] [HPM] WebSocket error: Error [ERR_STREAM_WRITE_AFTER_END]: write after end #23155

johnmanko · 2022-05-17T15:08:14Z

🐞 Bug report

Command (mark with an `x`)

Is this a regression?

Yes, the previous version in which this bug was not present was: 12.*

Description

Cannot run application in Chrome without getting webpack dev server errors. Makes it difficult to develop when needing to inspect.

🔬 Minimal Reproduction

Upgrade from 12.* to 13.*.

🔥 Exception or Error


 [webpack-dev-server] [HPM] WebSocket error: Error [ERR_STREAM_WRITE_AFTER_END]: write after end
     at new NodeError (node:internal/errors:371:5)
     at _write (node:internal/streams/writable:320:11)
     at Socket.Writable.write (node:internal/streams/writable:335:10)
     at Sender.sendFrame (/path/to/project/node_modules/ws/lib/sender.js:413:20)
     at Sender.doClose (/path/to/project/node_modules/ws/lib/sender.js:153:10)
     at Sender.close (/path/to/project/node_modules/ws/lib/sender.js:140:12)
     at WebSocket.close (/path/to/project/node_modules/ws/lib/websocket.js:289:18)
     at Receiver.receiverOnConclude (/path/to/project/node_modules/ws/lib/websocket.js:969:18)
     at Receiver.emit (node:events:390:28)
     at Receiver.controlMessage (/path/to/project/node_modules/ws/lib/receiver.js:576:14) {
   code: 'ERR_STREAM_WRITE_AFTER_END'
 }

🌍 Your Environment


Node.js version v17.3.1 detected.
Odd numbered Node.js versions will not enter LTS status and should not be used for production. For more information, please see https://nodejs.org/en/about/releases/.

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/
    

Angular CLI: 13.3.5
Node: 17.3.1 (Unsupported)
Package Manager: npm 8.10.0
OS: linux x64

Angular: 13.3.8
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1303.5
@angular-devkit/build-angular   13.3.5
@angular-devkit/core            13.3.5
@angular-devkit/schematics      13.3.5
@angular/cdk                    13.3.7
@angular/cli                    13.3.5
@schematics/angular             13.3.5
rxjs                            7.5.5
typescript                      4.6.4
    
Warning: The current version of Node (17.3.1) is not supported by Angular.

Anything else relevant?

Chromium Version 101.0.4951.64 (Official Build) snap (64-bit)

The text was updated successfully, but these errors were encountered:

alan-agius4 · 2022-05-17T15:19:02Z

Can you please try to use a supported Node.Js version? Either version 14 or 16.

johnmanko · 2022-05-17T15:44:55Z

@alan-agius4

Same problem.

> node --version
v16.15.0

> ng version

     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/
    

Angular CLI: 13.3.5
Node: 16.15.0
Package Manager: npm 8.5.5
OS: linux x64

Angular: 13.3.8
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1303.5
@angular-devkit/build-angular   13.3.5
@angular-devkit/core            13.3.5
@angular-devkit/schematics      13.3.5
@angular/cdk                    13.3.7
@angular/cli                    13.3.5
@schematics/angular             13.3.5
rxjs                            7.5.5
typescript                      4.6.4

[webpack-dev-server] [HPM] WebSocket error: Error [ERR_STREAM_WRITE_AFTER_END]: write after end
<e>     at new NodeError (node:internal/errors:372:5)
<e>     at _write (node:internal/streams/writable:319:11)
<e>     at Socket.Writable.write (node:internal/streams/writable:334:10)
<e>     at Sender.sendFrame (/path/to/project/node_modules/ws/lib/sender.js:413:20)
<e>     at Sender.doClose (/path/to/project/node_modules/ws/lib/sender.js:153:10)
<e>     at Sender.close (/path/to/project/node_modules/ws/lib/sender.js:140:12)
<e>     at WebSocket.close (/path/to/project/node_modules/ws/lib/websocket.js:289:18)
<e>     at Receiver.receiverOnConclude (/path/to/project/node_modules/ws/lib/websocket.js:969:18)
<e>     at Receiver.emit (node:events:527:28)
<e>     at Receiver.controlMessage (/path/to/project/node_modules/ws/lib/receiver.js:576:14) {
<e>   code: 'ERR_STREAM_WRITE_AFTER_END'

johnmanko · 2022-05-17T15:49:59Z

Full deps list:

  "dependencies": {
    "@angular/animations": "^13.3.8",
    "@angular/cdk": "^13.2.6",
    "@angular/common": "^13.3.8",
    "@angular/compiler": "^13.3.8",
    "@angular/core": "^13.3.8",
    "@angular/forms": "^13.3.8",
    "@angular/platform-browser": "^13.3.8",
    "@angular/platform-browser-dynamic": "^13.3.8",
    "@angular/router": "^13.3.8",
    "@fullcalendar/core": "^5.11.0",
    "@fullcalendar/daygrid": "^5.11.0",
    "@fullcalendar/google-calendar": "^5.11.0",
    "@fullcalendar/interaction": "^5.10.0",
    "@fullcalendar/list": "^5.11.0",
    "@fullcalendar/luxon": "^5.11.0",
    "@fullcalendar/moment": "^5.11.0",
    "@fullcalendar/moment-timezone": "^5.11.0",
    "@fullcalendar/rrule": "^5.11.0",
    "@fullcalendar/timegrid": "^5.11.0",
    "@types/moment-timezone": "^0.5.30",
    "big.js": "^6.1.1",
    "chart.js": "^3.7.1",
    "core-js": "^3.22.5",
    "jquery": "^3.6.0",
    "lodash.clonedeep": "^4.5.0",
    "lodash.merge": "^4.6.2",
    "luxon": "^1.12.1",
    "lz-string": "^1.4.4",
    "moment-jdateformatparser": "^1.2.1",
    "moment-timezone": "^0.5.34",
    "ngx-spinner": "^13.1.1",
    "normalize.css": "^8.0.1",
    "primeflex": "^3.2.0",
    "primeicons": "^5.0.0",
    "primeng": "^13.4.0",
    "quill": "^1.3.7",
    "rrule": "^2.6.9",
    "rxjs": "^7.4.0",
    "zone.js": "~0.11.5"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^13.3.5",
    "@angular-eslint/builder": "^13.1.0",
    "@angular-eslint/eslint-plugin": "^13.1.0",
    "@angular-eslint/eslint-plugin-template": "^13.1.0",
    "@angular-eslint/schematics": "^13.1.0",
    "@angular-eslint/template-parser": "^13.1.0",
    "@angular/cli": "^13.3.5",
    "@angular/compiler-cli": "^13.3.8",
    "@angular/language-service": "^13.3.4",
    "@icon/foundation-icons": "^3.0.0-alpha.3",
    "@types/big.js": "^6.1.2",
    "@types/jasmine": "^4.0.3",
    "@types/jquery": "^3.5.14",
    "@types/node": "^17.0.34",
    "@typescript-eslint/eslint-plugin": "^5.24.0",
    "@typescript-eslint/eslint-plugin-tslint": "^5.24.0",
    "@typescript-eslint/parser": "^5.24.0",
    "chalk": "^5.0.1",
    "copy-paste": "^1.3.0",
    "del": "^6.1.0",
    "eslint": "^8.15.0",
    "glob": "^7.2.0",
    "gulp": "^4.0.2",
    "gulp-sass": "^5.1.0",
    "gulp-shell": "^0.8.0",
    "jasmine-core": "^4.1.1",
    "jasmine-spec-reporter": "^7.0.0",
    "karma": "~6.3.20",
    "karma-chrome-launcher": "~3.1.1",
    "karma-cli": "^2.0.0",
    "karma-coverage-istanbul-reporter": "~3.0.2",
    "karma-jasmine": "~5.0.1",
    "karma-jasmine-html-reporter": "^1.7.0",
    "lodash.mergewith": "^4.6.2",
    "moment": "^2.29.3",
    "node-sass-tilde-importer": "^1.0.2",
    "path": "^0.12.7",
    "properties-reader": "^2.2.0",
    "protractor": "~7.0.0",
    "readline-sync": "^1.4.10",
    "request": "^2.88.2",
    "sass": "^1.51.0",
    "sass-flex-mixin": "^1.0.3",
    "ts-node": "^10.7.0",
    "tslib": "^2.4.0",
    "tslint": "^6.1.0",
    "typescript": "~4.6.4",
    "what-input": "^5.2.11",
    "xml2js": "^0.4.23"
  }

Not sure if this contributing to the issue, but our application uses websockets, too. Could that be interfering with dev server?

alan-agius4 · 2022-05-17T15:56:16Z

This seems to be related to chimurai/http-proxy-middleware#476 which should have been solved in version 2.0.6.

Can you please run npm ls http-proxy-middleware and provide the output here?

johnmanko · 2022-05-17T16:39:29Z

$ npm ls http-proxy-middleware
platform@0.0.0 /path/to/project
└─┬ @angular-devkit/build-angular@13.3.5
  └─┬ webpack-dev-server@4.7.3
    └── http-proxy-middleware@2.0.6

alan-agius4 · 2022-05-17T17:42:01Z

It appears that the issue hasn’t been fixed upstream.

I suggest you open a new issue in https://github.com/chimurai/http-proxy-middleware with a minimal reproduction on how to reproduce.

Closing as this isn’t actionable from our end.

johnmanko · 2022-05-17T18:09:49Z

@alan-agius4 Thanks for looking into it. I'll do that.

johnmanko · 2022-05-17T18:17:39Z

This could be related to chimurai/http-proxy-middleware#463

tchunwei · 2022-05-18T06:07:28Z

I have exactly same error message, but found out that Angular live reload ws path was changed from ws://localhost:4200/sockjs-node/xxx/xxxxxxxx/websocket to ws://localhost:4200/ws after upgrading from v12 to v13. I have my own ws connection which is already using /ws path and proxied in proxy.conf.json to another server. After changing my own /ws to something else, this error disappears.

Any chance we can configure Angular live reload ws path?

swn14 · 2022-05-19T12:46:33Z

I was experiencing a similar problem, for some reason only on macOS. I was able to resolve it by setting my Angular proxy setting to the following:

  {
    context: ["/api"],
    target: target,
    secure: false,
    changeOrigin: true,
    headers: { Connection: 'keep-alive' }
  }

Specifically the changeOrigin option and the keep-alive header did the trick.

johnmanko · 2022-05-24T15:04:40Z

@tchunwei Your solution solved this for me. Thank you.

@shut-empire-00 Thanks for your input.

angular-automatic-lock-bot · 2022-06-24T08:04:00Z

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}

alan-agius4 added the needs: more info Reporter must clarify the issue label May 17, 2022

alan-agius4 closed this as completed May 17, 2022

angular-automatic-lock-bot bot locked and limited conversation to collaborators Jun 24, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[webpack-dev-server] [HPM] WebSocket error: Error [ERR_STREAM_WRITE_AFTER_END]: write after end #23155

[webpack-dev-server] [HPM] WebSocket error: Error [ERR_STREAM_WRITE_AFTER_END]: write after end #23155

johnmanko commented May 17, 2022

alan-agius4 commented May 17, 2022

johnmanko commented May 17, 2022 •

edited

Loading

johnmanko commented May 17, 2022

alan-agius4 commented May 17, 2022 •

edited

Loading

johnmanko commented May 17, 2022

alan-agius4 commented May 17, 2022

johnmanko commented May 17, 2022

johnmanko commented May 17, 2022

tchunwei commented May 18, 2022

swn14 commented May 19, 2022

johnmanko commented May 24, 2022

angular-automatic-lock-bot bot commented Jun 24, 2022

[webpack-dev-server] [HPM] WebSocket error: Error [ERR_STREAM_WRITE_AFTER_END]: write after end #23155

[webpack-dev-server] [HPM] WebSocket error: Error [ERR_STREAM_WRITE_AFTER_END]: write after end #23155

Comments

johnmanko commented May 17, 2022

🐞 Bug report

Command (mark with an x)

Is this a regression?

Description

🔬 Minimal Reproduction

🔥 Exception or Error

🌍 Your Environment

alan-agius4 commented May 17, 2022

johnmanko commented May 17, 2022 • edited Loading

johnmanko commented May 17, 2022

alan-agius4 commented May 17, 2022 • edited Loading

johnmanko commented May 17, 2022

alan-agius4 commented May 17, 2022

johnmanko commented May 17, 2022

johnmanko commented May 17, 2022

tchunwei commented May 18, 2022

swn14 commented May 19, 2022

johnmanko commented May 24, 2022

angular-automatic-lock-bot bot commented Jun 24, 2022

Command (mark with an `x`)

johnmanko commented May 17, 2022 •

edited

Loading

alan-agius4 commented May 17, 2022 •

edited

Loading