diff --git a/src/api/user/ActiveRoleSynchronizer.js b/src/api/user/ActiveRoleSynchronizer.js
index a6fac73c06..06c0e16ecd 100644
--- a/src/api/user/ActiveRoleSynchronizer.js
+++ b/src/api/user/ActiveRoleSynchronizer.js
@@ -16,13 +16,14 @@ class ActiveRoleSynchronizer {
     };
   }
   subscribeToRoleChanges(callback) {
-    this.#roleChannel.addEventListener('message', this.extractRoleFromEvent(callback));
+    this.#roleChannel.addEventListener('message', callback);
   }
   unsubscribeFromRoleChanges(callback) {
-    this.#roleChannel.removeEventListener('message', this.extractRoleFromEvent(callback));
+    this.#roleChannel.removeEventListener('message', callback);
   }
 
-  setActiveRoleFromChannelMessage(role) {
+  setActiveRoleFromChannelMessage(event) {
+    const role = event.data;
     this.openmct.user.setActiveRole(role);
   }
   broadcastNewRole(role) {
diff --git a/src/plugins/userIndicator/components/UserIndicator.vue b/src/plugins/userIndicator/components/UserIndicator.vue
index 6ea1027f03..2407e72108 100644
--- a/src/plugins/userIndicator/components/UserIndicator.vue
+++ b/src/plugins/userIndicator/components/UserIndicator.vue
@@ -46,11 +46,11 @@ export default {
   async mounted() {
     this.getUserInfo();
     this.roleChannel = new ActiveRoleSynchronizer(this.openmct);
-    this.roleChannel.subscribeToRoleChanges(this.setRoleSelection);
+    this.roleChannel.subscribeToRoleChanges(this.onRoleChange);
     await this.fetchOrPromptForRole();
   },
   beforeDestroy() {
-    this.roleChannel.unsubscribeFromRoleChanges(this.setRoleSelection);
+    this.roleChannel.unsubscribeFromRoleChanges(this.onRoleChange);
   },
   methods: {
     async getUserInfo() {
@@ -97,6 +97,10 @@ export default {
         ]
       });
     },
+    onRoleChange(event) {
+      const role = event.data;
+      this.setRoleSelection(role);
+    },
     setRoleSelection(role) {
       this.role = role;
     },