Merge pull request #170 from mozilla/message-refactor

Centralize message handling to allow for multiple async listeners.

src/background/extraction.js

@@ -17,14 +17,14 @@ import {validatePropType} from 'commerce/utils';
  * with normal page navigation, this is also run when the prices are being
  * updated in the background.
  *
- * @param {ExtractedProduct} contentExtractedProduct
+ * @param {object} message
  * @param {MessageSender} sender
  *  The sender for the content script that extracted this product
  */
-export async function handleExtractedProductData(contentExtractedProduct, sender) {
+export async function handleExtractedProductData(message, sender) {
   // Fetch the favicon, which the content script cannot do itself.
   const extractedProduct = {
-    ...contentExtractedProduct,
+    ...message.extractedProduct,
     vendorFaviconUrl: sender.tab.favIconUrl,
   };
 

src/background/index.js

@@ -10,9 +10,7 @@
  */
 
 import config from 'commerce/config';
-import {handleConfigMessage} from 'commerce/config/background';
-import {CONFIG_MESSAGE_TYPE} from 'commerce/config/content';
-import {handleExtractedProductData} from 'commerce/background/extraction';
+import handleMessage from 'commerce/background/messages';
 import {handleNotificationClicked, handlePriceAlerts} from 'commerce/background/price_alerts';
 import {handleWebRequest, updatePrices} from 'commerce/background/price_updates';
 import store from 'commerce/state';
@@ -28,21 +26,8 @@ import {registerEvents} from 'commerce/background/telemetry';
     color: await config.get('badgeAlertBackground'),
   });
 
-  // Setup product extraction listener
-  browser.runtime.onMessage.addListener((message, sender) => {
-    if (message.from === 'content' && message.subject === 'ready') {
-      handleExtractedProductData(message.extractedProduct, sender);
-    }
-  });
-
-  // Setup config listener; returns for onMessage listeners can't be consistent
-  // as returning a value prevents other listeners from returning values.
-  /* eslint-disable consistent-return */
-  browser.runtime.onMessage.addListener(async (message, sender) => {
-    if (message.type === CONFIG_MESSAGE_TYPE) {
-      return handleConfigMessage(message, sender);
-    }
-  });
+  // Register centralized message handler
+  browser.runtime.onMessage.addListener(handleMessage);
 
   // Display price alerts when they are inserted into the state.
   // This includes the initial load from extension storage below.

src/background/messages.js

@@ -0,0 +1,33 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+/**
+ * Centralized message handler for the background script.
+ *
+ * If you return a promise from the handler for browser.runtime.onMessage,
+ * the browser will assume you're sending a message back to the sender and will
+ * return whatever that Promise resolves to. A side effect is that multiple
+ * async handlers will fail because the first one to run will set the final
+ * return value, even if it resolves to `undefined`.
+ *
+ * A centralized message handler avoids this by checking all potential messages
+ * in a single handler.
+ * @module
+ */
+
+import {handleConfigMessage} from 'commerce/config/background';
+import {handleExtractedProductData} from 'commerce/background/extraction';
+
+export const handlers = new Map([
+  ['extracted-product', handleExtractedProductData],
+  ['config', handleConfigMessage],
+]);
+
+export default async function handleMessage(message, sender) {
+  if (handlers.has(message.type)) {
+    return handlers.get(message.type)(message, sender);
+  }
+
+  return undefined;
+}

src/config/background.js

@@ -10,6 +10,6 @@ import config from 'commerce/config';
  * @module
  */
 
-export async function handleConfigMessage(message) {
-  return config.get(message.name);
+export async function handleConfigMessage({name}) {
+  return config.get(name);
 }

src/config/content.js

@@ -8,10 +8,8 @@
  * @module
  */
 
-export const CONFIG_MESSAGE_TYPE = 'config';
-
 export default {
   async get(configName) {
-    return browser.runtime.sendMessage({type: CONFIG_MESSAGE_TYPE, name: configName});
+    return browser.runtime.sendMessage({type: 'config', name: configName});
   },
 };

src/extraction/index.js

@@ -48,8 +48,7 @@ async function attemptExtraction() {
   const extractedProduct = extractProduct();
   if (extractedProduct) {
     await browser.runtime.sendMessage({
-      from: 'content',
-      subject: 'ready',
+      type: 'extracted-product',
       extractedProduct: {
         ...extractedProduct,
         url: document.location.href,