CODEWITHSUNDEEP
firebasevue.jsfirebase-authentication
Nogdev
Nogdev

Reputation: 59

How do I fix the bug: "TypeError: firebase.auth.sendPasswordResetEmail is not a function" in a Vue app with Firebase?

I'm using Vue to create a sign-up/sign-in page by implementing Firebase's client-side authentication system. I've already enabled the email authentication in my Firebase console, and the implementation of signing a user up was a success. However, for some reason, the function firebase.auth.sendPasswordResetEmail() is giving the error TypeError: firebase.auth.sendPasswordResetEmail is not a function in the console. The email I'm using is already present in the Firebase's Users data. The code is from a separate Forgot Your Password page, where I've already imported the relevant JavaScript files (firebase-auth.js, firebase-app.js, and vue.js).

Here's the code I've written:

<section class="columns" id="content">
    <div class="column content">
        <form @submit.prevent="sendPasswordResetEmail">
            <p>Please enter your e-mail if you've forgotten your password:</p>
            <input type="email" name="email" v-model="email"><br /><br />
            <button type="submit">Submit</button>
        </form>
    </div>
</section>

<script>
const config = {
//Removed the values from config.
    apiKey: "",
    authDomain: "",
    databaseURL: "",
    projectId: "",
    storageBucket: "",
    messagingSenderId: ""
};
firebase.initializeApp(config);

new Vue({
    el: '#content',
      data: {
        email: '',
    },

    methods: {
        sendPasswordResetEmail () {
            firebase.auth.sendPasswordResetEmail(this.email);
        },
    },
})
</script>

In addition to the error mentioned in the question, there's another error which shows up, which is [Vue warn]: Error in v-on handler: "TypeError: firebase.auth.sendPasswordResetEmail is not a function". I'm not sure what that means though.

P.S.: I've used Bulma for styling purposes, so the columns and column classes are from there, in case anyone was curious.

Upvotes: 0

Views: 1380

Answers (1)

Nogdev
Nogdev

Reputation: 59

Silly me. I forgot a pair of braces in the function I was calling. As André Kool pointed out in the comments, it was supposed to be firebase.auth().sendPasswordResetEmail(this.email);. I missed the parentheses after auth. Thanks again Mr. André. I ought to up my copy-paste game up one notch.

Upvotes: 3

Related Questions