Unstyled flash after navigating away from errorComponent?
- Initially rendered errorComponent: Error which somehow ran fine.
- Shortly after implementing tsquery, my CSS stopped working in errorComponent.
- Saw that none of the head content was rendering in the error component anymore.
- Went through docs and realized I was apparently supposed to wrap a <RootDocument> around the errorComponent, so I put that up.
Though the styles are back while in errorComponent, now whenever I navigate out of it, like clicking a <Link to="/">, I get a flash of unstyled content on arrival. It's as if this <RootDocument> thing we're doing is unloading the <RootDocument> tied to errorComponent on exit, then loading the one around the regular Outlet shortly after loading the route we navigated to, which might be causing the flash? I noticed the entire <head> content shows rerender activity in devtools while this happens, which doesn't usually happen when going from one normal route to another.
- After this happens, if I backroute to the error component (browser back button) I get another flash of unstyled content.
- This whole thing also causes the favicon to switch to a favicon from some other app I was working on a few weeks ago, probably pulling from cache since it loses track of the current head data while this happens?
10 Replies
modern-tealOP•4mo ago
1. Start from errorComponent, click Link to="/" button, unloads head
2. Arrive to home, unstyled
3. New head loads, styled
modern-tealOP•4mo ago
broad-brown•4mo ago
can you please create a GitHub issue for this?
modern-tealOP•4mo ago
Sure
Interesting tidbit it doesn't happen in firefox but it happens on chrome, GX & edge, I'll add that context too
modern-tealOP•4mo ago
Here, filed it under "Start" since I've never run into this with a barebones Vite + TSRouter app
https://github.com/TanStack/router/issues/4124
GitHub
Unstyled flash after navigating away from errorComponent · Issue #...
Which project does this relate to? Start Describe the bug DISCLAIMER: Can't reproduce in Firefox, but happens to me on Chrome, Edge & GX, both on localhost and live deployment. Never had th...
broad-brown•4mo ago
thanks!
is this during dev/prod or both?
modern-tealOP•4mo ago
Both
broad-brown•4mo ago
ok
afraid-scarlet•3mo ago
@MGSimard Did you solved the issue?
modern-tealOP•3mo ago
Nope, testing in a brand new app with Devinxi right now and still getting it. Only happens in chromium browsers that I've tested still.