Issue 2879 - Move element selection into the content process

lib/aardvark.js

 /*
  * This Source Code is subject to the terms of the Mozilla Public License

[saroyanm, 2016/11/23 17:44:37]

Irrelevant: Why is this file called Aadvark ?

[Wladimir Palant, 2016/11/24 14:02:00]

The origin of this code is the Aardvark extension for Firefox (now retired in
favor of the bookmarklet): http://www.karmatics.com/aardvark/. I convinced the
author to provide it under the MPL so that I could build EHH around it.

  * version 2.0 (the "License"). You can obtain a copy of the License at
  * http://mozilla.org/MPL/2.0/.
  */
 
 let {Services} = Cu.import("resource://gre/modules/Services.jsm", {});
 
 let {Prefs} = require("prefs");
 
 let messageManager = Cc["@mozilla.org/parentprocessmessagemanager;1"]
                        .getService(Ci.nsIMessageListenerManager)
                        .QueryInterface(Ci.nsIMessageBroadcaster);
 
 // To be replaced when selection starts
 function E(id) {return null;}
 
-messageManager.addMessageListener("ElemHideHelper:SelectionStarted", selectionStarted);

[saroyanm, 2016/11/23 17:44:37]

Nit: Exceeding 80 chars

[Wladimir Palant, 2016/11/24 14:02:01]

Done.

