Fix silent refresh iframe with multiple idps

.eslintrc.json

@@ -82,7 +82,9 @@
         "no-case-declarations": ["error"],
         "no-empty": ["error"],
         "@typescript-eslint/no-empty-function": ["error"],
-        "@typescript-eslint/ban-types": ["error"],
+        "@typescript-eslint/no-empty-object-type": ["error"],
+        "@typescript-eslint/no-unsafe-function-type": ["error"],
+        "@typescript-eslint/no-wrapper-object-types": ["error"],
         "no-useless-escape": ["error"],
         "no-prototype-builtins": ["error"],
         "prefer-spread": ["error"],

.github/workflows/build.yml

@@ -77,28 +77,28 @@ jobs:
           path: angular-auth-oidc-client-artefact
 
       - name: Install AngularCLI globally
-        run: sudo npm install -g @angular/cli
+        run: npm install -g @angular/cli
 
       - name: Show ng Version
         run: ng version
 
       - name: Create Angular Project
-        run: sudo ng new angular-auth-oidc-client-test --skip-git
+        run: ng new angular-auth-oidc-client-test --skip-git
 
       - name: Npm Install & Install Library from local artefact
         run: |
-          sudo cp -R angular-auth-oidc-client-artefact angular-auth-oidc-client-test/
+          cp -R angular-auth-oidc-client-artefact angular-auth-oidc-client-test/
           cd angular-auth-oidc-client-test
-          sudo npm install --unsafe-perm=true
-          sudo ng add ./angular-auth-oidc-client-artefact --authority-url-or-tenant-id "my-authority-url" --flow-type "OIDC Code Flow PKCE using refresh tokens" --use-local-package=true --skip-confirmation
+          npm install --unsafe-perm=true
+          ng add ./angular-auth-oidc-client-artefact --authority-url-or-tenant-id "my-authority-url" --flow-type "OIDC Code Flow PKCE using refresh tokens" --use-local-package=true --skip-confirmation
 
       - name: Test Angular Application
         working-directory: ./angular-auth-oidc-client-test
         run: npm test -- --watch=false --browsers=ChromeHeadless
 
       - name: Build Angular Application
         working-directory: ./angular-auth-oidc-client-test
-        run: sudo npm run build
+        run: npm run build
 
   AngularLatestVersionWithSchematics:
     needs: build_job
@@ -117,28 +117,28 @@ jobs:
           path: angular-auth-oidc-client-artefact
 
       - name: Install AngularCLI globally
-        run: sudo npm install -g @angular/cli
+        run: npm install -g @angular/cli
 
       - name: Show ng Version
         run: ng version
 
       - name: Create Angular Project
-        run: sudo ng new angular-auth-oidc-client-test --skip-git
+        run: ng new angular-auth-oidc-client-test --skip-git
 
       - name: Npm Install & Install Library from local artefact
         run: |
-          sudo cp -R angular-auth-oidc-client-artefact angular-auth-oidc-client-test/
+          cp -R angular-auth-oidc-client-artefact angular-auth-oidc-client-test/
           cd angular-auth-oidc-client-test
-          sudo npm install --unsafe-perm=true
-          sudo ng add ./angular-auth-oidc-client-artefact --authority-url-or-tenant-id "my-authority-url" --flow-type "Default config" --use-local-package=true --skip-confirmation
+          npm install --unsafe-perm=true
+          ng add ./angular-auth-oidc-client-artefact --authority-url-or-tenant-id "my-authority-url" --flow-type "Default config" --use-local-package=true --skip-confirmation
 
       - name: Test Angular Application
         working-directory: ./angular-auth-oidc-client-test
         run: npm test -- --watch=false --browsers=ChromeHeadless
 
       - name: Build Angular Application
         working-directory: ./angular-auth-oidc-client-test
-        run: sudo npm run build
+        run: npm run build
 
   AngularLatestVersionWithNgModuleSchematics:
     needs: build_job
@@ -157,28 +157,28 @@ jobs:
           path: angular-auth-oidc-client-artefact
 
       - name: Install AngularCLI globally
-        run: sudo npm install -g @angular/cli
+        run: npm install -g @angular/cli
 
       - name: Show ng Version
         run: ng version
 
       - name: Create Angular Project
-        run: sudo ng new angular-auth-oidc-client-test --skip-git --standalone=false
+        run: ng new angular-auth-oidc-client-test --skip-git --standalone=false
 
       - name: Npm Install & Install Library from local artefact
         run: |
