Expose logged-in state to ghosterysearch page via content-script.

src/background.js

@@ -9,6 +9,7 @@ class AccessToken {
     }
     AccessToken.TOKEN = value;
     tokenPool.generateTokens();
+    injectLoggedInStatus(!!AccessToken.TOKEN);
   }
 
   static get() {
@@ -31,6 +32,7 @@ class AccessToken {
   static destroy() {
     console.warn("ACCESS_TOKEN removed")
     AccessToken.TOKEN = null;
+    injectLoggedInStatus(false);
   }
 
   static async refresh() {
@@ -113,32 +115,6 @@ async function start() {
       requestHeaders,
     };
   }, { urls: [`${SERP_BASE_URL}/search*`]}, ["blocking", "requestHeaders"]);
-
-  browser.webRequest.onBeforeSendHeaders.addListener((details) => {
-    const { requestHeaders } = details;
-
-    requestHeaders.push({
-      name: "X-Ghostery-Browser",
-      value: "true",
-    });
-
-    requestHeaders.push({
-      name: "X-Ghostery-Login",
-      value: String(!!AccessToken.TOKEN),
-    });
-
-    if (AccessToken.TOKEN) {
-      const scopes = AccessToken.parse().scopes || [];
-      requestHeaders.push({
-        name: "X-Ghostery-Scopes",
-        value: scopes.join(','),
-      });
-    }
-
-    return {
-      requestHeaders,
-    };
-  }, { urls: [`${SERP_BASE_URL}/*`]}, ["blocking", "requestHeaders"]);
 }
 
 browser.runtime.onMessage.addListener(async ({ action, args }, { tab }) => {

src/content/is-ghostery-browser.js

@@ -0,0 +1,5 @@
+"use strict";
+
+(function () {
+  document.querySelector('html').classList.add('ghostery-browser');
+})()

src/manifest.json

@@ -13,15 +13,20 @@
       "background.js",
       "choice-screen.js",
       "metrics.js",
-      "api.js"
+      "api.js",
+      "status.js"
     ]
   },
   "content_scripts": [{
     "matches": [
       "https://*.ghosterysearch.com/",
       "http://localhost/*"
     ],
-    "js": ["content/top-sites.js", "content/search-bar.js"]
+    "js": [
+      "content/top-sites.js",
+      "content/search-bar.js",
+      "content/is-ghostery-browser.js"
+    ]
   }, {
     "matches": [
       "https://*.ghosterysearch.com/search*",
@@ -38,6 +43,7 @@
     "webRequest",
     "webRequestBlocking",
     "topSites",
+    "tabs",
     "https://www.ghostery.com/*",
     "https://consumerapi.ghostery.com/*",
     "https://www.ghosterystage.com/*",

src/status.js

@@ -0,0 +1,47 @@
+let loggedIn = false;
+let statusContentScript = Promise.resolve();
+
+const loggedInScript = `
+document.querySelector('html').classList.remove('logged-out');
+document.querySelector('html').classList.add('logged-in');
+`;
+const loggedOutScript = `
+document.querySelector('html').classList.remove('logged-in');
+document.querySelector('html').classList.add('logged-out');
+`;
+
+function injectLoggedInStatus(status) {
+  statusContentScript = statusContentScript.then(
+    async (previousRegistration) => {
+      if (status === loggedIn) {
+        return;
+      }
+      // unregister previous content script
+      if (previousRegistration && previousRegistration.unregister) {
+        previousRegistration.unregister();
+      }
+      loggedIn = status;
+      // register a content script to inject status classes in the future
+      const registration = await browser.contentScripts.register({
+        allFrames: false,
+        js: [
+          {
+            code: status ? loggedInScript : loggedOutScript,
+          },
+        ],
+        matches: [`${SERP_BASE_URL}/*`],
+        runAt: "document_start",
+      });
+      // trigger the log in state change in existing browser tabs
+      const activeTabs = await browser.tabs.query({
+        url: `${SERP_BASE_URL}/*`,
+      });
+      activeTabs.forEach(({ id }) => {
+        browser.tabs.executeScript(id, {
+          code: status ? loggedInScript : loggedOutScript,
+        });
+      });
+      return registration;
+    }
+  );
+}