remix icon indicating copy to clipboard operation
remix copied to clipboard

Cloudflare's Rocket Loader make hydration fail in firefox

Open atouchsh opened this issue 3 years ago • 7 comments

What version of Remix are you using?

1.6.0

Steps to Reproduce

Visit the following link in firefox https://signup.seminaire.com/join/happy-event-1

Expected Behavior

tried in chrome, edge, safari, opera it works fine but firefox not

Actual Behavior

it shows the following error

image

atouchsh avatar Jun 28 '22 10:06 atouchsh

Hi @atouchsimo, is there any way you can provide a public repository reproducing this issue?

Hard to say what's going on exactly here except that useRemixEntryContext() returned an undefined routeModules object.

machour avatar Jun 28 '22 12:06 machour

You seem to be using Cloudflare, I wonder if turning off the 'Rocket Loader' under speed optimizations would solve your issue (see https://github.com/remix-run/remix/issues/1618#issuecomment-1113887894)

machour avatar Jun 28 '22 13:06 machour

@machour it's working now after disabling rocket loader

atouchsh avatar Jun 28 '22 13:06 atouchsh

Excellent. Took the liberty to rename your issue to see if we can fix this somehow on our end.

It seems that we should be adding data-cfasync="false" on our scripts tags to avoid this issue:

https://support.cloudflare.com/hc/en-us/articles/200168056-Understanding-Rocket-Loader

machour avatar Jun 28 '22 13:06 machour

We are facing the same issue. Rocket loader indeed interferes with the order of the scripts being loaded and it causes the issue. However adding data-cfasync="false" to the <Scripts> tags only seems to affect SSR render. After hydration the tags are gone. Not sure if it's rocket loader doing so or remix?. In any case it doesn't solve the issue.

sciutand avatar Aug 09 '22 21:08 sciutand

What version of Remix are you using?

1.6.0

Steps to Reproduce

Visit the following link in firefox https://signup.seminaire.com/join/happy-event-1

Expected Behavior

tried in chrome, edge, safari, opera it works fine but firefox not

Actual Behavior

it shows the following error

image

Adding data-cfasync=false to the <Scripts /> element should fix that one issue (as mentioned on https://support.cloudflare.com/hc/en-us/articles/200168056-Understanding-Rocket-Loader), but, there is something else conflicting. I'm still looking into the issue, trying to figure out a way to reliably have rocket loader on with our remix pages.

marwan38 avatar Aug 15 '22 21:08 marwan38

i just spent weeks trying to figure this error out 😞. i would love to see this explanation appear somewhere in the server gotchas page on the website

martinmckenna avatar Jan 15 '23 19:01 martinmckenna