[expo-auth-session] Get error when launching the remote debug (Calling synchronous methods ...)

Summary

When I want to use the expo-auth-session module I always get the following error when I enable the remote debugger:

Invariant Violation: Calling synchronous methods on native modules is not supported in Chrome. Consider providing alternative methods to expose this method in debug mode, e.g. by exposing constants ahead-of-time.

Managed or bare workflow? If you have ios/ or android/ directories in your project, the answer is bare!

managed

What platform(s) does this occur on?

Android, iOS

SDK Version (managed workflow only)

~41.0.1

Environment

Expo CLI 4.5.2 environment info: System: OS: macOS 12.0 Shell: 5.8 - /bin/zsh Binaries: Node: 15.9.0 - /usr/local/bin/node npm: 7.7.6 - /usr/local/bin/npm Managers: CocoaPods: 1.10.1 - /usr/local/bin/pod SDKs: iOS SDK: Platforms: iOS 14.5, DriverKit 20.4, macOS 11.3, tvOS 14.5, watchOS 7.4 IDEs: Android Studio: 4.2 AI-202.7660.26.42.7351085 Xcode: 12.5/12E262 - /usr/bin/xcodebuild npmPackages: expo: ~41.0.1 => 41.0.1 react: 16.13.1 => 16.13.1 react-dom: 16.13.1 => 16.13.1 react-native: https://github.com/expo/react-native/archive/sdk-41.0.0.tar.gz => 0.63.2 react-native-web: ~0.13.12 => 0.13.18 npmGlobalPackages: expo-cli: 4.5.2 Expo Workflow: managed

Reproducible demo or steps to reproduce from a blank project

insert this code crash the app with remote debug enabled:

import React from "react";
import { StyleSheet, Text, View } from "react-native";

import * as Google from "expo-auth-session/providers/google";
import * as WebBrowser from "expo-web-browser";
WebBrowser.maybeCompleteAuthSession();

export default function App() {
  const [request, response, promptAsync] = Google.useAuthRequest({
    expoClientId:"GOOGLE_GUID.apps.googleusercontent.com",
    iosClientId: "GOOGLE_GUID.apps.googleusercontent.com",
    androidClientId: "GOOGLE_GUID.apps.googleusercontent.com",
    webClientId: "GOOGLE_GUID.apps.googleusercontent.com",
  });

  return (
    <View style={styles.container}>
      <Text>Open up App.tsx to start working on your app!</Text>
      <StatusBar style="auto" />
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: "#fff",
    alignItems: "center",
    justifyContent: "center",
  },
});```

[brentvatne]

expo install gives you the version of the package that is compatible with the expo sdk version that you are using. if you need to use a more recent version, consider upgrading the sdk version

[odama626]

looks like this is related https://github.com/expo/expo/issues/12712 looks like a fix was recently merged as well for it, just waiting for a newer version of expo-random https://github.com/expo/expo/pull/13616