React Fix user.getIdToken is not a function Firebase error

My setup

I am trying to setup Firebase in a react web app. I wanted to allow users to change the email that they signed up with. The docs for firebase say it should be as simple as using the updateEmail function: https://firebase.google.com/docs/reference/js/v8/firebase.User#updateemail .

This function can be imported from the “firebase/auth” npm package:

import { updateEmail } from "firebase/auth";

I created a form on the site and saved the formData to state.

 const [formData, setFormData] = useState({
    name: auth.currentUser.displayName,
    email: auth.currentUser.email,
  });

const { name, email } = formData;

In the onSubmit for the edit form I tried to update the email with this code:

const onSubmit = async () => {
  
      if (auth.currentUser.email !== email) {
        try {
          await updateEmail(email);
          const userRef = doc(db, "users", auth.currentUser.uid);
          await updateDoc(userRef, {
            email,
          });
          console.log("email changed");
        } catch (error) {
          console.log("error :", error);
        }
};

But when this code ran I always got this error:

error : TypeError: user.getIdToken is not a function
    at updateEmailOrPassword (account_info.ts:128:1)
    at updateEmail (account_info.ts:94:1)
    at onSubmit (Profile.js:62:1)
    at onClick (Profile.js:108:1)
    at HTMLUnknownElement.callCallback (react-dom.development.js:3945:1)
    at Object.invokeGuardedCallbackDev (react-dom.development.js:3994:1)
    at invokeGuardedCallback (react-dom.development.js:4056:1)
    at invokeGuardedCallbackAndCatchFirstError (react-dom.development.js:4070:1)
    at executeDispatch (react-dom.development.js:8243:1)
    at processDispatchQueueItemsInOrder (react-dom.development.js:8275:1)

The fix

It’s quite easy. You need to pass an extra user parameter to the updateEmail function. The code changes from this:

await updateEmail(email);

To this:

const user = auth.currentUser;
await updateEmail(user, email);