microsoft-authentication-library-for-js: MSAL returns Token Renewal operation failed in Chrome, how to resolve this?

I’m submitting an issue regarding the token acquiring after login. I am using ReactJS and MSAL 1.1.3 for Azure AD authentication. I frequently get the “Token Renewal Operation failed” error. I have cleared the cache, and still it appears.

Browser:

• Firefox
• IE 9 and 10
• Edge
• Opera

Library version

MSAL: 1.1.3
React: 16.8.6

Current behavior

I also tried using it in incognito, it sometimes let me login but most of the times it would return the error. The procedure is working perfectly fine in Chrome, and it does not work properly in IE, Edge, Firefox and Opera. Any help would be highly appreciated.

Expected behavior

As in chrome it works perfectly, it should work the same in other browsers as well, at least in updated browsers such as Edge, Firefox, Opera.

Minimal reproduction of the problem with instructions

const msalConfig = { auth: { clientId: my_client_id, authority: ‘https://login.microsoftonline.com/tenant_id’, scopes: [${websiteURL}/user_impersonation], redirectUri: ${websiteURL}/, postLogoutRedirectUri: ${websiteURL}/, loadFrameTimeout: 10000, }, cache: { cacheLocation: “sessionStorage”, }, navigateToLoginRequestURL: false, storeAuthStateInCookie: true, };

msalInstance = new Msal.UserAgentApplication(msalConfig);

const loginRequest = { scopes: [${websiteURL}/user_impersonation], authority: ‘https://login.microsoftonline.com/tenant_id’, };

msalInstance.loginPopup(loginRequest) .then(response => { msalInstance.acquireTokenSilent(loginRequest) .then(responseToken => { this.setState({ redirect: true }) }) .catch(err => { console.log(err); }) }) .catch(err => { console.log(err); })

I have added the loadFrameTimeout too, but it won’t work. Following is my configuration that I used to create msalInstace and the login procedure: