syncweek-react-aad/react-aad

Error when session expire automatically

rodrigowpl opened this issue · 2 comments

Library versions

  • react-aad-msal: 2.3.4
  • msal: 1.2.1

Describe the bug

After some time ( a week or so ) the page returns an empty page with just the background displayed and looking in the developer console shows that my access token is now invalid
image

The session expired seems to be the issue right? If so is there a way to reproduce setting a custom session period?

Expected behavior
It should go back to the login page when the session expires, and I would like a way to set up a custom time to be able to reproduce

To Reproduce
Steps to reproduce the behavior:

  1. Login
  2. Wait for some time session expire

Desktop (please complete the following information):

  • OS: macOS 10.15.4
  • Browser: Chrome
  • Version: 81.0

Do you have any new information about this issue ? I'm experiencing the same issue

When the session expires the AzureAD component doesn't render the children function as it should supposed to do according the documentation: https://github.com/syncweek-react-aad/react-aad#azuread-component

  1. If the children is a function, then it will always be executed with the following argument:

I also tested with the samples provided: https://github.com/syncweek-react-aad/react-aad/tree/master/samples

render() {
    return (
      <AzureAD provider={authProvider} reduxStore={basicReduxStore}>
        {({ login, logout, authenticationState }) => {
          const isInProgress = authenticationState === AuthenticationState.InProgress;
          const isAuthenticated = authenticationState === AuthenticationState.Authenticated;
          const isUnauthenticated = authenticationState === AuthenticationState.Unauthenticated;

          if (isAuthenticated) {
            return (
              <React.Fragment>
                <p>You're logged in!</p>
                <button onClick={logout} className="Button">
                  Logout
                </button>
                <GetAccessTokenButton provider={authProvider} />
                <GetIdTokenButton provider={authProvider} />
              </React.Fragment>
            );
          } else if (isUnauthenticated || isInProgress) {
            return (
              <button className="Button" onClick={login} disabled={isInProgress}>
                Login
              </button>
            );
          }
        }}
      </AzureAD>
    );
  }

There's the component tree, the authenticationState is undefined:
Screenshot 2020-06-24 at 15 53 17