react firebase auth displayName return null

Question

Im trying to do firebase auth in conformity with google documentation. After user is registered he is redirecting to '/' path, then im getting user display name by onAuthStateChangedListener but it return null, although im checking full user data file and contains displayName field.

auth code

firebase
          .auth()
          .createUserWithEmailAndPassword(email, password)
          .then((result) => {
            result.user
              .updateProfile({
                displayName: nickname,
              })

getting user data code

firebase.auth().onAuthStateChanged((data) => {
      if (data) setUser(data);
      console.log(data);
    });

screen with contains display name

Answer 1

This is the expected behavior: the auth state changes on .createUserWithEmailAndPassword(email, password) . Once that happened, the call to result.user.updateProfile(...) does not change the authentication state, so does not cause the auth state change listener to be called again.

If you want to ensure you have the latest auth profile, refresh the ID token after updating the profile by calling user.getIdToken(true) or user.reload() . But neither of these will cause an auth state change, so they won't cause calls to your auth state change handler either.

Instead: get the current user after these calls with firebase.auth().currentUser, and pass that to setUser()`.