Givenname and Familyname claims are missing in firebase idtoken

I am trying to use Firebase to implement google login for our web application. here is what I have done to get the idtoken :

  const google_provider = new GoogleAuthProvider();
  google_provider.addScope("openid");
  google_provider.addScope("profile");
  google_provider.addScope("email");
  signInWithPopup(auth, google_provider).then((result) =>
    result.user.getIdToken());

Although I have added the profile scope still I can not get the givenname and familyname claims in the idtoken ( email , picture and name are avialable)

(I have tried directly to use Google login and there I could see all the profile claims)

What did I miss here ? Did I do something wrong ?

Answer

Firebase ID Token returned by getIdToken() doesn’t contain user’s Google account information that you are looking for (expect name, profile image, etc). You should use the access code retrieved from sign in result to make request to Google API to get it.

signInWithPopup(auth, provider)
  .then(async (result) => {
    // This gives you a Google Access Token. You can use it to access the Google API.
    const credential = GoogleAuthProvider.credentialFromResult(result);
    const token = credential.accessToken;

    const response = await fetch('https://www.googleapis.com/oauth2/v1/userinfo', {
      headers: {
        Authorization: `Bearer ${token}`
      }
    })

    const data = await response.json();
    console.log(data);
  })