WIP: drop api.js

content/api.js

@@ -1,46 +0,0 @@
-/* global promisify */
-'use strict';
-
-const API = (() => {
-  const preparing = chrome.runtime.getBackgroundPage ?
-    promisify(chrome.runtime.getBackgroundPage.bind(chrome.runtime))()
-      .catch(() => null) :
-    Promise.resolve(null);
-  const runtimeSendMessage = promisify(chrome.runtime.sendMessage.bind(chrome.runtime));
-  return new Proxy(() => {}, {
-    get: (target, name) =>
-      (...args) => invokeBG(name, args),
-  });
-
-  function sendMessage(msg) {
-    return runtimeSendMessage(msg)
-      .then(result => {
-        if (result && result.__ERROR__) {
-          throw new Error(result.__ERROR__);
-        }
-        return result;
-      });
-  }
-
-  function invokeBG(name, args) {
-    return preparing.then(BG => {
-      if (!BG) {
-        return sendMessage({
-          method: 'invokeAPI',
-          name,
-          args
-        });
-      }
-      // FIXME: why deep-copying input/output?
-      if (BG !== window) {
-        args = BG.deepCopy(args);
-      }
-      const fn = BG.API_METHODS[name];
-      if (!fn) {
-        throw new Error(`unknown API method: ${name}`);
-      }
-      return Promise.resolve(fn(...args))
-        .then(BG.deepCopy);
-    });
-  }
-})();

edit.html

@@ -26,7 +26,7 @@
     <script src="js/script-loader.js"></script>
     <script src="js/storage-util.js"></script>
     <script src="js/exclusions.js"></script>
-    <script src="content/api.js"></script>
+    <script src="js/msg.js"></script>
     <script src="content/apply.js"></script>
     <script src="edit/util.js"></script>
     <script src="edit/regexp-tester.js"></script>

js/msg.js

@@ -1,4 +1,5 @@
 /* global promisify deepCopy */
+// deepCopy is only used if the script is executed in extension pages.
 'use strict';
 
 const msg = (() => {
@@ -119,7 +120,10 @@ const msg = (() => {
       tab: [],
       extension: []
     };
-    chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
+    chrome.runtime.onMessage.addListener(handleMessage);
+  }
+
+  function handleMessage(message, sender, sendResponse) {
     const handlers = message.target === 'tab' ?
       handler.tab.concat(handler.both) : message.target === 'extension' ?
       handler.extension.concat(handler.both) :
@@ -139,7 +143,7 @@ const msg = (() => {
     function response() {
       let result;
       for (const handle of handlers) {
-          const data = handle(message.data, sender);
+        const data = withPromiseError(handle, message.data, sender);
         if (data !== undefined && result === undefined) {
           result = data;
         }
@@ -166,7 +170,6 @@ const msg = (() => {
         .then(sendResponse);
       return true;
     }
-    });
   }
 
   function exchangeGet(message, keepStorage = false) {
@@ -175,7 +178,7 @@ const msg = (() => {
     }
     message.data = bg._msg.storage.get(message.id);
     if (keepStorage) {
-      message.data = deepCopy(data);
+      message.data = deepCopy(message.data);
     } else {
       bg._msg.storage.delete(message.id);
     }
@@ -190,6 +193,14 @@ const msg = (() => {
     delete message.data;
   }
 
+  function withPromiseError(fn, ...args) {
+    try {
+      return fn(...args);
+    } catch (err) {
+      return Promise.reject(err);
+    }
+  }
+
   function withCleanup(p, fn) {
     return p.then(
       result => {
@@ -229,3 +240,12 @@ const msg = (() => {
     }
   }
 })();
+
+const API = new Proxy({}, {
+  get: (target, name) =>
+    (...args) => msg.send({
+      method: 'invokeAPI',
+      name,
+      args
+    })
+});

manage.html

@@ -157,7 +157,7 @@
   <script src="js/dom.js"></script>
   <script src="js/messaging.js"></script>
   <script src="js/prefs.js"></script>
-  <script src="content/api.js"></script>
+  <script src="js/msg.js"></script>
   <script src="content/apply.js"></script>
   <script src="js/localization.js"></script>
   <script src="manage/filters.js"></script>

manifest.json

@@ -61,19 +61,19 @@
       "run_at": "document_start",
       "all_frames": true,
       "match_about_blank": true,
-      "js": ["js/promisify.js", "content/api.js", "content/apply.js"]
+      "js": ["js/promisify.js", "js/msg.js", "content/apply.js"]
     },
     {
       "matches": ["http://userstyles.org/*", "https://userstyles.org/*"],
       "run_at": "document_start",
       "all_frames": true,
-      "js": ["js/promisify.js", "content/api.js", "content/install-hook-userstyles.js"]
+      "js": ["js/promisify.js", "js/msg.js", "content/install-hook-userstyles.js"]
     },
     {
       "matches": ["https://openusercss.org/*", "https://openusercss.com/*"],
       "run_at": "document_start",
       "all_frames": false,
-      "js": ["js/promisify.js", "content/api.js", "content/install-hook-openusercss.js"]
+      "js": ["js/promisify.js", "js/msg.js", "content/install-hook-openusercss.js"]
     },
     {
       "matches": [
@@ -97,7 +97,7 @@
       ],
       "run_at": "document_idle",
       "all_frames": false,
-      "js": ["js/promisify.js", "content/api.js", "content/install-hook-usercss.js"]
+      "js": ["js/promisify.js", "js/msg.js", "content/install-hook-usercss.js"]
     }
   ],
   "browser_action": {

popup.html

@@ -156,7 +156,7 @@
   <script src="js/localization.js"></script>
   <script src="js/prefs.js"></script>
   <script src="js/promisify.js"></script>
-  <script src="content/api.js"></script>
+  <script src="js/msg.js"></script>
   <script src="content/apply.js"></script>
 
   <link rel="stylesheet" href="popup/popup.css">