I am using the VueCLI & Firebase (Auth & Firestore).
Essentially the function is being called properly and registers the user in the database correctly, however, the promises aren't being called (e.g. .then & .catch) on the .createUserWithEmailAndPassword function.
No error is returned and nothing is registered in the firestore, has really stumped me.
However, sometimes it works exactly as expected?? But often irregularly.
submit () {
var v = this
firebase.auth().createUserWithEmailAndPassword(v.form.email, v.form.password)
.then(function () {
// set account doc
var account = {
email: v.form.email,
name: v.form.name,
picture: v.form.picture
}
db.collection('Users').doc(v.form.email).set(account).then(() => {
console.log('Database Details Defined')
// Set user display name
v.$store.commit('setUserDisplayName', v.form.name)
// Set user display name
v.$store.commit('setUserImage', v.form.picture)
// Set user as signed in
v.$store.commit('changeLoginState', true)
// Set user email
v.$store.commit('setUserEmail', v.form.email)
// console.log('Vue Store Details Defined')
localStorage.setItem('name', v.$store.state.displayName)
localStorage.setItem('email', v.$store.state.email)
localStorage.setItem('userImage', v.$store.state.userImage)
localStorage.setItem('loggedin', v.$store.state.isLoggedin)
// console.log('Local Storage Details Defined')
// Redirect user to dashboard
v.$router.replace('/')
v.registering = false
}).catch((error) => {
v.databaseError = 'Database Error: ' + error.code + ' - ' + error.message
v.registering = false
})
})
.catch(function (error) {
v.registrationError = 'Registration Error: ' + error.code + ' - ' + error.message
v.registering = false
})
}
You have a function getDB() that returns the value the Firestore instance so getDB().collection("users")... may have worked as intended. I don't see where db is initialized in this specific file so console.log(db) might help to check what is it's value.
firebase.firestore().collection('Users').doc(v.form.email).set(account)
This worked as intended because firebase.firestore() will return the Firestore instance for sure. I'd recommend exporting Firebase services directly and not in functions. For example you could create a file firebase.js and initialize Firebase there:
var firebase = require('firebase/app')
require('firebase/firestore')
const firebaseConfig = { }
if (!firebase.apps.length) {
firebase.initializeApp(config);
}
const auth = firebase.auth()
const db = firebase.firestore()
export {db, auth}
You need to initialize Firebase only once as shown. It'll be much more clear rather than initializing in the getDB function.