-          sudo cp -R angular-auth-oidc-client-artefact angular-auth-oidc-client-test/
+          cp -R angular-auth-oidc-client-artefact angular-auth-oidc-client-test/
           cd angular-auth-oidc-client-test
-          sudo npm install --unsafe-perm=true
-          sudo ng add ./angular-auth-oidc-client-artefact --authority-url-or-tenant-id "my-authority-url" --flow-type "OIDC Code Flow PKCE using refresh tokens" --use-local-package=true --skip-confirmation
+          npm install --unsafe-perm=true
+          ng add ./angular-auth-oidc-client-artefact --authority-url-or-tenant-id "my-authority-url" --flow-type "OIDC Code Flow PKCE using refresh tokens" --use-local-package=true --skip-confirmation
 
       - name: Test Angular Application
         working-directory: ./angular-auth-oidc-client-test
         run: npm test -- --watch=false --browsers=ChromeHeadless
 
       - name: Build Angular Application
         working-directory: ./angular-auth-oidc-client-test
-        run: sudo npm run build
+        run: npm run build
 
   Angular16VersionWithRxJs6:
     needs: build_job
@@ -197,32 +197,32 @@ jobs:
           path: angular-auth-oidc-client-artefact
 
       - name: Install AngularCLI globally
-        run: sudo npm install -g @angular/cli@16
+        run: npm install -g @angular/cli@16
 
       - name: Show ng Version
         run: ng version
 
       - name: Create Angular Project
-        run: sudo ng new angular-auth-oidc-client-test --skip-git
+        run: ng new angular-auth-oidc-client-test --skip-git
 
       - name: npm install RxJs 6
         working-directory: ./angular-auth-oidc-client-test
-        run: sudo npm install [email protected]
+        run: npm install [email protected]
 
       - name: Npm Install & Install Library from local artefact
         run: |
-          sudo cp -R angular-auth-oidc-client-artefact angular-auth-oidc-client-test/
+          cp -R angular-auth-oidc-client-artefact angular-auth-oidc-client-test/
           cd angular-auth-oidc-client-test
-          sudo npm install --unsafe-perm=true
-          sudo ng add ./angular-auth-oidc-client-artefact --authority-url-or-tenant-id "my-authority-url" --flow-type "OIDC Code Flow PKCE using refresh tokens" --use-local-package=true --skip-confirmation
+          npm install --unsafe-perm=true
+          ng add ./angular-auth-oidc-client-artefact --authority-url-or-tenant-id "my-authority-url" --flow-type "OIDC Code Flow PKCE using refresh tokens" --use-local-package=true --skip-confirmation
 
       - name: Test Angular Application
         working-directory: ./angular-auth-oidc-client-test
         run: npm test -- --watch=false --browsers=ChromeHeadless
 
       - name: Build Angular Application
         working-directory: ./angular-auth-oidc-client-test
-        run: sudo npm run build
+        run: npm run build
 
   LibWithAngularV16:
       needs: build_job
@@ -241,25 +241,25 @@ jobs:
             path: angular-auth-oidc-client-artefact
 
         - name: Install AngularCLI globally
-          run: sudo npm install -g @angular/cli@16
+          run: npm install -g @angular/cli@16
 
         - name: Show ng Version
           run: ng version
 
         - name: Create Angular Project
-          run: sudo ng new angular-auth-oidc-client-test --skip-git
+          run: ng new angular-auth-oidc-client-test --skip-git
 
         - name: Npm Install & Install Library from local artefact
           run: |
-            sudo cp -R angular-auth-oidc-client-artefact angular-auth-oidc-client-test/
+            cp -R angular-auth-oidc-client-artefact angular-auth-oidc-client-test/
             cd angular-auth-oidc-client-test
-            sudo npm install --unsafe-perm=true
-            sudo ng add ./angular-auth-oidc-client-artefact --authority-url-or-tenant-id "my-authority-url" --flow-type "OIDC Code Flow PKCE using refresh tokens" --use-local-package=true --skip-confirmation
+            npm install --unsafe-perm=true
+            ng add ./angular-auth-oidc-client-artefact --authority-url-or-tenant-id "my-authority-url" --flow-type "OIDC Code Flow PKCE using refresh tokens" --use-local-package=true --skip-confirmation
 
         - name: Test Angular Application
           working-directory: ./angular-auth-oidc-client-test
           run: npm test -- --watch=false --browsers=ChromeHeadless
 
         - name: Build Angular Application
           working-directory: ./angular-auth-oidc-client-test
-          run: sudo npm run build
+          run: npm run build

angular.json

@@ -2041,6 +2041,119 @@
           }
         }
       }
