Firebase Auth emulator does not work after updating version to 9.6.3

Question

We have recently updated firebase to version 9.6.3 from 8.10.0 (also expo from sdk 41 to 44). After the update the app throws this error when using the auth emulator.

Uncaught FirebaseError: Firebase: Error (auth/argument-error).
at createErrorInternal (index-1679a2b2.js:475)
at _assert (index-1679a2b2.js:479)
at index-1679a2b2.js:9249
at Component.instanceFactory (index-1679a2b2.js:9264)
at Provider.getOrInitializeService (index.esm2017.js:290)
at Provider.initialize (index.esm2017.js:234)
at new Auth (index.esm2017.js:641)
at Component.instance.INTERNAL.registerComponent._firebase_component__WEBPACK_IMPORTED_MODULE_2__.Component.setServiceProps.ActionCodeInfo.Operation.EMAIL_SIGNIN [as instanceFactory] (index.esm2017.js:959)
at Provider.getOrInitializeService (index.esm2017.js:290)
at Provider.getImmediate (index.esm2017.js:128)
at FirebaseAppImpl._getService (index.esm2017.js:83)
at FirebaseAppImpl.firebaseAppImpl.<computed> [as auth] (index.esm2017.js:291)
at Object.serviceNamespace [as auth] (index.esm2017.js:275)
at Module../src/firebase/config.js (config.js:87)

The code on line 87 in config.js is firebase.auth().useEmulator("http://localhost:9099") which worked perfectly fine till the update happened. We have also changed the imports according to firebase docs. The question is, what is causing this error to occur? Thanks in advance.

Have you checked Firebase [Modular SDK](https://firebase.google.com/docs/web/modular-upgrade)'s syntax? The syntax from V9.0.0 is different than V8 or before so your existing code will not work unless you use the compat version. — Dharmaraj, Jan 24 '22 at 13:28
@Dharmaraj Yes we checked it out. We haven't tried using the modular syntax yet. We just updated our imports from `import firebase from "firebase/app"` to `import firebase from "firebase/compat/app"` . So basically we just did what is said [here](https://firebase.google.com/docs/web/modular-upgrade#update_imports_to_v9_compat). — roivasot, Jan 25 '22 at 09:49

score 0 · Answer 1 · answered Mar 25 '22 at 08:38

Make sure you use the second item in array returned by useIdTokenAuthRequest as response instead of value returned by promptAsync() because value returned by promptAsync() doesn't contain id_token

This doesn't work ❌

import React from "react";
import { TouchableOpacity, Text } from "react-native";
import { getAuth, GoogleAuthProvider, signInWithCredential } from "firebase/auth";
import * as Google from "expo-auth-session/providers/google";

export default function SignInWithGoogle() {
  const [_, __, promptAsync] = Google.useIdTokenAuthRequest({
    // your client IDs
  });

  const handleSignIn = async ()=> {
    const response = await promptAsync();
    if (response?.type === "success") {
      const { id_token } = response.params;
      const auth = getAuth();
      const credential = GoogleAuthProvider.credential(id_token);
      signInWithCredential(auth, credential);
    }
  }

  return (
    <TouchableOpacity onPress={() => handleSignIn()} >
      <Text>Sign in with Google</Text>
    </TouchableOpacity>
  );
}

This works ✅

import React, { useEffect } from "react";
import { TouchableOpacity, Text } from "react-native";
import { getAuth, GoogleAuthProvider, signInWithCredential } from "firebase/auth";
import * as Google from "expo-auth-session/providers/google";

export default function SignInWithGoogle() {
  const [_, response, promptAsync] = Google.useIdTokenAuthRequest({
    // your client IDs
  });

  useEffect(() => {
      if (response?.type === "success") {
        const { id_token } = response.params;
        const auth = getAuth();
        const credential = GoogleAuthProvider.credential(id_token);
        signInWithCredential(auth, credential);
      }
  }, [response]);

  return (
    <TouchableOpacity onPress={() => promptAsync()} >
      <Text>Sign in with Google</Text>
    </TouchableOpacity>
  );
}

Firebase Auth emulator does not work after updating version to 9.6.3

1 Answers1