Signup form the profile update after creating user auth is not working Firebase

Viewed 69

I have a form for singup that was saving the name of the user including a photoURL, extra. Today for some reason is not working anymore the Name saving, at least when i extract the data with firebase CLI I cannot see it. Please see the code below:

I tried to change the logic, also notice the user is not entering to the second then

<div class="login-page">
    <div class="form">
      <form class="register-form" id="register-form">
        <input type="text" id="displayName" name="displayName" placeholder="name"/>
        <input type="text" id="token" name="phoneNumber" placeholder="token"/>
        <input type="password" id="password"name="password" placeholder="password"/>
        <input type="text" id="email" name="email" placeholder="email address"/>
        <button type="button" onclick="registerPasswordUser();">register</button>
        
      </form>

    </div>
  </div>


<script>
  // Your web app's Firebase configuration
  var firebaseConfig = {
    apiKey: "",
    authDomain: "",
    projectId: "",
    storageBucket: "",
    messagingSenderId: "",
    appId: ""
  };
 
  firebase.initializeApp(firebaseConfig);

  const auth = firebase.auth();

  function registerPasswordUser(){
    var form = document.getElementById("register-form");

    var email = document.getElementById("email").value;
    var displayName = document.getElementById("displayName").value;
    var password = document.getElementById("password").value;
    var photoURL = document.getElementById("token").value;

    var user = null;

    auth.createUserWithEmailAndPassword(email, password)
    .then(function () {
      if (auth && auth.currentUser) {
        user = auth.currentUser;
        console.log('auth', auth);
        console.log('currentUser', auth.currentUser);
        user.sendEmailVerification();
      }
    })
    .then(function () {
      user.updateProfile({
        displayName: displayName,
        photoURL: photoURL
      });
      form.reset();
      document.getElementById("email").value = "";
      document.getElementById("displayName").value = "";
      document.getElementById("password").value = "";
      document.getElementById("token").value = "";
      location.reload();
    })
    .catch(function(error) {
      console.log(error.message,7000);
    });
   
  }
</script>

Also not getting any error on the console and the email and the password are being created properly. At least that what I can see in the console. Do you have any idea?

*** UPDATE ***

To update my question, I just realize that this works on IE, where is saving the Name of the user, if I use another browser, just don't simple works, and as mentioned before, don't get any error and save well the email and password.

1 Answers

This code here won't work as expected:

auth.createUserWithEmailAndPassword(email, password)
    .then(function () {
      if (auth && auth.currentUser) {
        user = auth.currentUser;
        console.log('auth', auth);
        console.log('currentUser', auth.currentUser);
        user.sendEmailVerification();
      }
    })

The auth.currentUser won't have the user as you expect it to have even if you use an async call. You can either use the value you get in your then function like here:

firebase.auth().createUserWithEmailAndPassword(email, password)
  .then((userCredential) => {
    // Signed in 
    var user = userCredential.user;
    // ...
  })
  .catch((error) => {
    var errorCode = error.code;
    var errorMessage = error.message;
    // ..
  });

Or make the sync everytime the user changes using this kind of code:

firebase.auth().onAuthStateChanged((user) => {
  if (user) {
    // User is signed in, see docs for a list of available properties
    // https://firebase.google.com/docs/reference/js/firebase.User
    var uid = user.uid;
    // ...
  } else {
    // User is signed out
    // ...
  }
});
Related