"We can't find the internet" flashes on Page transitions and reloads on Firefox 106.0.5 on Phoenix 1.7-rx.0 #5102
Comments
|
The error flash also appears briefly when you successfully submit the form on the Also using Firefox. |
|
I can also reproduce this behaviour.
FixChange line 407 in socket.js within This is my first time looking into Phoenix internals, and I am not sure about other cases where the same event is triggered (e.g. server failure, see explanation below) and the original behaviour is desired, or how this affect the other transports. Feel free to start a PR :) ExplanationWhen the user navigates away from the page, Firefox fires a
I stumbled upon Edit: To separate server failure from browser navigation, a reason could be provided, but that probably needs coordination between server and client. How did I get there?The flash is shown on |
|
@KungPaoChicken that was a very nice explanation. By the way, you can set the inspector's console to "persist logs" so it is not cleared when the page changes. On Firefox it's on the "Console Settings" gear icon on the top-right of the Console tab. (if you were talking about the browser inspector, that is) |
|
I also just came across this in Edge and also was able to reproduce in Chrome Version 107.0.5304.110 (Official Build) (arm64) |
|
I couldn't reproduce it visually or by logging on Blink-based browsers on x64, could it be OS/architecture-related? The WebSocket close event is logged by Phoenix as Environment
Setup
Google Chrome Version 107.0.5304.122 (Official Build) (64-bit)Microsoft Edge Version 107.0.1418.56 (Official build) (64-bit)Mozilla Firefox 107.0 (64-bit)Mozilla Firefox Developer Version 108.0b7 (64-bit) |
|
I got a few minutes on a Mac mini and this happens in Firefox but not Chrome :(
|
|
I could also reproduce this on Chrome:
The error flash is visually most evident in the Register action. |
|
Same here on Chrome. |
|
Fixed in LV 0.18.4 |
|
I still seem to be experiencing this in 0.18.11 |
|
Update: I had not configured the url host and check_origin parameters for production. After updating those is solved I am in 0.18.16 and still see this. I can reproduce in all browsers (firefox, chrome) see live here. |
|
On Firefox Reproduces 100% of the time with a page refresh. |
|
Just a heads up, I'm still seeing this with Firefox 111, Phoenix 1.7.2, LiveView 0.18.18 on Linux. Cannot reproduce with Chrome. Reproduces every time whenever navigating away from a live view page, either refreshing, navigating to a dead view, or even navigating to another live view. |
|
Shouldn't we see this on a refresh as we are disconnecting the websocket. |
|
I'm also seeing this with phoenix 0.17.2 and 0.18.18. |
|
Isn't the logic that the flash_group component is in the static HTML served
up (it then shows) then when LiveView loads up there is nothing in the
flash so it removes?
|
Not exactly. For one this is the special-case "disconnected" flash, not a normal info or error flash. Also, it's set to be hidden by default, and only shows via JS commands if the phx-disconnected event is triggered. So it doesn't show on initial HTML load, nor when the live view mounts. It only shows during the teardown process when the browser is about to navigate away from the page. So it closes the socket, triggering the phx-disconnected event, which then triggers the |
|
Thanks for the clarification. Extremely helpful. So why is Firefox
triggering this and what can we raise upstream?
|
|
As written by kostspielig, This problem is resolved for both google Chrom, Firefox by writing environment variable of host. in
|
Nah, this doesn't work for me. I see this on my live domain on fly.io: runtime.exs and my My home page on https://sentrypeer.com is a liveview and if click refresh on FF, I see it. Thanks. |
|
I agree that kostspielig's solution is a red herring. I still see this in dev or production with and without PHX_HOST set. And I think it has nothing to do with it. This is most likely all in the way that the Phoenix JS tears down the websocket, and is probably completely client side. |
|
Can you try environment variables below, too? @ghenry |
|
I'm not sure that's the right use?
https://github.com/phoenixframework/phoenix/blob/a310102eb0e20b918624bb2323a6afb124fcaddd/installer/templates/phx_single/config/runtime.exs#L19
…On Sat, 6 May 2023, 16:39 Huijo, ***@***.***> wrote:
Can you try environment variables below, too? @ghenry
<https://github.com/ghenry>
PHX_HOST=your.domain.address
PHX_SERVER=your.domain.address
—
Reply to this email directly, view it on GitHub
<#5102 (comment)>,
or unsubscribe
<https://github.com/notifications/unsubscribe-auth/AABG66EOWH4WS6JBXNVNLM3XEZWEHANCNFSM6AAAAAAR6I7JOI>
.
You are receiving this because you were mentioned.Message ID:
***@***.***>
|
|
I'm also getting this in Firefox with the following packages: Repo and branch in question: https://github.com/vince-roy/LiveScheduling/tree/subscribe |
|
Would like to add I'm also seeing this just on Firefox. I am able to reproduce this using the original post's instructions just by refreshing liveview pages. FWIW, it looks like this was fixed at some point, but was removed with phoenixframework/phoenix_live_view@953a862 |
|
I'm having the same issue in my app during page refresh and live navigation between liveviews in the same live session |
|
I was able to fix this on my end, the issue only happened to me when i set the container of the flash to be a flexbox parent (had to do this because i was styling it with CSS), this made it show up on every page transition, not sure why?... anyways to anyone looking for an answer check if you're overriding the display value of the flash message to a value like flex. |
|
Still happening on Firefox in dev. phoenix 1.7.6 |
|
chrome and prod deploy reproduce example |
|
I have the same issue. When I create release and deploy it to production, On Register/Login pages I get the flash message "we can't find the internet". And neither I can login or register. |
|
@caanmert are you getting this issue on LiveViews in prod, but not on non-LiveView pages and not in development? Sounds like the same issue I had recently when deploying my app to prod for the first time. In my case it was because the LiveView socket couldn't connect the because the app's domain wasn't configured correctly. I thiiiiink the thing that fixed it was configuring the config :spoonme, MyAppWeb.Endpoint,
cache_static_manifest: "priv/static/cache_manifest.json",
…
# Add this line:
url: [host: System.fetch_env!("DOMAIN"), port: 80],
…Then set the I might be remembering wrong but I think that's what solved it; hopefully it will point you in the right direction at least? |
|
@TheArrowsmith Thank you, That fixed it and also I had to add this lines into my Nginx configuration file.
|
|
I'm still experiencing this on page transitions and reloads
|
|
Here's my workaround for now: Add a phx-disconnected={JS.show(to: "#client-error", time: 1300, transition: {"delay-1000 ...", ...})}In terms of actually fixing it: |
and others
An error flash with the message "We can't find the internet" flashes for sub-second on page transitions and reloads in a new Phoenix project.
I can only reproduce this on Firefox.
To reproduce:
mix phx.new test_projectmix phx.gen.auth Accounts User users)http://localhost:4000/users/log_inRegisterorLoginor reload the page (only happens when navigating from a LiveView, e.g. not when navigating from/to/users/log_in)Environment
Expected behavior
No error flash is shown.
Actual behavior
An error flash with the message "We can't find the internet" is shown.
The text was updated successfully, but these errors were encountered: