Getting graph token from Office Add-in (OfficeApp) fails

[eirikb]

Trying to use adal.js (plain version, no Angular, bundling with Parcel) in Office Add-in (OfficeApp). But I get this error (when developing locally):

• Interesting cookie-warning: _Set-Cookie header is ignored in response from url: https://login.microsoftonline.com/common/oauth2/authorize?response_type=id_to.... Cookie length should be less than or equal to 4096 characters._
• Error: Uncaught DOMException: Blocked a frame with origin "https://localhost:3000" from accessing a cross-origin frame.

Here is my test-code:

import AuthenticationContext from 'adal-angular';

const config = {
  clientId: 'ff5cc66a-5eac-4328-b68e-04d0a6016c1c'
};

const authContext = new AuthenticationContext(config);
authContext.handleWindowCallback();
const err = authContext.getLoginError();
if (err) {
  console.error(err);
}
const user = authContext.getCachedUser();
if (!user) {
  console.log('No user, logging in...');
  authContext.login();
} else {
  console.log('user', user);
  authContext.acquireToken('https://graph.microsoft.com',  (err, token) => {
    console.log(err, token);
  });
}

Here is my AppDomains in manifest.xml:

<AppDomains>
    <AppDomain>https://localhost:3000</AppDomain>
    <AppDomain>https://login.windows.net</AppDomain>
    <AppDomain>https://login.microsoftonline.com</AppDomain>
</AppDomains>

If I use popUp: true in config I am able to log in, but I don't want popUp, and I haven't found a good flow, need to re-login a couple of times for it to work, but it proves that that Azure setup is correct. Note that with popUp I get this error: #531, however the application actually works, so it just looks strange. Also note that if I first log in with popUp I will be able to use non-popUp login afterwards, getting the token (so it is the login part which fails).

[eirikb]

I have tried debugging the issue, but it's a bit hard to follow the code flow. But this might be the issue: https://github.com/AzureAD/azure-activedirectory-library-for-js/blob/dev/lib/adal.js#L1320 as parent is tried accessed when it's an iframe, but for Office Add-in the app is already inside an iframe so it will fail (no access to parent).

I have tried to make a very light-weight version of adal.js which supports being both called from top window (normal SPA) and inside an iframe (Office Add-in), and this seems to work (note line 2-6): https://gist.github.com/eirikb/29e9bde9b2fcf5bc290f595d99d77136

[jmckennon]

All current authentication work from Microsoft is delivered through the msal js library here. adal js is still supported only for security fixes. We recommend moving to msal js for any advanced feature requests and bugfixes.

[eirikb]

@jmckennon Thanks. Just a note, msal doesn't work with Add-ins either - https://github.com/AzureAD/microsoft-authentication-library-for-js/issues/1072