Bug 941862 - UITour: Support a callback to notify when the menu panel opens while the menu button is an info panel target. r=Unfocused

browser/modules/UITour.jsm

@@ -71,7 +71,17 @@ this.UITour = {
       widgetName: "PanelUI-fxa-status",
     }],
     ["addons",      {query: "#add-ons-button"}],
-    ["appMenu",     {query: "#PanelUI-button"}],
+    ["appMenu",     {
+      addTargetListener: (aDocument, aCallback) => {
+        let panelPopup = aDocument.getElementById("PanelUI-popup");
+        panelPopup.addEventListener("popupshown", aCallback);
+      },
+      query: "#PanelUI-button",
+      removeTargetListener: (aDocument, aCallback) => {
+        let panelPopup = aDocument.getElementById("PanelUI-popup");
+        panelPopup.removeEventListener("popupshown", aCallback);
+      },
+    }],
     ["backForward", {
       query: "#back-button",
       widgetName: "urlbar-container",
@@ -329,6 +339,8 @@ this.UITour = {
 
           if (typeof data.closeButtonCallbackID == "string")
             infoOptions.closeButtonCallbackID = data.closeButtonCallbackID;
+          if (typeof data.targetCallbackID == "string")
+            infoOptions.targetCallbackID = data.targetCallbackID;
 
           this.showInfo(contentDocument, target, data.title, data.text, iconURL, buttons, infoOptions);
         }).then(null, Cu.reportError);
@@ -673,16 +685,20 @@ this.UITour = {
     aWindow.PanelUI.ensureReady().then(() => {
       if (typeof targetQuery == "function") {
         deferred.resolve({
-          targetName: aTargetName,
+          addTargetListener: targetObject.addTargetListener,
           node: targetQuery(aWindow.document),
+          removeTargetListener: targetObject.removeTargetListener,
+          targetName: aTargetName,
           widgetName: targetObject.widgetName,
         });
         return;
       }
 
       deferred.resolve({
-        targetName: aTargetName,
+        addTargetListener: targetObject.addTargetListener,
         node: aWindow.document.querySelector(targetQuery),
+        removeTargetListener: targetObject.removeTargetListener,
+        targetName: aTargetName,
         widgetName: targetObject.widgetName,
       });
     }).then(null, Cu.reportError);
@@ -933,9 +949,24 @@ this.UITour = {
           this.sendPageCallback(aContentDocument, aOptions.closeButtonCallbackID);
       };
       tooltipClose.addEventListener("command", closeButtonCallback);
+
+      let targetCallback = (event) => {
+        let details = {
+          target: aAnchor.targetName,
+          type: event.type,
+        };
+        this.sendPageCallback(aContentDocument, aOptions.targetCallbackID, details);
+      };
+      if (aOptions.targetCallbackID && aAnchor.addTargetListener) {
+        aAnchor.addTargetListener(document, targetCallback);
+      }
+
       tooltip.addEventListener("popuphiding", function tooltipHiding(event) {
         tooltip.removeEventListener("popuphiding", tooltipHiding);
         tooltipClose.removeEventListener("command", closeButtonCallback);
+        if (aOptions.targetCallbackID && aAnchor.removeTargetListener) {
+          aAnchor.removeTargetListener(document, targetCallback);
+        }
       });
 
       tooltip.setAttribute("targetName", aAnchor.targetName);

browser/modules/test/browser_UITour3.js

@@ -138,5 +138,21 @@ let tests = [
 
     let infoOptions = gContentWindow.makeInfoOptions();
     gContentAPI.showInfo("urlbar", "Close me", "X marks the spot", null, null, infoOptions);
-  }
+  },
+
+  function test_info_target_callback(done) {
+    let popup = document.getElementById("UITourTooltip");
+    popup.addEventListener("popupshown", function onPopupShown() {
+      popup.removeEventListener("popupshown", onPopupShown);
+      PanelUI.show().then(() => {
+        is(gContentWindow.callbackResult, "target", "target callback called");
+        is(gContentWindow.callbackData.target, "appMenu", "target callback was from the appMenu");
+        is(gContentWindow.callbackData.type, "popupshown", "target callback was from the mousedown");
+        done();
+      });
+    });
+
+    let infoOptions = gContentWindow.makeInfoOptions();
+    gContentAPI.showInfo("appMenu", "I want to know when the target is clicked", "*click*", null, null, infoOptions);
+  },
 ];

browser/modules/test/uitour.html

@@ -6,10 +6,11 @@
     <script type="application/javascript" src="uitour.js">
     </script>
     <script type="application/javascript">
-      var callbackResult;
+      var callbackResult, callbackData;
       function makeCallback(name) {
-        return (function() {
+        return (function(data) {
           callbackResult = name;
+          callbackData = data;
         });
       }
 
@@ -23,7 +24,8 @@
 
       function makeInfoOptions() {
         return {
-          closeButtonCallback: makeCallback("closeButton")
+          closeButtonCallback: makeCallback("closeButton"),
+          targetCallback: makeCallback("target"),
         };
       }
     </script>

browser/modules/test/uitour.js

@@ -90,9 +90,11 @@ if (typeof Mozilla == 'undefined') {
 			}
 		}
 
-		var closeButtonCallbackID;
+		var closeButtonCallbackID, targetCallbackID;
 		if (options && options.closeButtonCallback)
 			closeButtonCallbackID = _waitForCallback(options.closeButtonCallback);
+		if (options && options.targetCallback)
+			targetCallbackID = _waitForCallback(options.targetCallback);
 
 		_sendEvent('showInfo', {
 			target: target,
@@ -100,7 +102,8 @@ if (typeof Mozilla == 'undefined') {
 			text: text,
 			icon: icon,
 			buttons: buttonData,
-			closeButtonCallbackID: closeButtonCallbackID
+			closeButtonCallbackID: closeButtonCallbackID,
+			targetCallbackID: targetCallbackID
 		});
 	};