redirects after the client has loaded are not being resolved

SeanCassiere commented 3 weeks ago

Describe the bug

Redirects that are thrown after the client has been loader are not being resolved to their leaf node/route.

So, when you throw a redirect in the beforeLoad or loader callback functions (after the client has loaded), its redirect isn't being followed through to the destination.

There are differing behaviours shown based on where the redirect is thrown from.

When the redirect is thrown in the beforeLoad callback, it stops at showing the defaultPendingComponent:

When the redirect is thrown in the loader callback, the following console warning is logged out.

This console warning has been attached to this issue.

Your Example Website or App

https://stackblitz.com/edit/github-kul4mf?file=src%2Froutes%2Findex.tsx

Steps to Reproduce the Bug or Issue

Open the stackblitz example.
Click on the open in a new tab option so the preview window isn't nested next to the Stackblitz code editor.
Read the scenarios listed in the example when loaded.
Try the 3 scenarios and observe the redirected page never being shown.
Try those same 3 scenarios, but when the page doesn't resolve and just hangs, reload the page and watch the redirect resolve correctly.

Expected behavior

As a user, I expect a redirect call that is thrown in either the beforeLoad or loader callbacks, to resolve to the final leaf node/route. This should work, regardless of whether it is a "first-load" or if the user navigating to the page from a previous page within the app.

Screenshots or Videos

full console warning message: qgniqpqvxgithub-qegz--3001--41fbae16.local-credentialless.txt

Platform

OS: macOS
Browser: Arc/Chrome
@tanstack/react-router: 1.31.1

Additional context

No response

hugocostadev commented 3 weeks ago

The same happens to me when I'm trying to check authenticated user :(

export const Route = createFileRoute("/")({
  beforeLoad: ({ context }) => {
    console.log("/index > beforeLoad > context", context);
    if (!context.auth.isAuthenticated) {
      throw redirect({ to: "/login" });
    } else { 
      throw redirect({ to: "/home" });
    }
  },
});

The redirect() does nothing