+    },
+    "integration-tests": {
+      "projectType": "application",
+      "schematics": {
+        "@schematics/angular:class": {
+          "skipTests": true
+        },
+        "@schematics/angular:component": {
+          "skipTests": true
+        },
+        "@schematics/angular:directive": {
+          "skipTests": true
+        },
+        "@schematics/angular:guard": {
+          "skipTests": true
+        },
+        "@schematics/angular:interceptor": {
+          "skipTests": true
+        },
+        "@schematics/angular:pipe": {
+          "skipTests": true
+        },
+        "@schematics/angular:resolver": {
+          "skipTests": true
+        },
+        "@schematics/angular:service": {
+          "skipTests": true
+        }
+      },
+      "root": "projects/integration-tests",
+      "sourceRoot": "projects/integration-tests/src",
+      "prefix": "app",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:application",
+          "options": {
+            "outputPath": "dist/integration-tests",
+            "index": "projects/integration-tests/src/index.html",
+            "browser": "projects/integration-tests/src/main.ts",
+            "polyfills": [
+              "zone.js"
+            ],
+            "tsConfig": "projects/integration-tests/tsconfig.app.json",
+            "assets": [
+              {
+                "glob": "**/*",
+                "input": "projects/integration-tests/public"
+              }
+            ],
+            "styles": [
+              "projects/integration-tests/src/styles.css"
+            ],
+            "scripts": []
+          },
+          "configurations": {
+            "production": {
+              "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "500kB",
+                  "maximumError": "1MB"
+                },
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "4kB",
+                  "maximumError": "8kB"
+                }
+              ],
+              "outputHashing": "all"
+            },
+            "development": {
+              "optimization": false,
+              "extractLicenses": false,
+              "sourceMap": true
+            }
+          },
+          "defaultConfiguration": "production"
+        },
+        "serve": {
+          "builder": "@angular-devkit/build-angular:dev-server",
+          "configurations": {
+            "production": {
+              "buildTarget": "integration-tests:build:production"
+            },
+            "development": {
+              "buildTarget": "integration-tests:build:development"
+            }
+          },
+          "defaultConfiguration": "development"
+        },
+        "extract-i18n": {
+          "builder": "@angular-devkit/build-angular:extract-i18n"
+        },
+        "test": {
+          "builder": "@angular-devkit/build-angular:karma",
+          "options": {
+            "polyfills": [
+              "zone.js",
+              "zone.js/testing"
+            ],
+            "tsConfig": "projects/integration-tests/tsconfig.spec.json",
+            "assets": [
+              {
+                "glob": "**/*",
+                "input": "projects/integration-tests/src/assets",
+                "output": "/assets"
+              }
+            ],
+            "styles": [],
+            "scripts": []
+          }
+        }
+      }
     }
   },
   "cli": {

docs/site/angular-auth-oidc-client/docs/documentation/silent-renew.md

@@ -97,13 +97,21 @@ Both the access token and the id_token are used to start this process.
 window.onload = function () {
   /* The parent window hosts the Angular application */
   const parent = window.parent;
+
   /* Send the id_token information to the oidc message handler */
-  const event = new CustomEvent('oidc-silent-renew-message', { detail: window.location });
+  const event = new CustomEvent('oidc-silent-renew-message', { 
+    detail: {
+      url: window.location,
+      srcFrameId: window.frameElement?.id
+    }
+  });
   parent.dispatchEvent(event);
 };
 </script>
 ```
 
+**Note:** When using multiple authentication configurations, each iframe is created with a unique identifier that includes the configId. The silent-renew.html script includes the iframe's id in the event as `srcFrameId`, allowing the library to extract the configId and correctly route the authentication response to the appropriate configuration.
+
 If you are working with the [Angular CLI](https://angular.io/cli) make sure you add the `silent-renew.html` file to the assets configuration in your `angular.json`. This has already been done for you if you used the `ng add` schematics to install and setup the library.
 
 ```json
@@ -119,8 +127,14 @@ If you are working with the [Angular CLI](https://angular.io/cli) make sure you
 window.onload = function () {
   /* The parent window hosts the Angular application */
   const parent = window.parent;
+
   /* Send the id_token information to the oidc message handler */
-  const event = new CustomEvent('oidc-silent-renew-message', { detail: window.location.hash.substr(1) });
+  const event = new CustomEvent('oidc-silent-renew-message', { 
+    detail: {
+      url: window.location.hash.substr(1),
+      srcFrameId: window.frameElement?.id
+    }
+  });
   parent.dispatchEvent(event);
 };
 </script>