title: Function DocumentReference.set() called with invalid data. Unsupported field value: undefined (found in field firstName)
body: <p>Hello im sitting here with a project i cannot find the error or what iam doing wrong.</p>
  
  <p>Iam using angular 6 and firebase/firestore </p>
  
  <p>My problem is when i want to create a user with email and password it works fine but i then added more fields like firstname, lastname and so on.</p>
  
  <pre><code>Auth.service.ts
  </code></pre>
  
  <p>My auth service have the interface and the to functions showed below here. i tested the creating user with only email and password and that worked fine.</p>
  
  <p>in my firebase i have activated the auth with email/password and i created a collection users with a document users and added all the fields firstName, 
  lastName and so on.</p>
  
  <pre><code>interface User {
  uid: string;
  email?: string;
  photoURL?: string;
  displayName?: string;
  firstName?: string;
  lastName?: string;
  address?: string;
  zipCode?: string;
  city?: string;
  phoneNumber?: string;
  
  }
  
  
  emailSignUp(email: string, password: string) {
  return this.afAuth.auth
    .createUserWithEmailAndPassword(email, password)
    .then(credential =&gt; {
      this.notify.update('Welcome new user!', 'success');
      return this.updateUserData(credential.user); // if using firestore
    })
    .catch(error =&gt; this.handleError(error));
  </code></pre>
  
  <p>}</p>
  
  <pre><code>  private updateUserData(user) {
  // Sets user data to firestore on login
  
  const userRef: AngularFirestoreDocument&lt;any&gt; = 
  this.afs.doc(`users/${user.uid}`);
  
  const data: User = {
    uid: user.uid,
    email: user.email,
    displayName: user.displayName,
    photoURL: user.photoURL,
    firstName: user.firstName,
    lastName: user.lastName,
    address: user.address,
    zipCode: user.zipCode,
    city: user.city,
    phoneNumber: user.phoneNumber
  }
  
  return userRef.set(data, { merge: true })
  </code></pre>
  
  <p>}</p>
  
  <pre><code> User-form.component.html
  </code></pre>
  
  <p>This is my component where i have my form for creating a new user.</p>
  
  <pre><code> &lt;form [formGroup]="userForm" *ngIf="newUser" (ngSubmit)="signup()"&gt;
      &lt;h1&gt;Log ind / Opret ny profil&lt;/h1&gt;
      &lt;br&gt;
  
  &lt;h3&gt;Har du allerede en bruger så tryk på log ind&lt;/h3&gt;
  &lt;p class="btn btn-primary" (click)="toggleForm()"&gt;Log ind&lt;/p&gt;
  
  &lt;h3&gt;Opret ny profil&lt;/h3&gt;
  &lt;!--&lt;p class="button is-small" (click)="toggleForm()"&gt;Already Registered? 
  &lt;/p&gt;--&gt;
  &lt;hr&gt;
  
  &lt;label for="firstName"&gt;Fornavn&lt;/label&gt;
  &lt;input type="text" class="input" formControlName="firstName" 
  name="firstName" required &gt;
  
  &lt;label for="lastName"&gt;Efternavn&lt;/label&gt;
  &lt;input type="text" class="input" formControlName="lastName" name="lastName" 
  required&gt;
  
  &lt;label for="telefonnummer"&gt;Telefonnummer&lt;/label&gt;
  &lt;input type="tel" class="input" formControlName="phoneNumber" 
  name="telefonnummer" required&gt;
  
  &lt;label for="adresse"&gt;Adresse&lt;/label&gt;
  &lt;input type="text" class="input" formControlName="address" name="adresse" 
  required&gt;
  
  &lt;label for="postnummer"&gt;Postnummer&lt;/label&gt;
  &lt;input type="number" class="input" formControlName="zipCode" 
  name="postnummer" required&gt;
  
  &lt;label for="by"&gt;By&lt;/label&gt;
  &lt;input type="text" class="input" formControlName="city" name="by" required&gt;
  
  &lt;label for="email"&gt;Email&lt;/label&gt;
  &lt;input type="email" class="input" formControlName="email" name="email" 
  required autocomplete="new-password"&gt;
  
  &lt;div *ngIf="formErrors.email" class="notification is-danger"&gt;
      {{ formErrors.email }}
  &lt;/div&gt;
  
  &lt;label for="password"&gt;Password&lt;/label&gt;
  &lt;input type="password" class="input" formControlName="password" 
  name="password" required&gt;
  
  &lt;div *ngIf="formErrors.password" class="notification is-danger"&gt;
      {{ formErrors.password }}
  &lt;/div&gt;
  
  &lt;!--
  &lt;label&gt;
      &lt;input type="checkbox" class="checkbox" required&gt;Service &amp; Betingelser
  &lt;/label&gt;
  --&gt;
  
  &lt;div *ngIf="userForm.valid" class="notification is-success"&gt;Form is 
  valid&lt;/div&gt;
  &lt;button type="submit" class="btn btn-primary" 
  [disabled]="!userForm.valid"&gt;Opret Profil&lt;/button&gt;
  
  &lt;/form&gt;
  </code></pre>