-messageManager.addMessageListener("ElemHideHelper:SelectionSucceeded", selectionSucceeded);
-messageManager.addMessageListener("ElemHideHelper:SelectionStopped", selectionStopped);
+messageManager.addMessageListener("ElemHideHelper:SelectionStarted",
+                                  selectionStarted);
+messageManager.addMessageListener("ElemHideHelper:SelectionSucceeded",
+                                  selectionSucceeded);
+messageManager.addMessageListener("ElemHideHelper:SelectionStopped",
+                                  selectionStopped);
 onShutdown.add(() =>
 {
-  messageManager.removeMessageListener("ElemHideHelper:SelectionStarted", selectionStarted);
-  messageManager.removeMessageListener("ElemHideHelper:SelectionSucceeded", selectionSucceeded);
-  messageManager.removeMessageListener("ElemHideHelper:SelectionStopped", selectionStopped);
+  messageManager.removeMessageListener("ElemHideHelper:SelectionStarted",
+                                       selectionStarted);
+  messageManager.removeMessageListener("ElemHideHelper:SelectionSucceeded",
+                                       selectionSucceeded);
+  messageManager.removeMessageListener("ElemHideHelper:SelectionStopped",
+                                       selectionStopped);
 
   selectionStopped();
 });
 
 function selectionStarted(message)
 {
   Aardvark.selectionStarted();
 }
 
 function selectionSucceeded(message)
 {
   Aardvark.selectionSucceeded(message.data);
 }
 
 function selectionStopped(message)
 {
   Aardvark.selectionStopped();
 }
 
 /**********************************
  * General element selection code *
  **********************************/
 
 let Aardvark = exports.Aardvark =
 {
   window: null,
   browser: null,
   rememberedWrapper: null,

[saroyanm, 2016/11/23 17:44:37]

Curious: Why rememberedWrapper, but not just wrapper ?
Do we clear it's state because of memory leak ?

[Wladimir Palant, 2016/11/24 14:02:00]

Its a temporary state, a bit of a hack so that we don't need to figure out which
wrapper the message refers to. But I suspect that we'll need to do this properly
later on...

   mouseX: -1,
   mouseY: -1,
   commandLabelTimer: null,
   viewSourceTimer: null,
 
   start: function(wrapper)
   {
     this.rememberedWrapper = wrapper;
     let browser = wrapper.browser;
     if ("selectedBrowser" in browser)

[saroyanm, 2016/11/23 17:44:38]

What is "selectedBrowser" property ? 
Are we assigning it ?
Or is it just not documented here ->
https://developer.mozilla.org/en-US/docs/Mozilla/Tech/XUL/browser 

[Wladimir Palant, 2016/11/24 14:02:01]

You need to look at
https://developer.mozilla.org/en-US/docs/Mozilla/Tech/XUL/tabbrowser. In Firefox
and SeaMonkey we'll get a <xul:tabbrowser>, in Thunderbird a <xul:browser>.

       browser = browser.selectedBrowser;
     messageManager.broadcastAsyncMessage(
       "ElemHideHelper:StartSelection",
       browser.outerWindowID
     );
   },
 
   selectionStarted: function()
   {
     let wrapper = this.rememberedWrapper;
     this.rememberedWrapper = null;
 
     this.window = wrapper.window;
     this.browser = wrapper.browser;

[saroyanm, 2016/11/23 17:44:38]

We already assigning this.rememberedWrapper value to "this.browser" in "start"
method.

[Wladimir Palant, 2016/11/24 14:02:01]

No, we are only assigning it to the local browser variable. start method doesn't
save any state, this is intentional - selection might not start, e.g. if you are
on a special page.

     E = id => wrapper.E(id);
 
     this.browser.addEventListener("keypress", this.onKeyPress, true);
     this.browser.addEventListener("mousemove", this.onMouseMove, false);
     this.browser.addEventListener("select", this.onTabSelect, false);
 
     this.initHelpBox();
 
     if (Prefs.showhelp)
       this.showMenu();
   },
 
   selectionSucceeded: function(nodeInfo)
   {
     this.window.openDialog("chrome://elemhidehelper/content/composer.xul",

[saroyanm, 2016/11/23 17:44:37]

Shouldn't we also remove eventlisteners on selection succeeded or call
selectionstopped ? 

[Wladimir Palant, 2016/11/24 14:02:01]

No, the select command (in lib/child/commands.js) will call stopSelection()
after sending SelectionSucceeded message. So we will get a SelectionStopped
message as well.

         "_blank", "chrome,centerscreen,resizable,dialog=no", nodeInfo);

[Wladimir Palant, 2016/11/17 13:54:47]

This function is pretty much what Aardvark.select() used to be. With this
function now being called from the child, it no longer needs to request the node
info so things got a lot simpler.

[saroyanm, 2016/11/23 17:44:38]

Acknowledged.

   },
 
   selectionStopped: function()
   {
     if (!this.browser)
       return;
 
     if (this.commandLabelTimer)
       this.commandLabelTimer.cancel();
     if (this.viewSourceTimer)
       this.viewSourceTimer.cancel();
     this.commandLabelTimer = null;
     this.viewSourceTimer = null;
 
     this.hideTooltips();
 
     this.browser.removeEventListener("keypress", this.onKeyPress, true);
     this.browser.removeEventListener("mousemove", this.onMouseMove, false);
     this.browser.removeEventListener("select", this.onTabSelect, false);
 
     this.window = null;
     this.browser = null;
     E = id => null;

[Wladimir Palant, 2016/11/17 13:54:47]

This function is what Aardvark.quit() used to be. With the actual command being
implemented in the child, this only does the necessary cleanup in the parent
now.

[saroyanm, 2016/11/23 17:44:37]

Acknowledged.

   },
 
   doCommand: function(command, event)
   {
     let showFeedback;
     if (this.hasOwnProperty(command))
       showFeedback = this[command]();

[Wladimir Palant, 2016/11/17 13:54:47]

The command handler no longer gets the selected element, this one is only
available in the child. The two commands remaining in the parent will need to
message the child in order to get the necessary information, this hasn't been
implemented yet.

[saroyanm, 2016/11/23 17:44:38]

Acknowledged.

     else
     {
       showFeedback = (command != "select" && command != "quit");

[Wladimir Palant, 2016/11/17 13:54:47]

This changes behavior slightly - e.g. you will get visual feedback for the
"wider" command even if you are at the top level already. We could implement the
old behavior where you only get visual feedback if something actually changes
(the commands would have to message the parent in order to show the visual
feedback then) but I doubt that it is worth the added complexity.

[saroyanm, 2016/11/23 17:44:37]

Acknowledged.

       messageManager.broadcastAsyncMessage("ElemHideHelper:Command", command);
     }
 
     if (showFeedback)
     {
       this.showCommandLabel(this.commands[command + "_key"], this.commands[command + "_altkey"], this.commands[command + "_label"]);
       if (event)
         event.stopPropagation();
     }
     if (event)
@@ skipping 70 matching lines @@
         tooltip.hidePopup();
     }
   },
 
   onKeyPress: function(event)
   {
     if (event.altKey || event.ctrlKey || event.metaKey)
       return;
 
     var command = null;
     if (event.keyCode == event.DOM_VK_ESCAPE)

[saroyanm, 2016/11/23 17:44:38]

Note: keyCode is a deprecated property.
You want me to file a separate issue for that ?

[Wladimir Palant, 2016/11/24 14:02:01]

Yes, definitely.

[saroyanm, 2016/11/25 16:18:13]

Done -> #4666

       command = "quit";
     else if (event.keyCode == event.DOM_VK_RETURN)
       command = "select";
     else if (event.charCode)
     {
       var key = String.fromCharCode(event.charCode).toLowerCase();
       var commands = this.commands;
       for (var i = 0; i < commands.length; i++)
         if (commands[commands[i] + "_key"] == key || commands[commands[i] + "_altkey"] == key)
           command = commands[i];
@@ skipping 38 matching lines @@
     "viewSourceWindow",
     "showMenu"
   ],
 
   viewSource: function(elem)
   {
     if (!elem)
       return false;
 
     var sourceBox = E("ehh-viewsource");
     if (sourceBox.state == "open")

[Wladimir Palant, 2016/11/17 13:54:47]

This is a behavior change, originally we would only hide the source code tooltip
if the selection was unchanged, otherwise we would show the source of the new
selection. The complexity here doesn't seem to be worth it so now this command
will always hide an already visible tooltip.

     {
       sourceBox.hidePopup();
       return true;
     }
     sourceBox.hidePopup();
 
     while (sourceBox.firstElementChild)
       sourceBox.removeChild(sourceBox.firstElementChild);
     this.getOuterHtmlFormatted(elem, sourceBox);
 
@@ skipping 135 matching lines @@
     // Show help box
     helpBox.showPopup(this.browser, -1, -1, "tooltip", "topleft", "topleft");
     return true;
   }
 }
 
 // Makes sure event handlers like Aardvark.onKeyPress always have the correct
 // this pointer set.
 for (let method of ["onKeyPress", "onMouseMove", "onTabSelect"])
   Aardvark[method] = Aardvark[method].bind(Aardvark);