Login popup flow does not work for full-screen browsers

[danielvoigt]

Core Library

MSAL.js v2 (@azure/msal-browser)

Core Library Version

2.28.1

Wrapper Library

MSAL Angular (@azure/msal-angular)

Wrapper Library Version

2.4.1

Public or Confidential Client?

Public

Description

The issue is fairly simple:

• When the browser is in full-screen mode, the flow starts but then the page does not close itself or redirect back to the original page. The user is also unable to successfully login.
• When the browser is not in full-screen mode, the flow starts, the user can sign-in and the popup closes and redirects back to the page with the user successfully signed in
• Tested with multiple browsers. Using B2C flow. I tested an app that was not B2C and this flow was working.

Error Message

No response

Msal Logs

No response

MSAL Configuration

{
    auth: {
      clientId: 'uuid-goes-here',
      authority:
        'https://company-name.b2clogin.com/company-name.onmicrosoft.com/B2C_1_SignInOnly',
      redirectUri: 'http://localhost:4200',
      knownAuthorities: ['company-name.b2clogin.com'],
      postLogoutRedirectUri: 'http://localhost:4200',
      navigateToLoginRequestUrl: true,
    },
  }

Relevant Code Snippets

this.msalService
      .loginPopup()
      .subscribe((response: AuthenticationResult) => {
        this.msalService.instance.setActiveAccount(response.account);
        if (this.msalService.instance.getActiveAccount() !== null) {
           // redirect to main page on successful sign-in. this should be done automatically be the library but this step is needed otherwise the redirect does not happen
           this.router.navigate(['/']);
        }
      }

      });

Reproduction Steps

1. create a b2c configuration
2. use the login popup flow
3. attempt to login successfully with a browser in full-screen mode

Expected Behavior

When in full-screen mode a browser is still able to use the login popup flow to successfully signin

Identity Provider

Azure B2C Custom Policy

Browsers Affected (Select all that apply)

Chrome, Safari, Other

Regression

No response

Source

External (Customer)

[jo-arroyo]

@danielvoigt For clarification, is your app causing the browser to be in full-screen mode, or is this in the case when the user chooses full-screen at the browser-level?

[danielvoigt]

@jo-arroyo The popup does not work in full-screen mode when the user chooses full-screen at the browser-level. The app does not cause the browser to be in full-screen mode - but we need to be able to use MSAL for full-screen and non-full-screen browsers.

The redirect is also not happening during a successful login and/or logout. I have to force redirect after a successful login or logout. Since I created workarounds it's not currently a blocker. But the full-screen issue is a major blocker.

[jo-arroyo]

@danielvoigt Can I confirm that this issue is only happening with macOS users? In my tests the popup window still functions as normal on a Windows machine.

Re: the redirect, are you using the MsalRedirectComponent? How are you handling the redirects?

[danielvoigt]

@jo-arroyo Yes, I can confirm that it is happening on macOS. I haven't tested Windows. I was investigating other issues and now see that it is a known issue: #4921. Any idea when a fix can be expected?

[jo-arroyo]

@danielvoigt Yes, this issue is being investigated for macOS by our team. Closing this issue as it is a duplicate, any workaround or fixes will be tracked and updated on #4921. Thanks.