RestoreAuthState no longer functioning correctly

[o0charlie0o]

When returning to the app from Auth0 the correct targetUrl from appState is applied to the address bar but the app doesn't actually route to it. Props at the home route have code and state and pathname from useLocation still shows /.

This appears to have started happening in the 0.22.0 release. Was working correctly in 0.21.0. Still doesn't work correctly in the current release. I created a new project for testing to make sure it wasn't anything in our existing codebase causing the problem.

You can see from the following screenshots I just came back from Auth0 and I'm seeing the home page rather than the after auth page as defined in the routes.

Then if I refresh the browser I get the correct page as expected.

[thedavidprice]

Thanks for reporting this @o0charlie0o Looks like something's disconnected with the page render triggering.

@dthyresson any initial thoughts on this one?

[dthyresson]

Hi @o0charlie0o I'll look into this issue.

To confirm,

Are you setting the targetUrl to targetUrl: searchParams.get('redirectTo') as seen in:

https://redwoodjs.com/docs/authentication#login-and-logout-options

<Button
      onClick={async () => {
        if (isAuthenticated) {
          await logOut({ returnTo: process.env.AUTH0_REDIRECT_URI })
        } else {
          const searchParams = new URLSearchParams(window.location.search)
          await logIn({
            appState: { targetUrl: searchParams.get('redirectTo') },
          })
        }
      }}
    >
      {isAuthenticated ? 'Log out' : 'Log in'}
    </Button>

Or directly like: targetUrl: 'afterAuth'?

Also, could you confirm the version of the auth0-spa-js you have installed.

I do see some new feature re redirects here but not certain ti appleid (but the timing with the releases is similar):

auth0/auth0-spa-js#678

Thanks much.

[o0charlie0o]

@dthyresson In this case I'm setting it directly to targetUrl: '/after-auth'. Using searchParams.get('redirectTo') doesn't fix the issue either. I've tested this on both 1.13.6 and 1.13.3 for auth0-spa-js. I was running through this last night and I'm not sure if this has anything to do with it but when window.history.replaceState is called in restoreAuthState I'm not seeing the listener called from window?.addEventListener('popstate', listener) located in history.tsx. Seems like in location.tsx in the router package we'd expect the following code to run:

this.HISTORY_LISTENER_ID = gHistory.listen(() => {
  this.setState(() => ({ context: this.getContext() }))
})

Doing a little research popstate isn't triggered on history.replaceState though so I couldn't see how this ever worked before and stopped digging at that point.

[dthyresson]

Did a little digging and compared location.js/tsx 26 vs 21:

redwood/packages/router/src/location.js

Line 16 in 53349fd

getContext() {

/// v0.26
 getContext() {
    const windowLocation =
      typeof window !== 'undefined'
        ? window.location
        : { pathname: '', search: '', hash: '' }
    const { pathname, search, hash } = this.props.location || windowLocation

    return { pathname, search, hash }
  }

and

redwood/packages/router/src/location.js

Line 16 in 53349fd

getContext() {

// v 0.21
  getContext() {
    const { pathname, search, hash } = this.props.location
    return { pathname, search, hash }
  }

@dac09 or @Tobbe is anything related to window here worth investigating?

[Tobbe]

Looks alright to me.

If it's working in 0.21 and broken in 0.22 we should bisect that and see what changed.

When/where are we executing the stuff in history.tsx? Is the export in internal.ts enough to trigger the code there?

[peterp]

@dac09 @thedavidprice I think we should confirm if this is a bug and fix it for the next release.

[o0charlie0o]

@peterp @thedavidprice @dac09 One thing that is clearly different between 0.21 and 0.22 is when I come back from logging in in Auth0 I don't see the "/" route at all in 0.21 but in 0.22 and up I see the "/" route for a moment before my workaround redirect logic kicks in. I think this may have something to do with auth not being immediately present on load.

I ran some logs between the 2 branches and isAuthenticated returns true immediately in 0.21 where as it returns false for half a second or so before turning true in 0.22.

One thing I will mention is at first I was thinking it would be an issue with private routes but in my recreation after-auth isn't a private route.

Perhaps some changes in AuthProvider introduced this?

v0.21.0...v0.22.0

[dac09]

Thanks so much for the detailed report here @o0charlie0o, there’s definitely some clues here that suggest to me it’s potentially to do with page loader.

Any chance you could share a link to the repo to make it easier for me to reproduce?

I’m going to add this to my list to investigate in-depth for next release, I’ve had my hands full with 0.27. I will ping back here with updates.

[o0charlie0o]

@dac09 @dthyresson @thedavidprice @Tobbe @peterp FWIW I put in the following PR which fixes the issue for me. It's in a draft state now because I haven't tested it beyond my use case. I noticed in 0.21 there was some code in the original provider which checked for the auth loading but it wasn't in the new provider so I popped it in and everything started working again.

#1945