Missed state when create a new UserAgentApplication

[dluque92]

I'm submitting a...

[ ] Regression (a behavior that used to work and stopped working in a new release)
[X] Bug report  
[ ] Performance issue
[ ] Feature request
[ ] Documentation issue or request
[ ] Other... Please describe:

Browser:

• Chrome version XX
• Firefox version XX
• IE version XX
• Edge version XX
• Safari version XX

Library version

Library version: 1.0.2



## Current behavior

In Configuration.ts we have the following lines to describe and define AuthOptions:

/**
 * @type AuthOptions: Use this to configure the auth options in the Configuration object
 *
 *  - clientId                    - Client ID of your app registered with our Application registration portal : https://portal.azure.com/#blade/Microsoft_AAD_IAM/ActiveDirectoryMenuBlade/RegisteredAppsPreview in Microsoft Identity Platform
 *  - authority                   - You can configure a specific authority, defaults to " " or "https://login.microsoftonline.com/common"
 *  - validateAuthority           - Used to turn authority validation on/off. When set to true (default), MSAL will compare the application's authority against well-known URLs templates representing well-formed authorities. It is useful when the authority is obtained at run time to prevent MSAL from displaying authentication prompts from malicious pages.
 *  - redirectUri                 - The redirect URI of the application, this should be same as the value in the application registration portal.Defaults to `window.location.href`.
 *  - postLogoutRedirectUri       - Used to redirect the user to this location after logout. Defaults to `window.location.href`.
 *  - state                       - Use to send the state parameter with authentication request
 *  - navigateToLoginRequestUrl   - Used to turn off default navigation to start page after login. Default is true. This is used only for redirect flows.
 *
 */
export type AuthOptions = {
  clientId: string;
  authority?: string;
  validateAuthority?: boolean;
  redirectUri?: string | (() => string);
  postLogoutRedirectUri?: string | (() => string);
  navigateToLoginRequestUrl?: boolean;
};

## Expected behavior

As you can see in the comments below, is an state propertie, that is missing in the type AuthOptions


## Minimal reproduction of the problem with instructions

If is not included since new versions, how can I manage it, and pass state? I need it to control state after callback in SignIn or EditProfile policies

[pkanher617]

Hi @dluque92, we allow the user to pass a state in the AuthenticationParameters object, which is the object sent in the login and acquireToken requests.

/**
 * @link AuthenticationParameters}AuthenticationParameters
 */
export type AuthenticationParameters = {
    scopes?: Array<string>;
    extraScopesToConsent?: Array<string>;
    prompt?: string;
    extraQueryParameters?: QPDict;
    claimsRequest?: string;
    authority?: string;
    state?: string;
    correlationId?: string;
    account?: Account;
    sid?: string;
    loginHint?: string;
};

Example:

let loginRequest = {
   state = "1234"
};

loginPopup(loginRequest).then(loginResponse => {
   let responseState = loginResponse.accountState;
}).catch(error => {
   console.log(error);
});

This pattern should be the same for all of the login and acquiretoken APIs. Please let me know if you are still having issues.

[yakimko]

@pkanher617 I got tslint error when try to pass state property, because its not defined in type

[pkanher617]

Hm I haven't received this error before. Could you post a code snippet of your acquireToken or login call and the request object you are constructing?

[dluque92]

Hi @pkanher617 the new UserAgentApplication expects config with this format:
https://docs.microsoft.com/bs-latn-ba/azure/active-directory/develop/msal-js-initializing-client-applications

export type Configuration = {
    auth: AuthOptions,
    cache?: CacheOptions,
    system?: SystemOptions,
    framework?: FrameworkOptions
};

[pkanher617]

@dluque92 As of MSAL.js v1.0.0, we no longer accept state as a configuration parameter. This is because the state needs to be set per request, not per instance of MSAL.

The new configuration objects and parameters can be found here.

We have also changed how the requests for login and acquireToken are made. A new object called AuthenticationParameters is now used to pass state.

[sameerag]

@dluque92 To expand specifically how a request looks:

export type AuthenticationParameters = {
scopes?: Array;
extraScopesToConsent?: Array;
prompt?: string;
extraQueryParameters?: Dict;
claimsRequest?: string;
authority?: string;
state?: string;
correlationId?: string;
account?: Account;
sid?: string;
loginHint?: string;
};

We will be sticking to this more or less(except may be adding some more params if there is a user need). Please check the 1.0.0 announcement for more details.

[dluque92]

@sameerag Then this file is wrong:
https://github.com/AzureAD/microsoft-authentication-library-for-js/blob/bff2b7007bfa7283fe8b9b77ca95994e5cef5c97/lib/msal-core/src/Configuration.ts

/**
 * @type AuthOptions: Use this to configure the auth options in the Configuration object
 *
 *  - clientId                    - Client ID of your app registered with our Application registration portal : https://portal.azure.com/#blade/Microsoft_AAD_IAM/ActiveDirectoryMenuBlade/RegisteredAppsPreview in Microsoft Identity Platform
 *  - authority                   - You can configure a specific authority, defaults to " " or "https://login.microsoftonline.com/common"
 *  - validateAuthority           - Used to turn authority validation on/off. When set to true (default), MSAL will compare the application's authority against well-known URLs templates representing well-formed authorities. It is useful when the authority is obtained at run time to prevent MSAL from displaying authentication prompts from malicious pages.
 *  - redirectUri                 - The redirect URI of the application, this should be same as the value in the application registration portal.Defaults to `window.location.href`.
 *  - postLogoutRedirectUri       - Used to redirect the user to this location after logout. Defaults to `window.location.href`.
 *  - state                       - Use to send the state parameter with authentication request
 *  - navigateToLoginRequestUrl   - Used to turn off default navigation to start page after login. Default is true. This is used only for redirect flows.
 *
 */
export type AuthOptions = {
  clientId: string;
  authority?: string;
  validateAuthority?: boolean;
  redirectUri?: string | (() => string);
  postLogoutRedirectUri?: string | (() => string);
  navigateToLoginRequestUrl?: boolean;
};

[pkanher617]

@dluque92 Thanks for pointing that out. I will fix the comments right now.

[dluque92]

@pkanher617 But also, the AuthenticationParameters has been changed, As you said here

How can we pass state in this case?
Thanks!

type storage = "localStorage" | "sessionStorage";

// Protocol Support
export type AuthOptions = {
    clientId: string;
    authority?: string;
    validateAuthority?: boolean;
    redirectUri?: string | (() => string);
    postLogoutRedirectUri?: string | (() => string);
    navigateToLoginRequestUrl?: boolean;
};

// Cache Support
export type CacheOptions = {
    cacheLocation?: CacheLocation;
    storeAuthStateInCookie?: boolean;
};

// Library support
export type SystemOptions = {
    logger?: Logger;
    loadFrameTimeout?: number;
    tokenRenewalOffsetSeconds?: number;
};

// Developer App Environment Support
export type FrameworkOptions = {
    isAngular?: boolean;
    unprotectedResources?: Array<string>;
    protectedResourceMap?: Map<string, Array<string>>;
};

// Configuration Object
export type Configuration = {
    auth: AuthOptions,
    cache?: CacheOptions,
    system?: SystemOptions,
    framework?: FrameworkOptions
};

[pkanher617]

@dluque92 This is still the configuration object.

Please see my above comment and the AuthenticationParameters.ts class.

[sameerag]

@dluque92 as @pkanher617 mentioned above, AuthenticationParameters.ts class has the detail on how to send the 'state' per request. Closing this issue as #780 is in dev.