Can't signInWithPopup in chrome extension with manifest v3

[klapauciusisgreat]

[REQUIRED] Describe your environment

• Operating System version: MacOs
• Browser version: 94.0.4606.71
• Firebase SDK version: 9.1.2
• Firebase Product: auth

[REQUIRED] Describe the problem

When trying to signin with Google (signInWithPopup) in a Chrome extension with manifest v3 (ie in a service worker), I trigger errors, popup does not open and one cannot log in.

Steps to reproduce:

The popup script (popup.js) calls the background script via message passing and asks for login.

The background script (background.js) initializes firebase and auth and calls

       signInWithPopup(auth, provider)
	  .then((result) => {
            // ...
	  }).catch((error) => {
	      console.log("in popup error callback", error);
	  });

The specific error is in resolver.ts, line 38:

where auth._popupRedirectResolver is null.

This is after replacing

const auth = getAuth(firebaseApp);

with

const auth = initializeAuth(firebaseApp, {persistence: indexedDBLocalPersistence});

Without that, I would get a known error about missing window when initializing auth.

I suppose that this still has to do with service workers having not enough access to open a popup window. I would very much like to know if this is true, and specifically, if once manifest v2 is fully deprecated, there won't be any way to do signin with Google in chrome extensions anymore.

Relevant Code:

background.js

import { initializeApp } from 'https://www.gstatic.com/firebasejs/9.1.2/firebase-app.js';
import { initializeAuth, indexedDBLocalPersistence, onAuthStateChanged, getIdToken, signOut, GoogleAuthProvider, signInWithPopup } from "https://www.gstatic.com/firebasejs/9.1.2/firebase-auth.js";

const firebaseApp = initializeApp({
    apiKey: "xxx",
    authDomain: "xxx",
    projectId: "xxx",
    storageBucket: "xxx",
    messagingSenderId: "xxx",
    appId: "xxx",
    measurementId: "xxx"
});

const provider = new GoogleAuthProvider();
const auth = initializeAuth(firebaseApp, {persistence: indexedDBLocalPersistence});

//...

signInWithPopup(auth, provider)
	  .then((result) => {
	      console.log("in popup callback");
	  }).catch((error) => {
	      console.log("in popup error callback", error);   // <--- this gets triggered.
	  });

I realize that this maybe more of a Chrome Extension problem than a bug in firebase-auth, but my asks on crx and stackexchange have been met with stony silence. I suspect the real answer is that there is at present no way to make signInWithPopup work in MV3 at all(MV2 is working fine), and that the Crx team is not able to publicly state that Chrome extensions in the future will not have social signins (or 2FA signins). But I would very much like to know where I stand so I can plan accordingly.

Thank you very much in advance for clarifying!

[klapauciusisgreat]

I looked at the firebase-auth package and figure that if I specify to use the browserPopupRedirect, I will eventually call

async function _openIframe(auth) 

which then uses _window:

    const gapi = _window().gapi;

window isn't defined in a service worker. However, maybe I just need any window, so I wonder if I could follow the advice in
https://developer.chrome.com/docs/extensions/mv3/migrating_to_service_workers/ and just make a new window, via chrome.windows.create() or chrome.tabs.create(). The popup won't care where it displays, I figure.

Note that I'm very far from being competent in javascript or chrome extensions, so I'm really grasping for straws here.

[sam-gc]

Hi @klapauciusisgreat, thanks for reaching out. I don't have insight into Chrome's timelines/features/processes, but at a high level your initial judgement is correct. Popup sign in requires a DOM context and service workers don't provide that. As far as putting the log in in a different tab that the extension loads, I'm not sure the V3 CSP rules allow that:

In addition, MV3 disallows certain CSP modifications for extension_pages that were permitted in MV2. The script-src, object-src, and worker-src directives may only have the following values:

• self
• none
• Any localhost source, (http://localhost, http://127.0.0.1, or any port on those domains)

In order for signInWithPopup to work, the SDK needs to load code from "apis.google.com", which in Manifest V2 required CSP rules that don't work under the new policy as I understand it. I've tried getting this to work locally and sure enough I'm unable to add "https://apis.google.com" to the CSP in V3