Merge branch 'dev' into axios-validate-status

.github/workflows/build-steps.yml

@@ -12,6 +12,7 @@ on:
     paths-ignore:
       - '**.md'
       - '**/.vscode/*.json'
+      - 'samples/**'
 
 jobs:
 

.github/workflows/msal-angular-e2e.yml

@@ -0,0 +1,75 @@
+# This workflow will do a clean install of node dependencies, build the source code and run tests across different versions of node
+# For more information see: https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions
+
+name: msal-angular E2E Tests
+
+on:
+  push:
+    branches: 
+      - dev
+      - master
+  pull_request:
+    paths: 
+      - 'lib/msal-angular/**/*'
+      - 'lib/msal-browser/**/*' 
+      - 'lib/msal-common/**/*'
+      - 'samples/msal-angular-v2-samples/**/*'
+      - '!**.md'
+      - '.github/workflows/msal-angular-e2e.yml'
+
+jobs:
+  run-e2e:
+    if: (github.repository == 'AzureAD/microsoft-authentication-library-for-js') && ((github.event.pull_request.head.repo.full_name == github.repository) || (github.event_name == 'push'))
+    runs-on: ubuntu-latest
+
+    strategy:
+      fail-fast: false
+      matrix:
+        sample:
+          - 'angular9-v2-sample-app'
+          - 'angular10-sample-app'
+          - 'angular11-b2c-sample'
+          - 'angular11-sample-app'
+
+    steps:
+    - uses: actions/checkout@v2
+
+    - name: Use Node.js
+      uses: actions/setup-node@v2
+
+    - name: Clean Install
+      env:
+        RUNNING_NODE_CI: 1
+      run: npm ci
+
+    - name: Build packages
+      working-directory: lib/msal-angular
+      run: npm run build:all
+
+    - name: Install Test Tools
+      working-directory: samples/msal-angular-v2-samples
+      run: npm install
+
+    - name: Install ${{ matrix.sample }}
+      working-directory: samples/msal-angular-v2-samples/${{ matrix.sample }}
+      run: |
+        npm install
+    - name: Build ${{ matrix.sample }}
+      working-directory: samples/msal-angular-v2-samples/${{ matrix.sample }}
+      run: npm run build
+
+    - name: E2E Tests
+      working-directory: samples/msal-angular-v2-samples/${{ matrix.sample }}
+      timeout-minutes: 5
+      env:
+        AZURE_CLIENT_SECRET: ${{ secrets.AZURE_CLIENT_SECRET }}
+        AZURE_TENANT_ID: ${{ secrets.AZURE_TENANT_ID }}
+        AZURE_CLIENT_ID: ${{ secrets.AZURE_CLIENT_ID }}
+      run: npm run e2e
+
+    - name: Upload E2E Test Screenshots
+      uses: actions/upload-artifact@v2
+      if: failure()
+      with:
+        name: e2e-test-screenshots
+        path: samples/**/screenshots

.github/workflows/msal-react-e2e.yml

@@ -0,0 +1,75 @@
+# This workflow will do a clean install of node dependencies, build the source code and run tests across different versions of node
+# For more information see: https://help.github.com/actions/language-and-framework-guides/using-nodejs-with-github-actions
+
+name: msal-react E2E Tests
+
+on:
+  push:
+    branches: 
+      - dev
+      - master
+  pull_request:
+    paths: 
+      - 'lib/msal-react/**/*'
+      - 'lib/msal-browser/**/*' 
+      - 'lib/msal-common/**/*'
+      - 'samples/msal-react-samples/**/*'
+      - '!**.md'
+      - '.github/workflows/msal-react-e2e.yml'
+
+jobs:
+  run-e2e:
+    if: (github.repository == 'AzureAD/microsoft-authentication-library-for-js') && ((github.event.pull_request.head.repo.full_name == github.repository) || (github.event_name == 'push'))
+    runs-on: ubuntu-latest
+
+    strategy:
+      fail-fast: false
+      matrix:
+        sample:
+          - 'react-router-sample'
+          - 'nextjs-sample'
+
+    steps:
+    - uses: actions/checkout@v2
+
+    - name: Use Node.js
+      uses: actions/setup-node@v2
+
+    - name: Clean Install
+      env:
+        RUNNING_NODE_CI: 1
+      run: npm ci
+
+    - name: Build packages
+      working-directory: lib/msal-react
+      run: npm run build:all
+
+    - name: Install Test Tools
+      working-directory: samples/msal-react-samples
+      run: npm install
+
+    - name: Install ${{ matrix.sample }}
+      working-directory: samples/msal-react-samples/${{ matrix.sample }}
+      run: |
+        npm run install:local
+        npm install
+
+    - name: Build ${{ matrix.sample }}
+      working-directory: samples/msal-react-samples/${{ matrix.sample }}
+      run: npm run build
+
+    - name: E2E Tests
+      working-directory: samples/msal-react-samples/${{ matrix.sample }}
+      timeout-minutes: 5
+      env:
+        AZURE_CLIENT_SECRET: ${{ secrets.AZURE_CLIENT_SECRET }}
+        AZURE_TENANT_ID: ${{ secrets.AZURE_TENANT_ID }}
+        AZURE_CLIENT_ID: ${{ secrets.AZURE_CLIENT_ID }}
+      run: npm test
+
+    - name: Upload E2E Test Screenshots
+      uses: actions/upload-artifact@v2
+      if: failure()
+      with:
+        name: e2e-test-screenshots
+        path: samples/**/screenshots

