Using Firebase for auth inside Chrome Extension results in blank popup

Viewed 1489

I have a functioning Chrome Extension and I'm trying to add Firebase auth (Google & Facebook).

If I run the popup from a full browser window, I get Google and Facebook popups exactly as you'd expect.

When I click to open the popup, then choose Google or Facebook login, I get an About:blank popup (sometimes it stays open, sometimes it flashes and disappears).

The strangest thing: If I open the popup by clicking on the Extension icon, then right-click to expose Dev Tools and keep the console open on the popup, then click Google or Facebook, the popup opens as you'd expect and I can log in.

Manifest below...I tried to match the detailed example from Firebase (https://github.com/firebase/quickstart-js/tree/master/auth/chromextension).

Any thoughts or directions to troubleshoot?

{

"manifest_version": 2,

"name": "Annotate PRO for Chrome",
"short_name": "Annotate PRO",
"description": "Right-click access to a pre-written library of comments. Write it once, to perfection, and reuse forever!",
"version": "3.1.1.0",

"permissions": [
    "identity",
    "identity.email",
    "clipboardWrite",
    "clipboardRead",
    "activeTab",
    "tabs",
    "contextMenus",
    "storage",
    "webNavigation"
],

"content_security_policy": "script-src 'self' https://ssl.google-analytics.com; object-src 'self'",

"externally_connectable": {
    "matches": ["http://*.11trees.com/*"]},

    "commands": {
      "_execute_browser_action": {
        "suggested_key": {
          "windows": "Alt+A",
          "mac": "Alt+A",
          "chromeos": "Alt+A",
          "linux": "Alt+A"
        }
      }
    },

"key": "XXXX",

"oauth2": {
    "client_id": "XXXX",
    "scopes": [
      /*"https://www.googleapis.com/auth/chromewebstore.readonly",*/
            "https://www.googleapis.com/auth/userinfo.email",
        "https://www.googleapis.com/auth/userinfo.profile"
      ]
  },

"background": {
    "scripts": ["/dscripts/jquery-3.1.1.min.js","/scripts/background.js"]},


"content_security_policy": "script-src 'self' https://ssl.google-analytics.com https://apis.google.com/ https://www.gstatic.com/ https://*.firebaseio.com https://www.googleapis.com; object-src 'self'",

"content_scripts": [
    {
    "all_frames" : true,
    "matches": ["http://*/*","https://*/*"],
    "js": ["/scripts/content.js"]
    }
],

"web_accessible_resources": ["/scripts/insertcomment.js"],

 "icons": {
          "16": "Annotate16.png",
          "48": "Annotate48.png",
          "128": "Annotate128.png"
        },

"browser_action": {
    "default_icon": {
        "19": "Annotate128.png",
        "38": "Annotate128.png"
    },
    "default_title": "Annotate PRO for Google Chrome",
    "default_popup": "aHome.html"
}

}
1 Answers
Related