msal-browser failed in Office Addin Dialog API

Question

I am trying to use @azure/msal-browser and @azure/msal-react to enable Excel addin support microsoft sso and access Graph api.

Due to that Excel addin does not support access external url from Excel taskpane, i need to access @azure/msal-browser in dialog api which can be referece Enable single sign-on (SSO) in an Office Add-in.

If I use PublicClientApplication in normail excel addin project like react React single-page application using MSAL React to authenticate users against Azure AD for Customers, I am able to access the authorize consent page.

But, I open the page from dialog api like below:

 Office.context.ui.displayDialogAsync('https://localhost:3000/dialog.html', {height: 30, width: 20, displayInIframe: true});

And in the dialog page, it will call

const msalInstance = new PublicClientApplication(msalConfig);

I will throw error below:

This specific to @azure/msal-browser version ^3.7.0, if I switch to ^2.28.1, the error will gone.