new beforeAuthStateChanged's onAbort doesn't work

[marcusx2]

<script type="module">
		import { initializeApp, FirebaseError } from "https://www.gstatic.com/firebasejs/9.8.1/firebase-app.js";
		import { getAuth, GoogleAuthProvider, signInWithPopup } from "https://www.gstatic.com/firebasejs/9.8.1/firebase-auth.js";
		
		//your firebase config
		const firebaseConfig = {
		  
		};
		const app = initializeApp(firebaseConfig);
		const auth = getAuth(app);
		const provider = new GoogleAuthProvider();
		provider.addScope('profile');
		provider.addScope('email');
		signInWithPopup(auth, provider);
		
		auth.beforeAuthStateChanged((user) => {
		  throw new Error('stop sign in 1');
		}, () => {
			console.log("beforeAuthStateChanged Abort 1");
		});
		
		auth.beforeAuthStateChanged((user) => {
		  throw new Error('stop sign in 2');
		}, () => {
			console.log("beforeAuthStateChanged Abort 2");
		});
		
		auth.onAuthStateChanged((user) => {
		  if (user) {
			console.log("after");
			const uid = user.uid;
			// ...
		  } else {
			// User is signed out
			// ...
		  }
		});
		
  </script>

the onAbort never runs. It is said about the onAbort

callback triggered if a later beforeAuthStateChanged() callback throws, allowing you to undo any side effects.

well, I called beforeAuthStateChanged twice but the onAbort was never called.

[google-oss-bot]

I couldn't figure out how to label this issue, so I've labeled it for a human to triage. Hang tight.

[hsubox76]

On a side note, we'd recommend using beforeAuthStateChanged and onAuthStateChanged in the modular way instead of on the auth object. (beforeAuthStateChanged(auth, callback)) This won't affect the usage here.

The issue is the word "later" in the documentation. This is not an error catching function. This is intended to "undo" any side effects made by this callback if any later callback fails. The idea is that the user either wants all of the callbacks to succeed or none, and does not want a partially set state.

Example:

const app = initializeApp(firebaseConfig);
const auth = getAuth(app);

let someState = 0;

beforeAuthStateChanged(auth, (user) => {
  console.log('callback 1 success', user ? user.uid : 'no user');
  someState = 1;
}, () => {
  console.log("undo callback 1");
  someState = 0;
});

beforeAuthStateChanged(auth, (user) => {
  throw new Error('stop sign in 2');
});

onAuthStateChanged(auth, user => console.log('user', user ? user.uid : 'no user'));

signInWithPopup(auth);

If the second callback fails, onAbort allows you to reset the state you had set during the first callback.

This function was intended for a very specific use case and I wouldn't recommend trying to use it as a workaround to catch standard login errors.