Issue: MSAL Login Loop in Azure Static Web Apps with Password Protection on Safari

[PraiseThampiCC]

Overview

In Azure Static Web Apps, when using Microsoft Authentication Library (MSAL) for login and enabling the password protection feature, users face a login loop issue in the Safari browser. This problem does not occur in other browsers like Chrome and Edge.

Steps to Reproduce

1. Create a React Application
   Develop a basic React application and integrate MSAL login functionality. Ensure that the app requires users to authenticate via MSAL.

2. Host the Application on Azure Static Web Apps
   Deploy the React application using Azure Static Web Apps. After deployment, enable the password protection feature in Azure Static Web Apps settings.

3. Test the Application in Safari Browser
   Open the hosted application in Safari:

   • Upon accessing the app, you will first be prompted to enter the Azure Static Web App password.
   • After entering the password, attempt to log in using MSAL authentication.
   • Once you input your MSAL credentials, you will again be prompted for the Azure Static Web App password, resulting in an infinite loop. You will be unable to successfully log in using MSAL.

Observations

• Safari Browser:
  This login loop issue only occurs in Safari, where the user is continually prompted to enter the static web app password after initiating MSAL login. The user is stuck in a loop and cannot complete the login process.

• Chrome and Edge:
  The same configuration works as expected in other browsers like Chrome and Edge, where users are only prompted for the static web app password once, followed by a successful MSAL login.

Potential Causes and Considerations

• Browser Compatibility Issue:
  The issue appears to be isolated to Safari, suggesting a potential incompatibility between how Safari handles cookies, sessions, or redirects in combination with Azure Static Web App's password protection and MSAL login flow.

Additional Context:

we use password protection feature of static web apps in the testing environments of our websites