Authentication Login popup blocked by browser

[chrisbekas]

Describe the bug I'm using the javascript-basic-consumer sample project. When first using the file picker, the first popup window is displayed, however the second authentication popup is blocked by the browser.

[patrick-rodgers]

Hi @chrisbekas - the sample works for default browser configurations, can you ensure you don't have any enhanced pop-up blocking present? This isn't as much an issue with the picker as with the MSAL library - we've used a generic auth pattern in the sample, it might be that you need to use a different approach for your environment.

[chrisbekas]

Thanks @patrick-rodgers No enhanced pop-up blocking, just standard browser configuration (checked with Chrome, Firefox and Edge) and running on localhost:3000.

Indeed the console message Uncaught (in promise) BrowserAuthError: popup_window_error: Error opening popup window. This can happen if you are using IE or if popups are blocked in the browser. Details: BrowserAuthError: empty_window_error: window.open returned null or undefined window object. refers to the MSAL library but what is the recommended approach when most users will not notice or grant access to popups?

[patrick-rodgers]

You can use the redirect flow that will redirect the user. This article outlines the available options depending on the type of thing you are building. You might consider authenticating them prior to showing the pop-up for the picker so you are ready to provide tokens.

You haven't shared what type of thing you are building so hard to give any specific guidance.

[chrisbekas]

Great, thanks for the info @patrick-rodgers. We can authenticate users prior to showing the picker so I guess that overcomes the popup issue.