fix: setAuth ran automatically for realtime; prioritize setAuth tasks (#1475)

Author: filipecabaco

package-lock.json

@@ -52,8 +52,8 @@
     "@supabase/auth-js": "2.71.0",
     "@supabase/functions-js": "2.4.5",
     "@supabase/node-fetch": "2.6.15",
-    "@supabase/postgrest-js": "1.19.4",
-    "@supabase/realtime-js": "2.11.15",
+    "@supabase/postgrest-js": "1.21.0",
+    "@supabase/realtime-js": "2.12.1",
     "@supabase/storage-js": "2.7.1"
   },
   "devDependencies": {
@@ -87,4 +87,4 @@
   "jsdelivr": "dist/umd/supabase.js",
   "unpkg": "dist/umd/supabase.js",
   "packageManager": "[email protected]+sha512.6540583f41cc5f628eb3d9773ecee802f4f9ef9923cc45b69890fb47991d4b092964694ec3a4f738a420c918a333062c8b925d312f42e4f0c263eb603551f977"
-}
+}

package.json

@@ -131,7 +131,7 @@ export default class SupabaseClient<
     })
 
     if (!settings.accessToken) {
-      this._listenForAuthEvents()
+      setTimeout(() => this._listenForAuthEvents(), 0)
     }
   }
 
@@ -268,7 +268,7 @@ export default class SupabaseClient<
     return this.realtime.removeAllChannels()
   }
 
-  private async _getAccessToken() {
+  protected async _getAccessToken() {
     if (this.accessToken) {
       return await this.accessToken()
     }
@@ -278,7 +278,7 @@ export default class SupabaseClient<
     return data.session?.access_token ?? null
   }
 
-  private _initSupabaseAuthClient(
+  protected _initSupabaseAuthClient(
     {
       autoRefreshToken,
       persistSession,
@@ -314,21 +314,23 @@ export default class SupabaseClient<
     })
   }
 
-  private _initRealtimeClient(options: RealtimeClientOptions) {
+  protected _initRealtimeClient(options: RealtimeClientOptions) {
     return new RealtimeClient(this.realtimeUrl.href, {
       ...options,
       params: { ...{ apikey: this.supabaseKey }, ...options?.params },
     })
   }
 
-  private _listenForAuthEvents() {
-    let data = this.auth.onAuthStateChange((event, session) => {
-      this._handleTokenChanged(event, 'CLIENT', session?.access_token)
+  protected async _listenForAuthEvents() {
+    return await this.auth.onAuthStateChange((event, session) => {
+      setTimeout(
+        async () => await this._handleTokenChanged(event, 'CLIENT', session?.access_token),
+        0
+      )
     })
-    return data
   }
 
-  private _handleTokenChanged(
+  protected async _handleTokenChanged(
     event: AuthChangeEvent,
     source: 'CLIENT' | 'STORAGE',
     token?: string
@@ -338,10 +340,16 @@ export default class SupabaseClient<
       this.changedAccessToken !== token
     ) {
       this.changedAccessToken = token
+      this.realtime.setAuth(token)
     } else if (event === 'SIGNED_OUT') {
-      this.realtime.setAuth()
-      if (source == 'STORAGE') this.auth.signOut()
-      this.changedAccessToken = undefined
+      try {
+        await this.realtime.setAuth()
+        if (source == 'STORAGE') this.auth.signOut()
+      } catch (error) {
+        console.log('Failed to set auth for realtime client:', error)
+      } finally {
+        this.changedAccessToken = undefined
+      }
     }
   }
 }