auth/popup-closed-by-user error throws 7+ seconds after popup is closed

[GriffinJohnston]

Operating System

macOS Sonoma

Browser Version

Chrome 122.0.6261.112

Firebase SDK Version

10.8.1

Firebase SDK Product:

Auth

Describe your project's tooling

React app with Webpack

Describe the problem

There is an incredibly long delay after an oAuth popup is closed before the auth/popup-closed-by-user error is thrown. Consistently 7 or 8 seconds.

Steps and code to reproduce issue

1. Call signInWithPopup or reauthenticateWithPopup
2. Close the popup
3. There will be a ridiculously long delay before an error is thrown

[jbalidiong]

Hi @GriffinJohnston, thanks for the report. I was able to reproduce the behavior now. Let me check what we can do for this issue or bring someone here that can provide more context about it. I’ll update this thread if I have any information to share.

[juniorforlife]

I'm encountering the same problem. In my application, I disable a button during the user login process with signInWithPopup. However, if the user decides to close the popup, I aim to re-enable the button, but the delay in triggering the auth/popup-closed-by-user event causes the button to remain disabled for an extended period (5+ seconds).

[jeffrey-noel]

I'm encountering exactly the same problem. My project is in Vue 3 and the issue occurs in every browser I tried it (Chrome, Firefox, Safari).

[Bobberclobber]

I'm seeing the same issue for my Flutter project when running in Chrome.

[hacktisch]

I've done some research and found the part of the code that causes the long delay. A polling process checks if the popup was closed, and its timeout was increased from 2 seconds to 8 seconds in a commit on April 15th, 2023, which was then released on April 27th, 2023. This change was made to address an issue in Firefox.

• Commit: 1d6771e
• Release Notes: https://firebase.google.com/support/release-notes/js#authentication_13
• Original Issue: signInWithPopup issue with Firefox and beforeSignIn blocking function #6956

The relevant code changes can be seen here:

• Constant Definition (8000 ms):

  firebase-js-sdk/packages/auth/src/platform_browser/strategies/popup.ts

  Line 56 in f1a57d0

  AUTH_EVENT = 8000

• Polling Function:

  firebase-js-sdk/packages/auth/src/platform_browser/strategies/popup.ts

  Lines 300 to 321 in f1a57d0

  	private pollUserCancellation(): void {
  	const poll = (): void => {
  	if (this.authWindow?.window?.closed) {
  	// Make sure that there is sufficient time for whatever action to
  	// complete. The window could have closed but the sign in network
  	// call could still be in flight. This is specifically true for
  	// Firefox or if the opener is in an iframe, in which case the oauth
  	// helper closes the popup.
  	this.pollId = window.setTimeout(() => {
  	this.pollId = null;
  	this.reject(
  	_createError(this.auth, AuthErrorCode.POPUP_CLOSED_BY_USER)
  	);
  	}, _Timeout.AUTH_EVENT);
  	return;
  	}
  	this.pollId = window.setTimeout(poll, _POLL_WINDOW_CLOSE_TIMEOUT.get());
  	};
  	poll();
  	}

@prameshj, could you please have a look at this? The adjustment that was made for Firefox has significant affected the user experience. I am also including @silas, the author of the original issue to have a look at this.

I hope we can find a solution that will solve this delay while still keeping the other issue solved. Perhaps the delay could be made customizable (and we can perform a browser check to see which delay to pass). OR another 'soft reject' callback could be passed which would trigger after the original 2000ms mark, so the UI can be updated already before the final rejection takes place. (In my case, I only want to remove a loading indicator from the login button after the popup is closed)

---

For whoever needs a quick HACKY fix for this; this snippet overrides the global setTimeout function definition and changes the timeout value in case if it's 8000:

(function() {
  const originalSetTimeout = window.setTimeout;
  window.setTimeout = function(fn, delay, ...args) {
    // Check if the delay matches Firebase's _Timeout.AUTH_EVENT
    if (delay === 8000) {
      delay = 2000; 
    }
    return originalSetTimeout(fn, delay, ...args);
  };
})();

(use at your own risk)

[silas]

We gave up on using beforeSignIn (latency was too high), so I personally don't have a stake in keeping the increased timeout anymore.

If it gets reverted a warning should probably get added to beforeSignIn to mention that it won't work for Firefox users. I spent a ton of time troubleshooting this issue and it'd be a bummer if someone else had to go through the same ordeal.

Ideally the special case for Firefox could be fixed to not rely on polling/timeouts, but because I don't have access to the code, I really have no idea if that's possible.

[eggzotic]

I am also seeing this issue when using FirebaseAuth.instance.signInWithPopup whereas if using the old GoogleSignIn.signIn flow it works fine (without the long delay) - don't know if that helps to debug it?