New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Firefox page-refresh-on-save doesn't work #694
Comments
The refresh is working in the latest Firefox Developer Edition release for me. The error message is a purely cosmetic error. See https://bugzilla.mozilla.org/show_bug.cgi?id=1789252 |
Perhaps the error is a red herring? But here's a video of a clean project not working in Firefox (top browser), and working in Chrome (middle) and Safari (bottom) Screen.Recording.2022-09-06.at.7.41.46.AM.movIs there anything I can do to help diagnose this on my side? I made sure that all the FF extensions were disabled when I made the video, and I closed and restarted FF. Hmm... |
Can you check that you are on the latest version of Firefox Developer Edition? |
Yup! |
Putting this in my console new EventSource('/_frsh/alive').addEventListener('error', (err) => {
console.log(err)
}) Seems to fire the event handler, and prints out an error. I'm not sure if there's any useful info in here for me to look at though? bubbles: false
cancelBubble: false
cancelable: false
composed: false
currentTarget: null
defaultPrevented: false
eventPhase: 0
explicitOriginalTarget: EventSource { url: "http://localhost:8000/_frsh/alive", withCredentials: false, readyState: 2, … }
isTrusted: true
originalTarget: EventSource { url: "http://localhost:8000/_frsh/alive", withCredentials: false, readyState: 2, … }
returnValue: true
srcElement: EventSource { url: "http://localhost:8000/_frsh/alive", withCredentials: false, readyState: 2, … }
target: EventSource { url: "http://localhost:8000/_frsh/alive", withCredentials: false, readyState: 2, … }
timeStamp: 22361
type: "error" |
Following FF bug is likely to be blamed: https://bugzilla.mozilla.org/show_bug.cgi?id=1706003. Firefox is not properly reconnecting |
Firefox supports a non-standard forceGet boolean parameter for location.reload(), to tell Firefox to bypass its cache and force-reload the current document. However, in all other browsers, any parameter you specify in a location.reload() call will be ignored and have no effect of any kind. |
I've got kinda temporary fix for it, for me it works great at least.
new EventSource("/_frsh/alive").addEventListener("error", (_err) => {
setInterval(async () => {
const response = await fetch("/_frsh/alive")
if (response.status === 200) location.reload()
}, 100)
}) then add this script it to your import { Head, asset } from "$fresh/runtime.ts"
import { AppProps } from "$fresh/server.ts"
export default function App(props: AppProps) {
return (
<>
<Head>
<script src={asset('/reloader.js')} />
</Head>
<props.Component />
</>
)
} It's just detecting error caused by restart and then reload page when it's available again, so overall same experience and even reload pages on manual restart. One cons is flooded console with failed requests if restart takes longer. |
This issue can be closed. The bug has been fixed in Firefox 110, which is the current stable version. I verified this locally, and the results are as expected when looking at the bug report linked in #694 (comment). |
@heyarne |
Hello! In playing with Fresh, I've found that the websocket connection fails in Firefox (Developer Edition,
105.0b6 (64-bit)
) and that means that refresh-on-save doesn't work. Both Chrome and Safari work on the same machine.The console error says:
I tested this on a new install of Fresh, doing
deno run -A -r https://fresh.deno.dev my-project
n
for tailwind, andy
for VSCodedeno task start
The text was updated successfully, but these errors were encountered: