Issue 5587, 5748 - Use mobile options page on Firefox for Android

options.js

 /*
  * This file is part of Adblock Plus <https://adblockplus.org/>,
  * Copyright (C) 2006-present eyeo GmbH
  *
  * Adblock Plus is free software: you can redistribute it and/or modify
  * it under the terms of the GNU General Public License version 3 as
  * published by the Free Software Foundation.
  *
  * Adblock Plus is distributed in the hope that it will be useful,
  * but WITHOUT ANY WARRANTY; without even the implied warranty of
  * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  * GNU General Public License for more details.
  *
  * You should have received a copy of the GNU General Public License
  * along with Adblock Plus.  If not, see <http://www.gnu.org/licenses/>.
  */
 
 "use strict";
 
-const {require} = chrome.extension.getBackgroundPage();
-
-let messageQueue = [];

[Manish Jethani, 2017/09/15 17:57:27]

Let me explain this.

Basically the top frame's load event is dispatched by the browser before all the
frames have finished loading, which causes the background page to believe that
the options page has finished loading, when in fact it has not.

Now until the iframe has finished loading, we need to queue up any messages we
receive. In the iframe's load handler, we forward the messages to the iframe's
document.

More comments below.

-
 let iframe = document.getElementById("content");
 
-function queueMessage(message, sender, sendResponse)
+iframe.onload = () =>
 {
-  // Ignore messages from anywhere but the background page.

[Manish Jethani, 2017/09/15 17:57:28]

We probably only need to ignore messages from the options page itself, and I'm
not even sure about that. But just to be safe, I'm only considering messages
that are definitely from the background page.

sender.url is undefined for the background page on Chrome and it is the actual
URL of the background page on Firefox.

-  if (sender.tab ||
-      sender.url && sender.url != chrome.extension.getBackgroundPage().location)
-  {
-    return false;
-  }
+  document.title = iframe.contentDocument.title;
+};
 
-  messageQueue.push({message, sendResponse});
-
-  // Return true to make the background page wait for the response.

[Thomas Greiner, 2017/09/19 17:51:21]

The UI may or may not call `sendResponse()` so we should only wait until we know
whether any of the callbacks return `true`.

i.e. `iframe.contentWindow.ext.onMessage._dispatch(...).includes(true)`

However, currently, the background page doesn't expect any response from the
options page for any messages it sends to it so it should be sufficient to
return `false` if you want to keep things simple.

[Manish Jethani, 2017/09/19 19:42:05]

OK, in that case queueMessage now doesn't return anything.

Done.

-  return true;
-}
-
-function handleContentLoad(event)
+chrome.runtime.sendMessage({

[Oleksandr, 2017/10/09 11:49:59]

Edge does not support the 'chrome' namespace for extensions. We should map to
'browser' here instead.

[Manish Jethani, 2017/10/09 12:00:55]

Thanks.

[Sebastian Noack, 2017/10/09 15:09:55]

Note that we already do so in ext/common.js:
https://hg.adblockplus.org/adblockpluschrome/file/7136ad8e321d/ext/common.js#l22

+  type: "app.get",
+  what: "application"
+},
+application =>
 {
-  iframe.onload = null;
-
-  chrome.runtime.onMessage.removeListener(queueMessage);
-
-  // Make a local reference to the message queue and release the global
-  // reference to avoid any memory leaks.
-  let messageQueueLocalReference = messageQueue;

[Manish Jethani, 2017/09/15 17:57:28]

This is just a safety measure just in case any errors are thrown in the
following lines of code.

-  messageQueue = null;
-
-  // Process message queue.
-  for (let {message, sendResponse} of messageQueueLocalReference)
-    iframe.contentWindow.ext.onMessage._dispatch(message, {}, sendResponse);
-}
-
-// Queue up messages from the background page until the content has finished
-// loading.
-chrome.runtime.onMessage.addListener(queueMessage);
-
-// When the content has finished loading, stop listening for messages from the
-// background page and forward all the queued up messages to the content
-// document.
-iframe.onload = handleContentLoad;
-
-// Load the mobile version of the options page on Firefox for Android.
-iframe.src = iframe.getAttribute("data-src-" + require("info").application) ||
-             iframe.getAttribute("data-src");
+  // Load the mobile version of the options page on Firefox for Android.
+  iframe.src = iframe.getAttribute("data-src-" + application) ||
+               iframe.getAttribute("data-src");
+});