Auth0-spa-js: Can't create auth0 client when refresh token is invalid (e.g. outdated)

[philipp-tailor]

Describe the problem

When using localStorage and refresh tokens, invalid (e.g. outdated) refresh tokens cause createAuth0Client to throw an error.

This leaves users of the library in an awkward state that is difficult to handle, requiring ugly workarounds, as users don't have a client instance to call logout and messing with the auth0 localStorage entry is discouraged. The current behaviour has been an issue for multiple users (#449, #499). Given the browser's tightening 3rd party cookie policies, it can be expected that more users will use the combination of localStorage and persisted refresh tokens for good UX.

The library whose purpose is to authenticate users who are not authenticated should not explode during initialisation when the user is not authenticated. Expired refresh tokens should be considered one specific case of the user not being authenticated (anymore) instead of being an error preventing the library to initialise.

What was the expected behavior?

• createAuth0Client successfully builds an auth0 client and cleans up invalid tokens from localStorage during the process, so that the user is logged out.
• isAuthenticated returns false, so that the application can call loginWithPopup or loginWithRedirect.
• getTokenSilently throws login_required error, so that the application can handle the error and call loginWithPopup or loginWithRedirect.

Reproduction

• Configure library with options { cacheLocation: 'localstorage', useRefreshTokens: true, ...otherOptions }
• Log in with any account.
• Wait until access token and refresh token are expired. To speed up testing, take the shortcut of editing the localStorage
auth0spajs entry: Set the expiresAt attribute to the current unix timestamp, and replace at least one character of refresh_token. This procedure of course is not a regular use-case which the library should have to deal with, but it yields the same error as can be observed from regular user behaviour and good for reproducing the issue quickly. The organic occurence of this happens when the user logs into an app, doesn't clear the localStorage until the absolute refresh token lifetime is reached, the last access token fetched by the refresh token expired, and the user then interacts with the application by reloading the tab or – more frequent in SPAs – opens the application in a new tab.
• Reload the page (or, more frequently in SPAs: open a new tab), so that createAuth0Client is called.

At that point it can be observed that createAuth0Client throws an error and does not clean up localStorage. Reloading keeps yielding the same non-recoverable error. Without auth0 client instance it's not possible to call logout, which would clean up localStorage. It is possible to create a client with new Auth0Client() and call logout on that, but at that point the consumer of the library has to know the errors which the library could throw, and wrap client initialisation in a couple of try-catches. That the library does not handle this is against user expectation and can be considered a bug or a feature request.

Environment

Using "@auth0/auth0-spa-js": "^1.12.0" in a vue application. Tested in Chrome 85-87. As mentioned above, the relevant environment elements are that the library is used with localStorage and refresh token. The API must have Allow Offline Access enabled so that the refresh token is stored in localStorage.

[frederikprijck]

Thanks for raising this. We are aware of this problem and are actively tracking it on our board.
I expect us to look into this pretty soon and will get back to you.

Leaving this issue open in the meantime.

[vinamelody]

Hi @frederikprijck since the PR was merged, does this mean getTokenSilently() isn't going to throw login_required and invalid_grant anymore?

I'm having a work in progress handling those errors manually in the UI and offer the user loginWithRedirect

[frederikprijck]

Hi,

login_required should still be thrown, as you can see here : https://github.com/auth0/auth0-spa-js/blob/master/src/Auth0Client.ts#L883

invalid_grant should now be caught, fallback to using iframe (https://github.com/auth0/auth0-spa-js/blob/master/src/Auth0Client.ts#L958) which will either succeed or throw the above login_required error.

[vinamelody]

@frederikprijck alright, thank you for the clarification 👍