firebase.auth.Auth.signInWithCredential is deprecated. Please use firebase.auth.Auth.signInAndRetrieveDataWithCredential instead

Question

When is use this.afAuth.auth.signInWithCredential everything works great in my Ionic app. I can sign in using Google authentication and the user profile is pushed to firebase. However, I get an error in the console that signInWithCredential is deprecated and to use signInAndRetrieveDataWithCredential. The problem is that signInAndRetrieveDataWithCredential doesn't provide any user data(uid, user email, displayname)...it's all null.

So what can I do? The console error is saying not to use signInWithCredential even though it's working. signInAndRetrieveDataWithCredential returns null for the user.

  async googleLogin(): Promise<void> {
    try {

      const gplusUser = await this.gplus.login({
        'webClientId': environment.googleWebClientId,
        'offline': true,
        'scopes': 'profile email'
      });
      return await this.afAuth.auth.signInWithCredential(
        firebase.auth.GoogleAuthProvider.credential(gplusUser.idToken)
      ).then((credential) => {
        console.log('creds', credential);
        this.updateUserData(credential);
      });
    } catch (err) {
      console.log(err);
    }
  }
  
      private updateUserData(user) {
    const userRef: firebase.firestore.DocumentReference = firebase.firestore().doc(`users/${user.uid}`);

    const data: User = {
      uid: user.uid,
      email: user.email,
      displayName: user.displayName,
    };
    console.log('user data', data);
    return userRef.set(data);
  }

Answer 1

UPDATE 11 Dec. 2019

Note that the signInAndRetrieveDataWithCredential() method has been deprecated and that we need to use the signInWithCredential() method.

So, the code shall be adapted to

  return this.afAuth.auth.signInWithCredential(
    firebase.auth.GoogleAuthProvider.credential(gplusUser.idToken)
  ).then((credential) => {
    console.log('creds', credential.user);
    this.updateUserData(credential.user);
  });

---

If I correctly understand your question, I think your problem comes from the fact that the two methods return a different object:

As explained here, signInWithCredential() returns a User object,

while

As explained here, signInAndRetrieveDataWithCredential() returns a UserCredential object, which contains a User object.

So you should modify your code as follows

  ....
  return this.afAuth.auth.signInAndRetrieveDataWithCredential(
    firebase.auth.GoogleAuthProvider.credential(gplusUser.idToken)
  ).then((credential) => {
    console.log('creds', credential.user);
    this.updateUserData(credential.user);
  });

Answer 2

I just want to clarify that signInAndRetrieveDataWithCredential, and not the signInWithCredential, has been deprecated in version 6 of the Firebase JS SDK.

Furthermore the function signInWithCredential has now been updated to return a UserCredential, so you should be able to access the uid, email, etc. under the user object on the UserCredential