.gitignore

@@ -275,3 +275,4 @@ samples/**/data/testCache.json
 samples/**/dist/
 .env
 ref/
+.server.pid

change/@azure-msal-angular-116b7d3f-06cb-4f5b-b76c-a789bcbfeb1c.json

@@ -0,0 +1,7 @@
+{
+  "type": "prerelease",
+  "comment": "Update ssoSilent and cors-api documentation (#2971)",
+  "packageName": "@azure/msal-angular",
+  "email": "joarroyo@microsoft.com",
+  "dependentChangeType": "patch"
+}

change/@azure-msal-angular-f99e033b-afd0-45f3-bd57-5aab6a7f614b.json

@@ -0,0 +1,7 @@
+{
+  "type": "prerelease",
+  "comment": "Msal-angular typedocs and instrumentation (#2863)",
+  "packageName": "@azure/msal-angular",
+  "email": "joarroyo@microsoft.com",
+  "dependentChangeType": "patch"
+}

change/@azure-msal-browser-e5884f37-1ae3-4065-a8d5-47a30aef99e1.json

@@ -0,0 +1,7 @@
+{
+  "type": "none",
+  "comment": "Add instrumentation (#2863)",
+  "packageName": "@azure/msal-browser",
+  "email": "joarroyo@microsoft.com",
+  "dependentChangeType": "none"
+}

change/@azure-msal-react-147cd373-df6a-4668-a3b4-3f183a5cb08a.json

@@ -0,0 +1,7 @@
+{
+  "type": "none",
+  "comment": "Docs updates (#2965)",
+  "packageName": "@azure/msal-react",
+  "email": "thomas.norling@microsoft.com",
+  "dependentChangeType": "none"
+}

change/@azure-msal-react-74f94a66-4b2f-454c-bb40-c4d0a8608743.json

@@ -0,0 +1,7 @@
+{
+  "type": "none",
+  "comment": "package-lock updates (#2841)",
+  "packageName": "@azure/msal-react",
+  "email": "thomas.norling@microsoft.com",
+  "dependentChangeType": "none"
+}

lib/msal-angular/docs/v2-docs/ssosilent.md

@@ -0,0 +1,55 @@
+# Silent login with ssoSilent()
+
+If you already have a session that exists with the authentication server, you can use the `ssoSilent()` API to make a request for tokens without interaction.
+You will need to pass a `loginHint` in the request object in order to successfully obtain a token silently. The `loginHint` can be retrieved from the account object `username` property or the `upn` claim in the ID token, and can also be retrieved from the `emails` claim for B2C use cases. Alternatively, `sid` can be passed instead of `loginHint` for AAD use cases.
+
+```js
+const silentRequest: SsoSilentRequest = {
+    scopes: ["User.Read", "Mail.Read"],
+    loginHint: "user@contoso.com"
+};
+
+this.authService.ssoSilent(silentRequest)
+    .subscribe({
+        next: (result) => console.log("Success!"), // Handle result
+        error: (error) => console.log(error) // Handle error
+    });
+```
+
+If ssoSilent() fails, we recommend handling this error by logging in interactively. Here is an example of ssoSilent() being used in an application's `app.component.ts`:
+
+```js
+import { Component, OnInit } from '@angular/core';
+import { MsalService } from '@azure/msal-angular';
+import { SilentRequest, SsoSilentRequest } from '@azure/msal-browser';
+
+@Component({
+  selector: 'app-root',
+  templateUrl: './app.component.html',
+  styleUrls: ['./app.component.css']
+})
+export class AppComponent implements OnInit {
+
+  constructor(
+    private authService: MsalService,
+  ) {}
+
+  ngOnInit(): void {
+    const silentRequest: SsoSilentRequest = {
+      scopes: ["User.Read"],
+      loginHint: "user@contoso.com"
+    }
+
+    this.authService.ssoSilent(silentRequest)
+      .subscribe({
+        next: (result: AuthenticationResult) => {
+          console.log("SsoSilent succeeded!"); // Handle result
+        }, 
+        error: (error) => {
+          this.authService.loginRedirect(); // Handle error by logging in interactively
+        }
+      });
+  }
+}
+
+```

