build: FORMS-1960 update keycloak-js (bcgov#1622)

* build: FORMS-1960 update keycloak-js Update the keycloak library so that we are using a more current version. * fix: keycloak.createLoginUrl is now asynchronous * test: fixed up the unit tests
RyanBirtch-aot · Feb 27, 2025 · b626366 · b626366
1 parent 0125e48
commit b626366
Show file tree

Hide file tree

Showing 5 changed files with 23 additions and 54 deletions.
diff --git a/app/frontend/package-lock.json b/app/frontend/package-lock.json
diff --git a/app/frontend/package.json b/app/frontend/package.json
@@ -42,7 +42,7 @@
     "fast-json-patch": "^3.1.1",
     "font-awesome": "^4.7.0",
     "formiojs": "4.17.4",
-    "keycloak-js": "^21.1.1",
+    "keycloak-js": "^26.2.0",
     "leaflet": "^1.9.4",
     "leaflet-draw": "^1.0.4",
     "leaflet-geosearch": "^4.0.0",

diff --git a/app/frontend/src/store/auth.js b/app/frontend/src/store/auth.js
@@ -25,8 +25,6 @@ export const useAuthStore = defineStore('auth', {
     logoutUrl: undefined,
   }),
   getters: {
-    createLoginUrl: (state) => (options) =>
-      state.keycloak.createLoginUrl(options),
     createLogoutUrl: (state) => (options) =>
       state.keycloak.createLogoutUrl(options),
     email: (state) =>
@@ -113,11 +111,14 @@ export const useAuthStore = defineStore('auth', {
     },
   },
   actions: {
+    async createLoginUrl(options) {
+      return await this.keycloak.createLoginUrl(options);
+    },
     updateKeycloak(keycloak, isAuthenticated) {
       this.keycloak = keycloak;
       this.authenticated = isAuthenticated;
     },
-    login(idpHint) {
+    async login(idpHint) {
       if (this.ready) {
         if (!this.redirectUri) this.redirectUri = location.toString();
 
@@ -130,7 +131,7 @@ export const useAuthStore = defineStore('auth', {
 
         if (options.idpHint) {
           // Redirect to Keycloak if idpHint is available
-          window.location.replace(this.createLoginUrl(options));
+          window.location.replace(await this.createLoginUrl(options));
         } else {
           // Navigate to internal login page if no idpHint specified
           const router = getRouter();

diff --git a/app/frontend/tests/unit/store/modules/auth.actions.spec.js b/app/frontend/tests/unit/store/modules/auth.actions.spec.js
@@ -28,7 +28,7 @@ describe('auth actions', () => {
       formStore.$reset();
       appStore.$reset();
       mockStore.keycloak = {
-        createLoginUrl: vi.fn(() => 'about:blank'),
+        createLoginUrl: vi.fn().mockResolvedValue('about:blank'),
         createLogoutUrl: vi.fn(() => 'about:blank'),
       };
       replaceSpy.mockReset();
@@ -37,49 +37,50 @@ describe('auth actions', () => {
       appStore.config = { basePath: '/app' };
     });
 
-    it('should do nothing if keycloak is not ready', () => {
+    it('should do nothing if keycloak is not ready', async () => {
       mockStore.ready = false;
-      mockStore.login();
+
+      await mockStore.login();
 
       expect(windowReplaceSpy).toHaveBeenCalledTimes(0);
     });
 
-    it('should update redirectUri if not defined', () => {
+    it('should update redirectUri if not defined', async () => {
       mockStore.ready = true;
       mockStore.redirectUri = undefined;
 
-      mockStore.login('test');
+      await mockStore.login('test');
 
       expect(windowReplaceSpy).toHaveBeenCalledTimes(1);
       // Expecting location.toString() instead of 'about:blank'
       expect(mockStore.redirectUri).toEqual(location.toString());
     });
 
-    it('should not update redirectUri if already defined', () => {
+    it('should not update redirectUri if already defined', async () => {
       mockStore.ready = true;
       mockStore.redirectUri = 'value';
 
-      mockStore.login('test');
+      await mockStore.login('test');
 
       expect(windowReplaceSpy).toHaveBeenCalledTimes(1);
       expect(mockStore.redirectUri).toEqual('value');
     });
 
-    it('should navigate with provided idpHint', () => {
+    it('should navigate with provided idpHint', async () => {
       mockStore.ready = true;
       mockStore.redirectUri = 'value';
 
-      mockStore.login('test');
+      await mockStore.login('test');
 
       expect(windowReplaceSpy).toHaveBeenCalledTimes(1);
     });
 
-    it('should navigate with pinia store idpHint', () => {
+    it('should navigate with pinia store idpHint', async () => {
       mockStore.ready = true;
       mockStore.redirectUri = undefined;
       formStore.form = { idps: ['test'] };
 
-      mockStore.login();
+      await mockStore.login();
 
       expect(replaceSpy).toHaveBeenCalledTimes(1);
       expect(replaceSpy).toHaveBeenCalledWith({

diff --git a/app/frontend/tests/unit/store/modules/auth.getters.spec.js b/app/frontend/tests/unit/store/modules/auth.getters.spec.js
@@ -47,12 +47,6 @@ describe('auth getters', () => {
     expect(store.authenticated).toBeTruthy();
   });
 
-  it('createLoginUrl should return a string', () => {
-    expect(store.createLoginUrl).toBeTruthy();
-    expect(typeof store.createLoginUrl).toBe('function');
-    expect(store.createLoginUrl()).toMatch('loginUrl');
-  });
-
   it('email should return a string', () => {
     expect(store.email).toBeTruthy();
     expect(store.email).toMatch('[email protected]');