Google firebase web: User authentication and database write

Question

I have just started with firebase for my webapp and here is my code and problem beneath.

<script src="https://www.gstatic.com/firebasejs/4.1.2/firebase.js"></script>
<script src="https://www.gstatic.com/firebasejs/4.1.1/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/4.1.1/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/4.1.1/firebase-database.js"></script>
<script>
    // Initialize Firebase
    var config = {
      ...
    };
    firebase.initializeApp(config);
</script>

<script>
    function handleSignUp() {
      var email = document.getElementById('email').value;
      var password = document.getElementById('password').value;
      if (email.length < 4) {
        alert('Please enter an email address.');
        return;
      }
      if (password.length < 4) {
        alert('Please enter a password.');
        return;
      }

      firebase.auth().createUserWithEmailAndPassword(email, password).catch(function(error) {
        // Handle Errors here.
        var errorCode = error.code;
        var errorMessage = error.message;
        if (errorCode == 'auth/weak-password') {
          alert('The password is too weak.');
        } else {
          alert(errorMessage);
        }
        console.log(error);        
      });
    }

    function initApp() {
      document.getElementById('quickstart-sign-up').addEventListener('click', handleSignUp, false);
    }

    window.onload = function() {
      initApp();
      firebase.auth().onAuthStateChanged(function(user) {
        if (user) {
          console.log('yes');

I want data persistence in firebase database at this step.

        } else {
          console.log('no');
        }
      });
    };

</script>

Problem is whenever I am refreshing my page, as the user is authenticated, console returns Yes (when I am adding the database push logic, data is being saved again and again whenever I am refreshing the page. I have tried moving the console.log OR database push to .onAuthStateChange to my initApp() and handleSignUp() functions as well. But to no avail.

As per firebase docs , I tried the below as well:

var user = firebase.auth().currentUser;

if (user) {
  // User is signed in.
} else {
  // No user is signed in.
}

However, this almost always returns a console.log as No. I am thinking that since it takes some time for the authentication to happen, the user check is skipping authentication and appearing as if No user is authenticated. The ask is I want the user to be signed up (and automatically logged in which happens anyway with firebase) and user details (along with additional details which I am asking the user to fill in at Sign Up) to be saved in firebase database one time only. Any pointer would be appreciated here.

Answer 1

Think I got it. The use of then (promises):

firebase.auth().createUserWithEmailAndPassword(email, password).then(function() {
        var user = firebase.auth().currentUser;
        console.log(user.email);
      }).catch(function(error)

As soon as user is created, the function will act (will do the data persistence in the database) and since it is not dependent on user auth'ed or not, along with unique emails, this step would never be repeated, hence single time data save in database. Had gone through the docs multiple times, somehow missed it. Apologies guys.