Cyrus the Great
Cyrus the Great

Reputation: 5942

Chrome Extension: signInWithPopup always open under the browser

I developed a chrome extension and for auth I am using signInWithPopup on my auth.js that is hosted on my local by firebase emulators.

window.addEventListener('message', function(event) {
    debug(`Received message: ${JSON.stringify(event. Data)}`);

    if (event.data?.initAuth) {
        debug('Starting auth process');

        PROVIDER.setCustomParameters({
            prompt: 'select_account'
        });

        debug('Starting popup');
        signInWithPopup(auth, PROVIDER)
            .then(result => {
                debug(`Auth successful: ${result.user.uid}`);
                window.parent.postMessage(JSON.stringify({
                    success: true,
                    data: { user: result.user }
                }), '*');
            })
            .catch(error => {
                debug(`Auth error: ${error.message}`);
                window.parent.postMessage(JSON.stringify({
                    success: false,
                    error: {
                        code: error.code,
                        message: error.message
                    }
                }), '*');
            });
    }
}); 

I send messages from offscreen

const iframe = document.createElement('iframe');
iframe.src = FIREBASE_HOSTING_URL;
document.body.appendChild(iframe);
console.error('Iframe added to offscreen document:', iframe);

chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
    console.error('Offscreen received message:', JSON.stringify(message, null, 2));

    if (message.action === 'getAuth' && message.target === 'offscreen') {
        console.error('Attempting to initiate auth in iframe');

     ....

        window.addEventListener('message', handleIframeMessage);
        iframe.contentWindow.postMessage({initAuth: true}, FIREBASE_HOSTING_URL);
        sendResponse({ success: true });
        return false;
    }
});

but the sign-in popup always opens under chrome browser, how can I bring it on top of the browser not under?

I a using manifest v3 and my app is opened in side panel .

Upvotes: 0

Views: 22

Answers (0)

Related Questions