lib/msal-angular/src/msal.guard.ts

@@ -59,6 +59,10 @@ export class MsalGuard implements CanActivate, CanActivateChild, CanLoad {
         return `${baseUrl}${path}`;
     }
 
+    /**
+     * Interactively prompt the user to login
+     * @param url Path of the requested page
+     */
     private loginInteractively(url: string): Observable<boolean> {
         if (this.msalGuardConfig.interactionType === InteractionType.Popup) {
             this.authService.getLogger().verbose("Guard - logging in by popup");
@@ -81,6 +85,10 @@ export class MsalGuard implements CanActivate, CanActivateChild, CanLoad {
         return of(false);
     }
 
+    /**
+     * Helper which checks for the correct interaction type, prevents page with Guard to be set as reidrect, and calls handleRedirectObservable
+     * @param state 
+     */
     private activateHelper(state?: RouterStateSnapshot): Observable<boolean|UrlTree> {
         if (this.msalGuardConfig.interactionType !== InteractionType.Popup && this.msalGuardConfig.interactionType !== InteractionType.Redirect) {
             throw new BrowserConfigurationAuthError("invalid_interaction_type", "Invalid interaction type provided to MSAL Guard. InteractionType.Popup or InteractionType.Redirect must be provided in the MsalGuardConfiguration");

lib/msal-angular/src/msal.interceptor.ts

@@ -32,6 +32,7 @@ export class MsalInterceptor implements HttpInterceptor {
         this.authService.getLogger().verbose("MSAL Interceptor activated");
         const scopes = this.getScopesForEndpoint(req.url);
 
+        // Sets account as active account or first account
         let account: AccountInfo;
         if (!!this.authService.instance.getActiveAccount()) {
             this.authService.getLogger().verbose("Interceptor - active account selected");
@@ -41,6 +42,7 @@ export class MsalInterceptor implements HttpInterceptor {
             account = this.authService.instance.getAllAccounts()[0];
         }
 
+        // If no scopes for endpoint, does not acquire token
         if (!scopes || scopes.length === 0) {
             this.authService.getLogger().verbose("Interceptor - no scopes for endpoint");
             return next.handle(req);
@@ -94,6 +96,7 @@ export class MsalInterceptor implements HttpInterceptor {
      * Looks up the scopes for the given endpoint from the protectedResourceMap
      * @param endpoint Url of the request
      * @returns Array of scopes, or null if not found
+     *
      */
     private getScopesForEndpoint(endpoint: string): Array<string>|null {
         this.authService.getLogger().verbose("Interceptor - getting scopes for endpoint");
@@ -102,7 +105,7 @@ export class MsalInterceptor implements HttpInterceptor {
             return StringUtils.matchPattern(key, endpoint);
         });
 
-        // process all protected resources and send the first matched resource
+        // Process all protected resources and send the first matched resource
         if (keyMatchesEndpointArray.length > 0) {
             const keyForEndpoint = keyMatchesEndpointArray[0];
             if (keyForEndpoint) {

lib/msal-angular/src/msal.service.ts

@@ -63,12 +63,17 @@ export class MsalService implements IMsalService {
     ssoSilent(request: SsoSilentRequest): Observable<AuthenticationResult> {
         return from(this.instance.ssoSilent(request));
     }
+    /**
+     * Gets logger for msal-angular.
+     * If no logger set, returns logger instance created with same options as msal-browser
+     */
     getLogger(): Logger {
         if (!this.logger) {
             this.logger = this.instance.getLogger().clone(name, version);
         }
         return this.logger;
     }
+    // Create a logger instance for msal-angular with the same options as msal-browser
     setLogger(logger: Logger): void {
         this.logger = logger.clone(name, version);
         this.instance.setLogger(logger);