After switching tabs, useSupabaseClient methods stop working and don't return

[ErwinAI]

It seems like things stop working if you tab away or come back to the page moments later. Ive tried this both with retrieving from the Supabase db and auth and for both no promise is returned and it essentially gets stuck. Reproduction below is for the signOut (easiest of the two to reproduce).

This makes this module and supabase as a whole unusable for my app and prevents me from going to production.

Version

@nuxtjs/supabase: v1.1.0 (latest) nuxt: v3.7.3 (latest)

Reproduction

const supabase = useSupabaseClient()
const signOut = async () => {
  const user = useSupabaseUser()

  console.log(user) // does log

  console.log(supabase) // does log

  const { error } = await supabase.auth.signOut()
  
  // no code is executed after this

  if(error) {

    console.log(error)

  } else {
    console.log('redirecting..')

    navigateTo('/account/login')
  }
}

This results in two console logs (see code comments):

Steps to reproduce

Login and switch tabs (perhaps wait for a bit or tab in/out of browser), then activate signOut function in the code above to sign out and notice that no redirection is happening and no log is shown in the console after the signOut function. It seems as if the promise is never returned?

What is Expected?

That either an error is returned, or a fulfilled promise with error: null as per the documentation so that navigateTo is activated (see code above)

What is actually happening?

The user is NOT logged out (reloading the page and checking the user still returns an authenticated user object) and no promise is returned.

[ErwinAI]

Additional information: No network requests are visible either, and I'm using Supabase cloud, not local-hosted.

When checking what supabase.auth.signOut() returns, it's a pending promise. And it never resolves.

[ErwinAI]

This issue (https://github.com/nuxt-modules/supabase/issues/220) is exactly the issue I'm running into. But it mentions that it was fixed in a previous version. How come I'm experiencing this again now 🤔

[ErwinAI]

Adding this to my package.json seems to work. Was supposed to be fixed in 1.0.1 though 🤔?

"overrides": {
  "@supabase/supabase-js": "2.31.0",
  "@supabase/gotrue-js": "2.43.1"
},

[lammerfalcon]

i have the same issue, after change tabs, or lose window focus and then go back and try do any request - nothing happens how can i fix this bug?

[lammerfalcon]

Adding this to my package.json seems to work. Was supposed to be fixed in 1.0.1 though 🤔?

"overrides": {
  "@supabase/supabase-js": "2.31.0",
  "@supabase/gotrue-js": "2.43.1"
},

this solution doesent work for me(

[ErwinAI]

The overriding of the packages is what ended up working for me. Try to remove your package-lock.json file and run npm i again.

If that still doesn't fix it, perhaps you're running into a different bug.

[Scion24]

Same problem exactly. Forcing those versions for gotrue-js and supabase-js fixed the problem as well.

[nosizejosh]

Same issue with these versions, using yarn on windows.

"@nuxtjs/supabase": "^1.1.4",
"nuxt": "^3.8.2",

Only way to get it to work was to add

"resolutions": {
    "@supabase/gotrue-js": "2.43.1"
  }

to my package.json file.

is there an update that really fixes this issue so we can be in sync?

[nosizejosh]

This issue seem to be resolved after updating to 1.1.6 and removing the resolution. Can someone confirm this?

[arthurmeb]

This issue seem to be resolved after updating to 1.1.6 and removing the resolution. Can someone confirm this?

Is there a 1.1.6 version out? Changelog says the latest release was 1.1.5 on December 8th. I'm currently facing this issue

[ScreamZ]

I can confirm that onAuthStateChange is called when changing tabs back to the one where supabase lives

Therefore the code must be nonblocking like this or within a setTimeout if there is a call to any supabase function within this callback.

See this commit : https://github.com/supabase/supabase/pull/19902/files about deadlocks

setTimeout(() => { 
// here 
}, 0);

Or

const {
    data: { subscription },
  } = supabase.auth.onAuthStateChange((_, session) => {
    authStore.setSession(session); // It must be non-blocking
  });