Bug 1359137 - update UITour to highlight in new panel where appropriate, r=MattN

MozReview-Commit-ID: Asigfu41hTv

--HG--
extra : rebase_source : c0d01ebe5e5437c876ff97c4aa55f3091875a9dd

browser/components/uitour/UITour.jsm

@@ -33,6 +33,8 @@ XPCOMUtils.defineLazyModuleGetter(this, "PrivateBrowsingUtils",
 XPCOMUtils.defineLazyModuleGetter(this, "ReaderParent",
   "resource:///modules/ReaderParent.jsm");
 
+XPCOMUtils.defineLazyPreferenceGetter(this, "gPhotonStructure", "browser.photon.structure.enabled");
+
 // See LOG_LEVELS in Console.jsm. Common examples: "All", "Info", "Warn", & "Error".
 const PREF_LOG_LEVEL      = "browser.uitour.loglevel";
 const PREF_SEENPAGEIDS    = "browser.uitour.seenPageIDs";
@@ -96,31 +98,39 @@ this.UITour = {
   targets: new Map([
     ["accountStatus", {
       query: (aDocument) => {
+        let prefix = gPhotonStructure ? "appMenu" : "PanelUI"
         // If the user is logged in, use the avatar element.
-        let fxAFooter = aDocument.getElementById("PanelUI-fxa-container");
+        let fxAFooter = aDocument.getElementById(prefix + "-fxa-container");
         if (fxAFooter.getAttribute("fxastatus")) {
-          return aDocument.getElementById("PanelUI-fxa-avatar");
+          return aDocument.getElementById(prefix + "-fxa-avatar");
         }
 
         // Otherwise use the sync setup icon.
-        let statusButton = aDocument.getElementById("PanelUI-fxa-label");
+        let statusButton = aDocument.getElementById(prefix + "-fxa-label");
         return aDocument.getAnonymousElementByAttribute(statusButton,
                                                         "class",
                                                         "toolbarbutton-icon");
       },
-      // This is a fake widgetName starting with the "PanelUI-" prefix so we know
+      // This is a fake widgetName starting with the "PanelUI-"/"appMenu-" prefix so we know
       // to automatically open the appMenu when annotating this target.
-      widgetName: "PanelUI-fxa-label",
+      get widgetName() {
+        return gPhotonStructure ? "appMenu-fxa-label" : "PanelUI-fxa-label";
+      },
+    }],
+    ["addons", {
+      query(aDocument) {
+        let buttonId = gPhotonStructure ? "appMenu-addons-button" : "add-ons-button";
+        return aDocument.getElementById(buttonId);
+      }
     }],
-    ["addons",      {query: "#add-ons-button"}],
     ["appMenu",     {
       addTargetListener: (aDocument, aCallback) => {
-        let panelPopup = aDocument.getElementById("PanelUI-popup");
+        let panelPopup = aDocument.defaultView.PanelUI.panel;
         panelPopup.addEventListener("popupshown", aCallback);
       },
       query: "#PanelUI-button",
       removeTargetListener: (aDocument, aCallback) => {
-        let panelPopup = aDocument.getElementById("PanelUI-popup");
+        let panelPopup = aDocument.defaultView.PanelUI.panel;
         panelPopup.removeEventListener("popupshown", aCallback);
       },
     }],
@@ -133,15 +143,36 @@ this.UITour = {
     ["controlCenter-trackingBlock", controlCenterTrackingToggleTarget(false)],
     ["customize",   {
       query: (aDocument) => {
+        if (gPhotonStructure) {
+          return aDocument.getElementById("appMenu-customize-button");
+        }
         let customizeButton = aDocument.getElementById("PanelUI-customize");
         return aDocument.getAnonymousElementByAttribute(customizeButton,
                                                         "class",
                                                         "toolbarbutton-icon");
       },
-      widgetName: "PanelUI-customize",
+      get widgetName() {
+        return gPhotonStructure ? "appMenu-customize-button" : "PanelUI-customize";
+      },
+    }],
+    ["devtools", {
+      query(aDocument) {
+        let button = aDocument.getElementById("developer-button");
+        if (button || !gPhotonStructure) {
+          return button;
+        }
+        return aDocument.getElementById("appMenu-developer-button");
+      },
+      get widgetName() {
+        return gPhotonStructure ? "appMenu-developer-button" : "developer-button";
+      },
+    }],
+    ["help", {
+      query: (aDocument) => {
+        let buttonId = gPhotonStructure ? "appMenu-help-button" : "PanelUI-help";
+        return aDocument.getElementById(buttonId);
+      }
     }],
-    ["devtools",    {query: "#developer-button"}],
-    ["help",        {query: "#PanelUI-help"}],
     ["home",        {query: "#home-button"}],
     ["forget", {
       allowAdd: true,
@@ -153,8 +184,20 @@ this.UITour = {
       query: "#pocket-button",
       widgetName: "pocket-button",
     }],
-    ["privateWindow",  {query: "#privatebrowsing-button"}],
-    ["quit",        {query: "#PanelUI-quit"}],
+    ["privateWindow", {
+      query(aDocument) {
+        let buttonId = gPhotonStructure ? "appMenu-private-window-button"
+                                        : "privatebrowsing-button";
+        return aDocument.getElementById(buttonId);
+      }
+    }],
+    ["quit", {
+      query(aDocument) {
+        let buttonId = gPhotonStructure ? "appMenu-quit-button"
+                                        : "PanelUI-quit";
+        return aDocument.getElementById(buttonId);
+      }
+    }],
     ["readerMode-urlBar", {query: "#reader-mode-button"}],
     ["search",      {
       infoPanelOffsetX: 18,
@@ -944,7 +987,8 @@ this.UITour = {
     }
 
     // Handle the non-customizable buttons at the bottom of the menu which aren't proper widgets.
-    return targetElement.id.startsWith("PanelUI-")
+    let prefix = gPhotonStructure ? "appMenu-" : "PanelUI-";
+    return targetElement.id.startsWith(prefix)
              && targetElement.id != "PanelUI-button";
   },
 

browser/components/uitour/test/browser_UITour.js

@@ -120,7 +120,7 @@ var tests = [
     let highlight = document.getElementById("UITourHighlight");
     is_element_hidden(highlight, "Highlight should initially be hidden");
 
-    gContentAPI.showHighlight("addons");
+    gContentAPI.showHighlight("home");
     waitForElementToBeVisible(highlight, check_highlight_size, "Highlight should be shown after showHighlight()");
   },
   function test_highlight_customize_auto_open_close(done) {

browser/components/uitour/test/browser_UITour_availableTargets.js

@@ -5,6 +5,8 @@ var gContentAPI;
 var gContentWindow;
 
 var hasPocket = Services.prefs.getBoolPref("extensions.pocket.enabled");
+var hasQuit = !Services.prefs.getBoolPref("browser.photon.structure.enabled") ||
+              false; // Update this with AppConstants.platform != "macosx" after bug 1368734 lands;
 
 requestLongerTimeout(2);
 add_task(setup_UITourTest);
@@ -23,7 +25,7 @@ add_UITour_task(async function test_availableTargets() {
     "devtools",
       ...(hasPocket ? ["pocket"] : []),
     "privateWindow",
-    "quit",
+      ...(hasQuit ? ["quit"] : []),
     "readerMode-urlBar",
     "search",
     "searchIcon",
@@ -51,7 +53,7 @@ add_UITour_task(async function test_availableTargets_changeWidgets() {
     "home",
       ...(hasPocket ? ["pocket"] : []),
     "privateWindow",
-    "quit",
+      ...(hasQuit ? ["quit"] : []),
     "readerMode-urlBar",
     "search",
     "searchIcon",
@@ -84,7 +86,7 @@ add_UITour_task(async function test_availableTargets_exceptionFromGetTarget() {
     "devtools",
       ...(hasPocket ? ["pocket"] : []),
     "privateWindow",
-    "quit",
+      ...(hasQuit ? ["quit"] : []),
     "readerMode-urlBar",
     "trackingProtection",
     "urlbar",

browser/components/uitour/test/browser_UITour_detach_tab.js

@@ -81,7 +81,9 @@ var tests = [
     await shownPromise;
 
     isnot(gContentWindow.PanelUI.panel.state, "closed", "Panel should be open");
-    ok(gContentWindow.PanelUI.contents.children.length > 0, "Panel contents should have children");
+    if (!gContentWindow.gPhotonStructure) {
+      ok(gContentWindow.PanelUI.contents.children.length > 0, "Panel contents should have children");
+    }
     gContentAPI.hideHighlight();
     gContentAPI.hideMenu("appMenu");
     gTestTab = null;

browser/components/uitour/test/browser_fxa.js

@@ -39,7 +39,9 @@ var tests = [
     await showMenuPromise("appMenu");
     await showHighlightPromise("accountStatus");
     let highlight = document.getElementById("UITourHighlightContainer");
-    is(highlight.popupBoxObject.anchorNode.id, "PanelUI-fxa-avatar", "Anchored on avatar");
+    let photon = Services.prefs.getBoolPref("browser.photon.structure.enabled");
+    let expectedTarget = photon ? "appMenu-fxa-avatar" : "PanelUI-fxa-avatar";
+    is(highlight.popupBoxObject.anchorNode.id, expectedTarget, "Anchored on avatar");
     is(highlight.getAttribute("targetName"), "accountStatus", "Correct highlight target");
   }),
 ];