Phoenix_live_view: Websocket reconnection super-slow on Chrome

[ccapndave]

Environment

• Elixir version (elixir -v): 1.9.1
• Phoenix version (mix deps): 1.4.10
• NodeJS version (node -v): 10.13.0
• NPM version (npm -v): 6.5.0

• Operating system: MacOS 10.14.6

• Chrome version: 77.0.3865.120

Actual behavior

1. In Chrome, open a page containing a LiveView.
2. Close the Phoenix server. The client starts trying to connect to the websocket in a loop.
3. Re-open the Phoenix server. The socket connects.
4. Refresh the browser

From this point on, each refresh of the page takes between 2 and 5 seconds to reconnect the websocket. Opening a new tab fixes the issue.

Expected behavior

The websocket should connect instantly.

Notes

I understand that its very possible that this is a bug in Chrome, but as its incredibly noticeable and will affect all Chrome users (i.e. a very significant proportion of total users) I thought it was worth raising as an issue here.

[i-n-g-m-a-r]

"Opening a new tab fixes the issue." Thank you, I was pulling my hair out.

[sionide21]

Are you seeing errors in the Chrome console that say the websocket connection failed with "Unknown reason"?

This sounds similar to a Chrome 77 bug that was just recently resolved: https://bugs.chromium.org/p/chromium/issues/detail?id=1006243

[josevalim]

It does sound like a Chrome bug but since others may run into it, let's leave it "Open for Guidance".

[supernintendo]

FWIW, I noticed this happening quite frequently when working on a LiveView project in Firefox 69 on Linux. My cursory observation was that it only seemed to happen for the first LiveView session after starting the server (which fits the "opening a new tab" fix described above).

I'll try to reproduce and get some more detailed notes together.