microsoftgraph / msgraph-sample-reactspa

This sample demonstrates how to use the Microsoft Graph JavaScript SDK to access data in Office 365 from React browser apps.
MIT License
125 stars 105 forks source link

BrowserAuthError, when I click the sign in button in the sample. #227

Closed abiola-ajibola closed 8 months ago

abiola-ajibola commented 8 months ago

Describe the bug BrowserAuthError: interaction_in_progress: Interaction is currently in progress. Please ensure that this interaction has been completed before calling an interactive API.

To Reproduce Steps to reproduce the behavior:

  1. Install dependencies and start the app.
  2. Click on 'Click here to sign in' button.
  3. See error on console and screen:

Expected behavior Redirect to Microsoft sign in page.

Screenshots image

Desktop (please complete the following information):

Dependency versions

jasonjoh commented 8 months ago

Hi @abiola-ajibola, sorry you're seeing this problem. I've tried to reproduce it and I can't. When you click the button, do you get a pop up like below at all, or is it just straight to the error?

Screenshot 2024-02-02 091100

Doing some quick searches, I found https://stackoverflow.com/questions/66405214/browserautherror-interaction-in-progress-interaction-is-currently-in-progress (which references https://github.com/AzureAD/microsoft-authentication-library-for-js/issues/5807). It looks like the MSAL library sets some stuff in session or browser storage that may be causing this error if it wasn't properly cleaned up. Oddly enough this all seems to be part of the redirect sign in flow, and this app uses the pop-up flow, so not sure why this would be happening here.

Some things you could try:

image

abiola-ajibola commented 8 months ago

Thank you @jasonjoh for the assistance!

I tried in incognito mode and it worked, so I cleared cookies in normal browsing mode and the issue is resolved.

jasonjoh commented 8 months ago

Great! Thanks for confirming.