To reproduce what I believe to be incorrect behavior:
- Install the project dependencies with your preferred package manager, then boot the app with the
dev
script. - Navigate to
http://localhost:3000/login
and key in an email address (or faceroll the keyboard), then submit the form. - The
/login
form first sets asession
cookie with the entered email/text. Then, it performs a redirect in Remix first to the index route,/
. The index routeloader
, in turn, redirects to/content
. - During the navigation to
/content
, the root route'sloader
function fires and reads thesession
cookie (as aconsole.log
in that function reveals). Theloader
returns the value of the cookie to the root route component. As a result, I would expect that theuseLoaderData
invocation in the root route component would receive the value of the cookie, however the value of the hook remains an empty object even once/content
has loaded. - A page refresh of
/content
causes another invocation of the root routeloader
; this time, the root routeuseLoaderData
does receive the result of theloader
as I would expect.
This behavior of step (3) appears to expose a potential bug in Remix -- perhaps in some data fetching optimization logic. I would be inclined to believe I've misunderstood the heuristic(s) which govern when parent/layout routes are rendered were it not for the fact that the root route loader does run across the login redirect sequence.
I noticed that if there is only a single redirect performed... e.g.
- the
/login
form redirects directly to/content
; - OR the
login
form redirects to/
, but the/
index route'sloader
does not redirect but rather renders a component itself...
...then the root route component behaves as I would expect without a subsequent page refresh. Ergo, I'm led to believe that the multi-redirect
may be at fault.