inform when dysfunctional due to FF options

_locales/en/messages.json

@@ -135,6 +135,14 @@
     "message": "Double-click to maximize/restore the height",
     "description": "Tooltip for the resize grip in style editor"
   },
+  "dysfunctional": {
+    "message": "Stylus cannot function because Firefox is either in private mode or is applying its website cookies policy to IndexedDB storage used by Stylus, which erroneously marks the secure moz-extension:// origin as insecure even though WebExtensions aren't websites and Stylus doesn't use cookies.\n\n1. Open Firefox options\n2. Go to 'Privacy & Security'\n3. Set 'History' mode to 'Use custom settings'\n4. Click 'Exceptions'\n5. Paste our manifest URL and click 'Allow'\n6. Click 'Save settings'\n7. Uncheck 'Always use private browsing mode'\n\nThe actual manifest URL is shown below.\nYou can also find it on about:debugging page.",
+    "description": "Displayed in Firefox when its settings make Stylus dysfunctional"
+  },
+  "dysfunctionalBackgroundConnection": {
+    "message": "Cannot function properly because of a known bug in this version of Firefox: chrome.extension.getBackgroundPage() doesn't return a valid result",
+    "description": "Displayed in style manager when unable to connect to the background page"
+  },
   "genericDisabledLabel": {
     "message": "Disabled",
     "description": "Used in various lists/options to indicate that something is disabled"

background/background.js

@@ -5,10 +5,8 @@
 var browserCommands, contextMenus;
 
 // *************************************************************************
-// preload the DB and report errors
-dbExec().catch((...args) => {
-  args.forEach(arg => 'message' in arg && console.error(arg.message));
-});
+// preload the DB
+tryCatch(getStyles);
 
 // *************************************************************************
 // register all listeners

background/storage.js

@@ -59,7 +59,7 @@ function dbExec(method, data) {
         }
       },
       onerror(event) {
-        console.warn(event.target.errorCode);
+        console.warn(event.target.error || event.target.errorCode);
         reject(event);
       },
       onupgradeneeded(event) {

background/update.js

@@ -18,7 +18,7 @@ var updater = {
   ERROR_MD5: 'error: MD5 is invalid',
   ERROR_JSON: 'error: JSON is invalid',
 
-  lastUpdateTime: parseInt(localStorage.lastUpdateTime) || Date.now(),
+  lastUpdateTime: parseInt(tryCatch(() => localStorage.lastUpdateTime)) || Date.now(),
 
   checkAllStyles({observer = () => {}, save = true, ignoreDigest} = {}) {
     updater.resetInterval();

js/dom.js

@@ -39,6 +39,7 @@ for (const type of [NodeList, NamedNodeMap, HTMLCollection, HTMLAllCollection])
 // add favicon in Firefox
 // eslint-disable-next-line no-unused-expressions
 navigator.userAgent.includes('Firefox') && setTimeout(() => {
+  dieOnDysfunction();
   const iconset = ['', 'light/'][prefs.get('iconset')] || '';
   for (const size of [38, 32, 19, 16]) {
     document.head.appendChild($element({
@@ -173,3 +174,29 @@ function retranslateCSS(selectorToMessageMap) {
     }
   }
 }
+
+
+function dieOnDysfunction() {
+  function die() {
+    location.href = '/msgbox/dysfunctional.html';
+    throw 0;
+  }
+  (() => {
+    try {
+      return indexedDB;
+    } catch (e) {
+      die();
+    }
+  })();
+  Object.assign(indexedDB.open('test'), {
+    onerror: die,
+    onupgradeneeded: indexedDB.deleteDatabase('test'),
+  });
+  // TODO: fallback to sendMessage in FF since private windows can't get bg page
+  chrome.windows.getCurrent(wnd => wnd.incognito && die());
+  // check if privacy settings were fixed but the extension wasn't reloaded
+  const bg = chrome.extension.getBackgroundPage();
+  if (bg && !(bg.cachedStyles || {}).list) {
+    chrome.runtime.reload();
+  }
+}

js/prefs.js

@@ -74,6 +74,9 @@ var prefs = new function Prefs() {
     specific: new Map(),
   };
 
+  // FF may think localStorage is a cookie or that it's not secure
+  const localStorage = tryCatch(() => localStorage) ? window.localStorage : {};
+
   // coalesce multiple pref changes in broadcast
   let broadcastPrefs = {};
 
@@ -203,7 +206,7 @@ var prefs = new function Prefs() {
       }
     };
 
-    getSync().get('settings', ({settings}) => importFromSync(settings));
+    getSync().get('settings', ({settings} = {}) => importFromSync(settings));
 
     chrome.storage.onChanged.addListener((changes, area) => {
       if (area === 'sync' && 'settings' in changes) {

manage/manage.js

@@ -35,7 +35,8 @@ Promise.all([
 });
 
 if (FIREFOX) {
-  // TODO: remove when this bug is fixed in FF
+  // TODO: remove when these bugs are fixed in FF
+  dieOnNullBackground();
   retranslateCSS({
     '.disabled h2::after':
       '__MSG_genericDisabledLabel__',
@@ -538,3 +539,24 @@ function usePrefsDuringPageLoad() {
   startObserver();
   onDOMready().then(() => observer.disconnect());
 }
+
+
+function dieOnNullBackground() {
+  if (BG) {
+    return;
+  }
+  chrome.runtime.sendMessage({method: 'healthCheck'}, health => {
+    if (health && !chrome.extension.getBackgroundPage()) {
+      onDOMready().then(() => {
+        chrome.runtime.sendMessage({method: 'getStyles'}, showStyles);
+        messageBox({
+          title: 'Stylus',
+          className: 'danger center',
+          contents: t('dysfunctionalBackgroundConnection'),
+          onshow: () => $('#message-box-close-icon').remove(),
+        });
+        document.documentElement.style.pointerEvents = 'none';
+      });
+    }
+  });
+}

msgbox/dysfunctional.css

@@ -0,0 +1,21 @@
+html {
+  height: 100vh;
+  min-height: 450px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  white-space: pre-wrap;
+  background-color: #555;
+  box-sizing: border-box;
+  border: 2vw solid black;
+}
+
+body {
+  margin: 2em;
+  color: white;
+  max-width: 600px;
+}
+
+div {
+  color: antiquewhite;
+}

msgbox/dysfunctional.html

@@ -0,0 +1,9 @@
+<!DOCTYPE html>
+<html id="stylus">
+<head>
+  <meta charset="UTF-8">
+  <link rel="stylesheet" href="dysfunctional.css">
+</head>
+<body>
+  <script src="dysfunctional.js"></script>
+</body>

msgbox/dysfunctional.js

@@ -0,0 +1,6 @@
+'use strict';
+
+document.body.textContent =
+  chrome.i18n.getMessage('dysfunctional');
+document.body.appendChild(document.createElement('div')).textContent =
+  chrome.runtime.getURL('manifest.json');