title: Why ``firebase.firestore.FieldValue.serverTimestamp()`` generates firestore timestamp after some delay?
body: <p>I am working on a chat application. When I send my chat message I need to make some some transactions.</p>
  <p>Here is the code:</p>
  <pre><code>const handleSubmit = (e) =&gt; {
      e.preventDefault();
  
      document.getElementById('chat').value = '';
  
      if (message.length &gt; 0) {
  
        let mergedId = loggedUserId + toBeContactedUserId;
  
        let loggedUserRef = db.collection('users').doc(loggedUserId);
        let toBeContactedUserRef = db.collection('users').doc(toBeContactedUserId);
        let messageDbRef = db.collection('messages').doc();
  
        db.runTransaction((transaction) =&gt; {
  
          const p1 = transaction.get(loggedUserRef)
            .then(userDoc =&gt; {
               //Some operation occurs
            })
  
          const p2 = transaction.get(toBeContactedUserRef)
            .then(userDoc =&gt; {
              //Some operation occurs
            })
  
          const p3 = transaction.get(messageDbRef)
            .then(msgDoc =&gt; {
              messageDbRef.set({
                from: loggedUserId,
                to: toBeContactedUserId,
                content: message,
                reaction: false,
                image: false,
                file: false,
                filename: '',
                seen: false,
                searchId: mergedId,
                time: firebase.firestore.FieldValue.serverTimestamp()
              })
            })
  
          return Promise.all([p1, p2, p3]);
  
        })
          .then(res =&gt; {
            console.log(res);
          })
          .catch(err =&gt; {
            console.log(err);
          })
      }
    }
  
  </code></pre>
  <p>The third transaction is where the new message is stored in the database. Here I am using
  <code>firebase.firestore.FieldValue.serverTimestamp()</code> to generate firestore timestamp object.</p>
  <p>In a normal run the message added should be displayed on the screen(as I am using real-time firestore updation). Also I am using <code>moment(msgTime.toDate()).format('MM-DD-YYYY')</code> to show the date and time when the message was sent.[msgTime is the firestore timestamp of every single message]</p>
  <p>But in real as soon as I press on the send button I get the error as <code>Cannot read properties of null (reading 'toDate')</code></p>
  <p>I tried to console through the message array through which I am looping in the jsx.</p>
  <p>Here is what I see:</p>
  <p><a href="https://i.stack.imgur.com/A9rAE.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/A9rAE.png" alt="enter image description here" /></a></p>
  <p>The new message generated is showing <code>time</code> as <code>null</code>. But when I reload the page everything works well.</p>
  <p>Please guide why there is a such a delay that is causing my application to break. Let me know if more information is required.</p>