Microsoft Teams desktop clients pop-ups not working.

[usselite]

Core Library

MSAL.js (@azure/msal-browser)

Core Library Version

3.27.0

Wrapper Library

Not Applicable

Wrapper Library Version

None

Public or Confidential Client?

Public

Description

Whenever we cannot log user in silently, user has to press a button which calls loginPopup and loginRedirect as a fallback in case if loginPopup fails. While trying to call loginPopup or loginRedirect both fail on MS Teams desktop client (Windows or Mac).
It works on mobile devices and web.

Error Message

authentication.ts:37 InteractionRequiredAuthError: interaction_required: Session information is not sufficient for single-sign-on.
at mn.validateServerAuthorizationCodeResponse (msal-browser.cjs:6831:23)
at yn.handleFragmentResponse (msal-browser.cjs:7225:25)
at Ba.handleCodeResponse (msal-browser.cjs:14383:48)
at msal-browser.cjs:5172:16
at Za.silentTokenHelper (msal-browser.cjs:15654:16)
at async Za.acquireToken (msal-browser.cjs:15588:40)

authentication.ts:63 BrowserAuthError: popup_window_error: Error opening popup window. This can happen if you are using IE or if popups are blocked in the browser.
at Do (msal-browser.cjs:9427:12)
at Ha.openPopup (msal-browser.cjs:14833:19)
at Ha.initiateAuthRequest (msal-browser.cjs:14736:25)
at Ha.acquireTokenPopupAsync (msal-browser.cjs:14604:38)

authentication.ts:87 BrowserAuthError: redirect_in_iframe: Redirects are not supported for iframed or brokered applications. Please ensure you are using MSAL.js in a top frame of the window if using the redirect APIs, or use the popup APIs.
at Do (msal-browser.cjs:9427:12)
at Fi (msal-browser.cjs:9971:15)
at zi (msal-browser.cjs:10022:5)
at rs.acquireTokenRedirect (msal-browser.cjs:16303:13)
at rs.loginRedirect (msal-browser.cjs:17135:21)
at us.loginRedirect (msal-browser.cjs:18326:32)
at authentication.ts:79:24
at file.ts:105:45
at Object.next (file.ts:105:45)
at a (file.ts:105:45)

MSAL Logs

thunks.ts:143
[Thu, 14 Nov 2024 19:10:47 GMT] : [01932c15-cfd4-7d41-8328-6e2710ecc522] : [email protected] : Error - error opening popup empty_window_error: window.open returned null or undefined window object.

thunks.ts:146
[Thu, 14 Nov 2024 19:10:47 GMT] : [01932c15-cfde-7d88-a92a-e5b2bee7643a] : [email protected] : Info - handleRedirectPromise called but there is no interaction in progress, returning null.

Network Trace (Preferrably Fiddler)

• Sent
• Pending

MSAL Configuration

{
            auth: {
                clientId: msAppId,
                redirectUri: `${window.location.origin}/redirect.html`,
            },
            cache: {
                cacheLocation: 'localStorage',
                storeAuthStateInCookie: false,
            },
            system: {
                loggerOptions: {
                    logLevel: LogLevel.Verbose,
                    loggerCallback: (level, message, containsPii) => {
                        if (containsPii) {
                            return;
                        }
                        switch (level) {
                            case LogLevel.Error:
                                console.error(message);
                                return;
                            case LogLevel.Info:
                                console.info(message);
                                return;
                            case LogLevel.Verbose:
                                console.debug(message);
                                return;
                            case LogLevel.Warning:
                                console.warn(message);
                                return;
                            default:
                                console.log(message);
                                return;
                        }
                    },
                    piiLoggingEnabled: false,
                },
            },
        }

Relevant Code Snippets

export const authenticateMsTeamsInteractively = async ({
    loginHint,
    msal = msalRefBox.getValue(),
    onUserCancelledPopup,
}: {
    loginHint?: string;
    msal?: PublicClientApplication;
    onUserCancelledPopup?: () => void;
}): Promise<AuthenticationResult | null> => {
    if (!msal) {
        return null;
    }

    try {
        const authRes = await msal.loginPopup({
            loginHint,
            scopes: [],
        });
        return authRes;
    } catch (err) {
        console.error(err);
        if (
            err instanceof BrowserAuthError &&
            err.errorCode === 'user_cancelled'
        ) {
            onUserCancelledPopup?.();
            return null;
        }
    }

    try {
        const authRes = await msal.handleRedirectPromise();

        if (msal.getAllAccounts().length === 0 || !authRes) {
            await msal.loginRedirect({
                loginHint,
                scopes: [],
            });
        }

        return authRes;
    } catch (err) {
        console.error(err);
    }

    return null;
};

export const authenticateMsTeamsInteractivelyThunk = (): ThunkAction<
    void,
    RootState,
    unknown,
    AnyAction
> =>
    async function thunk(dispatch, getState): Promise<void> {
        const teamsContext = selectTeamsContext(getState());
        const msal = msalRefBox.getValue();
        if (!msal) {
            return;
        }

        const authRes = await authenticateMsTeamsInteractively({
            loginHint: teamsContext?.user?.loginHint,
        });
        dispatch(setMsalAuthResultThunk(authRes));
    };

<PrimaryButton
    text="Login"
    onClick={() =>
        dispatch(authenticateMsTeamsInteractivelyThunk())
    }
/>

Reproduction Steps

1. Open Microsoft Teams desktop client.
2. Open add-in dialog (message extension), without active session info (ssoSilent and acquireTokenSilent would fail).
3. Press login button that calls login pop-up.

Expected Behavior

Either expected to be redirected or pop-up to be opened on Microsoft Teams desktop clients.

Identity Provider

Entra ID (formerly Azure AD) / MSA

Browsers Affected (Select all that apply)

Other

Regression

No response