Merge pull request #109 from janekptacijarabaci/devtools_appmenu_2

[PALEMOON] [DevTools] Added support of the appmenu for DevTools menuitems (follow up)

3 files changed, 87 insertions, 20 deletions

diff --git a/devtools/client/framework/browser-menus.js b/devtools/client/framework/browser-menus.js
index c0572a928..a3ed17bbc 100644
--- a/devtools/client/framework/browser-menus.js
+++ b/devtools/client/framework/browser-menus.js
@@ -133,10 +133,11 @@ function attachKeybindingsToBrowser(doc, keys) {
  */
 function createToolMenuElements(toolDefinition, doc) {
   let id = toolDefinition.id;
+  let appmenuId = "appmenuitem_" + id;
   let menuId = "menuitem_" + id;
 
   // Prevent multiple entries for the same tool.
-  if (doc.getElementById(menuId)) {
+  if (doc.getElementById(appmenuId) || doc.getElementById(menuId)) {
     return;
   }
 
@@ -321,6 +322,7 @@ function addTopLevelItems(doc) {
         doc,
         id: "app" + id,
         label: l10n(l10nKey + ".label"),
+        accesskey: null,
         isCheckbox: item.checkbox
       });
       let menuitem = createMenuItem({
diff --git a/devtools/client/framework/devtools-browser.js b/devtools/client/framework/devtools-browser.js
index 152870af3..f032f82aa 100644
--- a/devtools/client/framework/devtools-browser.js
+++ b/devtools/client/framework/devtools-browser.js
@@ -87,6 +87,9 @@ var gDevToolsBrowser = exports.gDevToolsBrowser = {
 
     function toggleMenuItem(id, isEnabled) {
       let cmd = doc.getElementById(id);
+      if (!cmd) {
+        return;
+      }
       if (isEnabled) {
         cmd.removeAttribute("disabled");
         cmd.removeAttribute("hidden");
@@ -96,22 +99,39 @@ var gDevToolsBrowser = exports.gDevToolsBrowser = {
       }
     }
 
+    let idEls = [];
+    
     // Enable developer toolbar?
     let devToolbarEnabled = Services.prefs.getBoolPref("devtools.toolbar.enabled");
-    toggleMenuItem("menu_devToolbar", devToolbarEnabled);
-    let focusEl = doc.getElementById("menu_devToolbar");
-    if (devToolbarEnabled) {
-      focusEl.removeAttribute("disabled");
-    } else {
-      focusEl.setAttribute("disabled", "true");
-    }
+    idEls = [
+      "appmenu_devToolbar",
+      "menu_devToolbar"
+    ];
+    idEls.forEach(function (idEl) {
+      toggleMenuItem(idEl, devToolbarEnabled);
+      let focusEl = doc.getElementById(idEl);
+      if (!focusEl) {
+        return;
+      }
+      if (devToolbarEnabled) {
+        focusEl.removeAttribute("disabled");
+      } else {
+        focusEl.setAttribute("disabled", "true");
+      }
+    });
     if (devToolbarEnabled && Services.prefs.getBoolPref("devtools.toolbar.visible")) {
       win.DeveloperToolbar.show(false).catch(console.error);
     }
 
     // Enable WebIDE?
     let webIDEEnabled = Services.prefs.getBoolPref("devtools.webide.enabled");
-    toggleMenuItem("menu_webide", webIDEEnabled);
+    idEls = [
+      "appmenu_webide",
+      "menu_webide"
+    ];
+    idEls.forEach(function (idEl) {
+      toggleMenuItem(idEl, webIDEEnabled);
+    });
 
     let showWebIDEWidget = Services.prefs.getBoolPref("devtools.webide.widget.enabled");
     if (webIDEEnabled && showWebIDEWidget) {
@@ -124,11 +144,29 @@ var gDevToolsBrowser = exports.gDevToolsBrowser = {
     let chromeEnabled = Services.prefs.getBoolPref("devtools.chrome.enabled");
     let devtoolsRemoteEnabled = Services.prefs.getBoolPref("devtools.debugger.remote-enabled");
     let remoteEnabled = chromeEnabled && devtoolsRemoteEnabled;
-    toggleMenuItem("menu_browserToolbox", remoteEnabled);
-    toggleMenuItem("menu_browserContentToolbox", remoteEnabled && win.gMultiProcessBrowser);
+    idEls = [
+      "appmenu_browserToolbox",
+      "menu_browserToolbox"
+    ];
+    idEls.forEach(function (idEl) {
+      toggleMenuItem(idEl, remoteEnabled);
+    });
+    idEls = [
+      "appmenu_browserContentToolbox",
+      "menu_browserContentToolbox"
+    ];
+    idEls.forEach(function (idEl) {
+      toggleMenuItem(idEl, remoteEnabled && win.gMultiProcessBrowser);
+    });
 
     // Enable DevTools connection screen, if the preference allows this.
-    toggleMenuItem("menu_devtools_connect", devtoolsRemoteEnabled);
+    idEls = [
+      "appmenu_devtools_connect",
+      "menu_devtools_connect"
+    ];
+    idEls.forEach(function (idEl) {
+      toggleMenuItem(idEl, devtoolsRemoteEnabled);
+    });
   },
 
   observe: function (subject, topic, prefName) {
@@ -613,12 +651,23 @@ var gDevToolsBrowser = exports.gDevToolsBrowser = {
 
       let hasToolbox = gDevToolsBrowser.hasToolboxOpened(win);
 
-      let menu = win.document.getElementById("menu_devToolbox");
-      if (hasToolbox) {
-        menu.setAttribute("checked", "true");
-      } else {
-        menu.removeAttribute("checked");
-      }
+      let idEls = [];
+
+      idEls = [
+        "appmenu_devToolbox",
+        "menu_devToolbox"
+      ];
+      idEls.forEach(function (idEl) {
+        let menu = win.document.getElementById(idEl);
+        if (!menu) {
+          return;
+        }
+        if (hasToolbox) {
+          menu.setAttribute("checked", "true");
+        } else {
+          menu.removeAttribute("checked");
+        }
+      });
     }
   },
 
diff --git a/devtools/client/shared/developer-toolbar.js b/devtools/client/shared/developer-toolbar.js
index 2528591a6..d84402418 100644
--- a/devtools/client/shared/developer-toolbar.js
+++ b/devtools/client/shared/developer-toolbar.js
@@ -449,7 +449,15 @@ DeveloperToolbar.prototype.show = function (focus) {
 
     [ this.tooltipPanel, this.outputPanel ] = panels;
 
-    this._doc.getElementById("menu_devToolbar").setAttribute("checked", "true");
+    let checkboxValue = "true";
+    let appmenuEl = this._doc.getElementById("appmenu_devToolbar");
+    let menuEl = this._doc.getElementById("menu_devToolbar");
+    if (appmenuEl) {
+      appmenuEl.setAttribute("checked", checkboxValue);
+    }
+    if (menuEl) {
+      menuEl.setAttribute("checked", checkboxValue);
+    }
 
     this.target = TargetFactory.forTab(this._chromeWindow.gBrowser.selectedTab);
     const options = {
@@ -569,7 +577,15 @@ DeveloperToolbar.prototype.hide = function () {
 
     Services.prefs.setBoolPref("devtools.toolbar.visible", false);
 
-    this._doc.getElementById("menu_devToolbar").setAttribute("checked", "false");
+    let checkboxValue = "false";
+    let appmenuEl = this._doc.getElementById("appmenu_devToolbar");
+    let menuEl = this._doc.getElementById("menu_devToolbar");
+    if (appmenuEl) {
+      appmenuEl.setAttribute("checked", checkboxValue);
+    }
+    if (menuEl) {
+      menuEl.setAttribute("checked", checkboxValue);
+    }
     this.destroy();
 
     this._telemetry.toolClosed("developertoolbar");