FirebaseError: Function DocumentReference.set() called with invalid data. Unsupported field value: undefined (found in field nombre)

Question

Following code works to create a new user in Firebase but It gives below error in browser, Could you help me to understand why?

Function DocumentReference.set() called with invalid data. Unsupported field value: undefined (found in field nombre)

Code:

export class AuthService {

  private userSubscription: Subscription = new Subscription();

  constructor(private afAuth: AngularFireAuth,
    private router: Router,
    private afDB: AngularFirestore,
    private store: Store<AppState>) { }

initAuthListener() {

    this.afAuth.authState.subscribe((fbUser: firebase.User) => {
      if (fbUser) {
        this.userSubscription = this.afDB.doc(`${fbUser.uid}/usuario`).valueChanges()
          .subscribe((usuarioObj: any) => {

            const newUser = new User(usuarioObj)

            this.store.dispatch(new SetUserAction(newUser))

          })
      } else {
        this.userSubscription.unsubscribe()
      }
    })
  }

  createUser(nombre: string, email: string, password: string) {

    this.store.dispatch(new ActivarLoadingAction())

    this.afAuth.auth
      .createUserWithEmailAndPassword(email, password)
      .then(resp => {


        const user: User = {
          uid: resp.user.uid,
          nombre: nombre,
          email: resp.user.email
        }

        this.afDB.doc(`${user.uid}/usuario`)
          .set(user)
          .then(() => {

            this.router.navigate(['/'])
            this.store.dispatch(new DesactivarLoadingAction())
          })


      })
      .catch(erro => {
        console.error(erro)
        this.store.dispatch(new DesactivarLoadingAction())
        Swal.fire('Error!', erro.message, 'error')
      })
  }


}

Answer 1

The error message is telling you that the field called "nombre" has the JavaScript value undefined at the time you attempted to add it to a Firestore document. undefined is not a valid value for Firestore document field values.

The error is specifically referring to this code:

    const user: User = {
      uid: resp.user.uid,
      nombre: nombre,
      email: resp.user.email
    }

    this.afDB.doc(`${user.uid}/usuario`)
      .set(user)

To fix this, you should ensure that either:

1. nombre is has a value that is not undefined
2. or remove it from the object that you're adding