Expo app breaks

[vbylen]

Bug report

Describe the bug

Expo apps that use supabase/supabase-js completely break after updating to SDK43.

To Reproduce

1. Go to https://github.com/10000multiplier/exposupabasebug
2. git clone https://github.com/10000multiplier/exposupabasebug.git
3. npm i
4. expo start

Expected behavior

Supabase-js behaves flawlessly on expo apps as it did on SDK42.

More info

The fatal error that appears after running expo start:

Invariant Violation: "main" has not been registered. This can happen if:
* Metro (the local dev server) is run from the wrong folder. Check if Metro is running, stop it and restart it in the current project.
* A module failed to load due to an error and `AppRegistry.registerComponent` wasn't called.

System information

• OS: Windows
• Version of supabase-js: ^1.25.2
• Version of Node.js: 16.13.0

[vbylen]

@kiwicopple

please help 😅

[ChronSyn]

Of relevance, when running this example, this error shows up as well:

TypeError: undefined is not an object (evaluating 'window.location.href')
at node_modules\react-native\Libraries\LogBox\LogBox.js:149:8 in registerError
at node_modules\react-native\Libraries\LogBox\LogBox.js:60:8 in errorImpl
at node_modules\react-native\Libraries\LogBox\LogBox.js:34:4 in console.error
at node_modules\expo\build\environment\react-native-logs.fx.js:27:4 in error
at node_modules\react-native\Libraries\Core\ExceptionsManager.js:104:6 in reportException
at node_modules\react-native\Libraries\Core\ExceptionsManager.js:172:19 in handleException
at node_modules\react-native\Libraries\Core\setUpErrorHandling.js:24:6 in handleError
at node_modules\@react-native\polyfills\error-guard.js:49:36 in ErrorUtils.reportFatalError
at node_modules\metro-runtime\src\polyfills\require.js:204:6 in guardedLoadModule
at http://192.168.1.10:19000/node_modules%5Cexpo%5CAppEntry.bundle?platform=android&dev=true&hot=false&minify=false:168062:3 in global code

I've just tested in one of my in-development projects, and can confirm that the same issue exists. The error shown on screen seems to point towards the getParameterByName function in gotrue-js: https://github.com/supabase/gotrue-js/blob/master/src/lib/helpers.ts#L16

Edit - 04:50 UK time: Checked for issues in the main expo repo and haven't found any reports related to href not being defined. Realistically, window doesn't exist in React Native, but it doesn't explain why this issue didn't exist until recently. This issue doesn't happen when running on Web, and only happens when running the native app.

[ChronSyn]

As an update, it appears that adding detectSessionInUrl: false into the options of createClient resolves this issue. This certainly seems to be a new change compared to last time I tried it in a native context, and I'm not sure if this affects other functionality of using Supabase in Expo.

Example:

export const supabaseClient = createClient(
  my.supabase.url,
  my_supabase_key,
  {
    localStorage: AsyncStorage as any,
    autoRefreshToken: true,
    persistSession: true,
    detectSessionInUrl: false,
  }
);

[Hannes1]

@10000multiplier to be honest not sure how the app is working without index file and you're not using the polyfill anywhere?

[vbylen]

@hannes1

Added the polyfill on top of App.tsx and still gives the same error.

How would you add an index file?

[vbylen]

@ChronSyn setting detectSessionInUrl to false seems to work indeed. Thank you sir for your glorious tip.

[HassanIyan]

after setting detectSessionInUrl to false will supabase.auth.onAuthStateChange() work?? because after setting detectSessionInUrl to false for me it is not returning any thing for me...

[davitykale]

@HassanIyan I am having the same issue

[etherealsunshine]

hi, setting detectSessionInUrl: false does not cause any difference, any potential workarounds?

[soedirgo]

Afaict this specific issue should be fixed in https://github.com/supabase/gotrue-js/pull/153.

If folks are still having this issue, please create another issue as it might be caused by something else.