We Keep Coding

.then((userCredential) => { } not working with firebase authentification

I am working on a web application (beginner level) and I use firebase for authentification and database. I can create a new account and register it on my firebase authentification dashboard without issue, but nothing inside .then((userCredential) => { } is working (alerts don't show up, I can't register the account on firebase database etc....
I checked on chrome console and no errors show up, and I have no error messages from .catch as well.
How can I fix this so what's inside .then is working?
Thank you!
import { initializeApp } from 'https://www.gstatic.com/firebasejs/9.15.0/firebase-app.js'
import { getAuth, createUserWithEmailAndPassword } from 'https://www.gstatic.com/firebasejs/9.15.0/firebase-auth.js'
import { getFirestore, doc, getDoc, getDocs, collection } from "https://www.gstatic.com/firebasejs/9.15.0/firebase-firestore.js";
import { getDatabase, ref, set } from "https://www.gstatic.com/firebasejs/9.15.0/firebase-database.js";
const firebaseConfig = {
apiKey: "",
authDomain: "",
databaseURL: "",
projectId: "",
storageBucket: "",
messagingSenderId: "",
appId: ""
};
const app = initializeApp(firebaseConfig);
const db = getFirestore();
const auth = getAuth();
const database = getDatabase()
submitData.addEventListener('click', (e) => {
var name = document.getElementById('full_name').value
var email = document.getElementById('email').value;
var password = document.getElementById('psw').value;
alert(email)
// do verification
// Move on with Auth
createUserWithEmailAndPassword(auth, email, password)
.then((userCredential) => {
const user = userCredential.user
alert("user created")
})
.catch(function(error) {
// Firebase will use this to alert of its errors
var error_code = error.code
var error_message = error.message
alert(error_message)
alert('not working')
})
})

If you're using form element then just use e.preventDefault() to stop page from reloading, place it before the variables.

Unable to request permission to fetch device token in javascript

I am trying to fetch my device token in javascript. I have included these imports in my HTML page:
<script src="https://www.gstatic.com/firebasejs/9.10.0/firebase-app-compat.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.10.0/firebase-database-compat.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.10.0/firebase-messaging-compat.js"></script>
My javascript:
const firebaseConfig = {
messagingSenderId: "MY SENDER ID FROM CONSOLE",
apiKey: "MY API KEY FROM CONSOLE",
authDomain: "domain_name.firebaseapp.com",
projectId: "domain_name",
storageBucket: "domain_name.appspot.com",
messagingSenderId: "01234643924812",
databaseURL: "https://domain_name-default-rtdb.firebaseio.com",
appId: "1:1230535236326:web:f0fc4f32t23t235122e112c800"
};
const app = firebase.initializeApp(firebaseConfig);
(async()=>{
try {
await firebase.messaging().requestPermission();
const token = await messaging.getToken();
console.log('Your token is:', token);
return token;
} catch (error) {
console.error(error);
}
})();
When I execute the code, I get this error:
TypeError: firebase.messaging(...).requestPermission is not a function
What am I doing wrong?

Unable to know when the sign in complete and get the user info in Firebase Auth web

I am trying to add Google sign-in to my web application. I am able to open the redirect window for the popup, but am unable to know when the sign in is complete and get the user info. This is my code:
import {initializeApp} from "https://www.gstatic.com/firebasejs/9.9.2/firebase-app.js";
import { getAuth,GoogleAuthProvider,signInWithRedirect,getRedirectResult } from "https://www.gstatic.com/firebasejs/9.9.2/firebase-auth.js";
const firebaseConfig = {
apiKey: "...",
authDomain: "...",
projectId: "...",
storageBucket: "...",
messagingSenderId: "...",
appId: "...",
};
const app = initializeApp(firebaseConfig)
const auth = getAuth(app);
const provider = new GoogleAuthProvider(app);
document.getElementById("sign-in").onclick = function() {
getAuth().useDeviceLanguage()
signInWithRedirect(auth, provider)
getRedirectResult(auth)
.then((result) => {
// This gives you a Google Access Token. You can use it to access Google APIs.
const credential = GoogleAuthProvider.credentialFromResult(result);
const token = credential.accessToken;
// The signed-in user info.
const user = result.user;
console.log(user)
})
.catch((error) => {
// Handle Errors here.
const errorCode = error.code;
const errorMessage = error.message;
// The email of the user's account used.
const email = error.customData.email;
// The AuthCredential type that was used.
const credential = GoogleAuthProvider.credentialFromError(error);
// ...
});
}

Firebase Auth to sign-in google not working in Framework7

I have setup Firebase admin structure and generate all required id, key and token. With Firebase email and password auth it works fine. But when implementing Google signin it fails. Please help.
index.html code
`<i class="icon fab fa-google-plus-g"></i>`
<script src="js/firebase.js"></script>
<script src="js/firebase-auth.js"></script>
<script>
// Initialize Firebase
var configfirebase = {
apiKey: "***********************",
authDomain: "*****************.firebaseapp.com",
databaseURL: "https://f*************.firebaseio.com",
projectId: "************",
storageBucket: "************",
messagingSenderId: "**********",
};
firebase.initializeApp(configfirebase);
</script>
registration.js code
var provider = new firebase.auth.GoogleAuthProvider();
function firebaselogin() {
firebase.auth().signInWithRedirect(provider).then(function() {
return firebase.auth().getRedirectResult();
}).then(function(result) {
var token = result.credential.accessToken;
var user = result.user;
app.dialog.alert('Login success!! Welcome:' + result.user );
}).catch(function(error) {
var errorCode = error.code;
var errorMessage = error.message;
app.dialog.alert('Login error!! error:' + errorMessage );
});
}
When I run the app I get this error.

I have fixed that issue by just placing the firebase-app js to top.

Signing out using Firebase

I am using firebase authentication using social media accounts. After signing up, I am unable to log out.
The following is my Javascript code:
<script src="https://www.gstatic.com/firebasejs/4.1.3/firebase.js"></script>
<script>
// Initialize Firebase
var config = {
apiKey: "*******",
authDomain: "******",
databaseURL: "******",
projectId: "*******",
storageBucket: "******",
messagingSenderId: "*******"
};
firebase.initializeApp(config);
firebase.auth().onAuthStateChanged(function(user) {
if (user) {
// User is signed in.
var displayName = user.displayName;
var email = user.email;
var photoURL = user.photoURL;
user.getToken().then(function(accessToken) {
console.debug('user', user);
document.getElementById('sign-in-status').textContent = 'Signed in';
document.getElementById('name').textContent = JSON.stringify( displayName )
document.getElementById('email').textContent = JSON.stringify(email)
document.getElementById('account-details').textContent = JSON.stringify({
displayName: displayName,
email: email,
photoURL: photoURL
});
});
} else {
console.log('not logged in');
/*document.getElementById('sign-in-status').textContent = 'Signed out';
document.getElementById('sign-in').textContent = 'Sign in';
document.getElementById('account-details').textContent = 'null';
*/
}
});
// User is signed out.
firebase.auth().signOut().then(function() {
// Sign-out successful.
signOutSuccessUrl: 'https://url.html'
}).catch(function(error) {
// An error happened.
});
</script>
And in the html I am calling it by:
<button class="btn btn-primary" onclick="signOut()"><i class="fa fa-sign-out">/i> Log out</button>
But on clicking the button nothing happens.
I even tried putting the signout segment in a function, but that didn't help.
Any kind of help would be greatly appreciated. Thanks.

if your click event handler calls a signOut method, then you have to define it somewhere. like:
window.signOut = function signOut(_e) {
firebase.auth().signOut().then(function() {
// Sign-out successful.
}).catch(function(error) {
// An error happened.
});
}