CODEWITHSUNDEEP
javascriptfirebasefirebase-authentication
YakuzaNY
YakuzaNY

Reputation: 69

Firebase.js: Authentication doesn't work as expected

I'm trying to print Success on the console whenever the user enters the right email/password. I have entered a false info and it works, but with a correct user the console nor logs the success or appends to the errors div 

 document.getElementById("login").addEventListener("click", function(){
            var email = $('#email').val();
            var password = $('#password').val();
            app.auth().signInWithEmailAndPassword(email, password).catch(function(error) {
          // Handle Errors here.
            var errorCode = error.code;
            var errorMessage = error.message;

            if (error) {
                console.log(error.message)
                  $("#errors").append('   <br><div class="uk-alert-danger" uk-alert> <a class="uk-alert-close" uk-close></a> <p>'+ error.message + '</p></div>       <br>');

            }
              $("#errors").append('   <br><div class="uk-alert-success" uk-alert> <a class="uk-alert-close" uk-close></a> <p>Login Success, Welcome</p></div>       <br>');
              console.log("success")


         });
 });

Could anyone point out what i'm doing wrong?

Upvotes: 0

Views: 95

Answers (1)

Renaud Tarnec
Renaud Tarnec

Reputation: 83191

This is because you try to detect a success in the catch() method.

Since the signInWithEmailAndPassword() method returns a Promise you should use the then() method as follows:

 document.getElementById("login").addEventListener("click", function(){
            var email = $('#email').val();
            var password = $('#password').val();
            app.auth().signInWithEmailAndPassword(email, password)
             .then(function(userCredential) {
                    console.log(userCredential.user);
                    $("#errors").append('   <br><div class="uk-alert-success" uk-alert> <a class="uk-alert-close" uk-close></a> <p>Login Success, Welcome</p></div>       <br>');
                    console.log("success")
             })
             .catch(function(error) {
             // Handle Errors here.
               var errorCode = error.code;
               var errorMessage = error.message;

               // if (error) { // Not needed anymore
                   console.log(error.message)
                    $("#errors").append('   <br><div class="uk-alert-danger" uk-alert> <a class="uk-alert-close" uk-close></a> <p>'+ error.message + '</p></div>       <br>');


         });
 });

Upvotes: 4

Related Questions