Bug 704983 - Make request and response body logging more discoverable in the Web Console. r=msucan

browser/devtools/webconsole/test/browser_webconsole_bug_601667_filter_buttons.js

@@ -48,12 +48,14 @@ function testMenuFilterButton(aCategory) {
   menuItem = firstMenuItem;
   let prefKey;
   while (menuItem) {
-    prefKey = menuItem.getAttribute("prefKey");
-    chooseMenuItem(menuItem);
-    ok(isChecked(menuItem), "menu item " + prefKey + " for category " +
-       aCategory + " is checked after clicking it");
-    ok(hud.ui.filterPrefs[prefKey], prefKey + " messages are " +
-       "on after clicking the appropriate menu item");
+    if (menuItem.hasAttribute("prefKey")) {
+      prefKey = menuItem.getAttribute("prefKey");
+      chooseMenuItem(menuItem);
+      ok(isChecked(menuItem), "menu item " + prefKey + " for category " +
+         aCategory + " is checked after clicking it");
+      ok(hud.ui.filterPrefs[prefKey], prefKey + " messages are " +
+         "on after clicking the appropriate menu item");
+    }
     menuItem = menuItem.nextSibling;
   }
   ok(isChecked(button), "the button for category " + aCategory + " is " +
@@ -103,11 +105,13 @@ function testMenuFilterButton(aCategory) {
 
   menuItem = firstMenuItem;
   while (menuItem) {
-    let prefKey = menuItem.getAttribute("prefKey");
-    ok(isChecked(menuItem), "menu item " + prefKey + " for category " +
-       aCategory + " is checked after clicking the button");
-    ok(hud.ui.filterPrefs[prefKey], prefKey + " messages are " +
-       "on after clicking the button");
+    if (menuItem.hasAttribute("prefKey")) {
+      let prefKey = menuItem.getAttribute("prefKey");
+      ok(isChecked(menuItem), "menu item " + prefKey + " for category " +
+         aCategory + " is checked after clicking the button");
+      ok(hud.ui.filterPrefs[prefKey], prefKey + " messages are " +
+         "on after clicking the button");
+    }
     menuItem = menuItem.nextSibling;
   }
 

browser/devtools/webconsole/test/browser_webconsole_bug_602572_log_bodies_checkbox.js

@@ -8,7 +8,7 @@
  *
  * ***** END LICENSE BLOCK ***** */
 
-let menuitems = [], menupopups = [], huds = [], tabs = [];
+let menuitems = [], menupopups = [], huds = [], tabs = [], runCount = 0;
 
 function test()
 {
@@ -43,13 +43,18 @@ function test()
 function startTest()
 {
   // Find the relevant elements in the Web Console of tab 2.
-  let win2 = tabs[1].linkedBrowser.contentWindow;
+  let win2 = tabs[runCount*2 + 1].linkedBrowser.contentWindow;
   let hudId2 = HUDService.getHudIdByWindow(win2);
   huds[1] = HUDService.hudReferences[hudId2];
   HUDService.disableAnimation(hudId2);
 
-  menuitems[1] = huds[1].ui.rootElement.querySelector("#saveBodies");
-  menupopups[1] = huds[1].ui.rootElement.querySelector("menupopup");
+  if (runCount == 0) {
+    menuitems[1] = huds[1].ui.rootElement.querySelector("#saveBodies");
+  }
+  else {
+    menuitems[1] = huds[1].ui.rootElement.querySelector("#saveBodiesContextMenu");
+  }
+  menupopups[1] = menuitems[1].parentNode;
 
   // Open the context menu from tab 2.
   menupopups[1].addEventListener("popupshown", onpopupshown2, false);
@@ -95,10 +100,10 @@ function onpopupshown2b(aEvent)
     menupopups[1].removeEventListener(aEvent.type, _onhidden, false);
 
     // Switch to tab 1 and open the Web Console context menu from there.
-    gBrowser.selectedTab = tabs[0];
+    gBrowser.selectedTab = tabs[runCount*2];
     waitForFocus(function() {
       // Find the relevant elements in the Web Console of tab 1.
-      let win1 = tabs[0].linkedBrowser.contentWindow;
+      let win1 = tabs[runCount*2].linkedBrowser.contentWindow;
       let hudId1 = HUDService.getHudIdByWindow(win1);
       huds[0] = HUDService.hudReferences[hudId1];
       HUDService.disableAnimation(hudId1);
@@ -111,7 +116,7 @@ function onpopupshown2b(aEvent)
 
       menupopups[0].addEventListener("popupshown", onpopupshown1, false);
       menupopups[0].openPopup();
-    }, tabs[0].linkedBrowser.contentWindow);
+    }, tabs[runCount*2].linkedBrowser.contentWindow);
   }, false);
 
   executeSoon(function() {
@@ -134,12 +139,12 @@ function onpopupshown1(aEvent)
   menupopups[0].addEventListener("popuphidden", function _onhidden(aEvent) {
     menupopups[0].removeEventListener(aEvent.type, _onhidden, false);
 
-    gBrowser.selectedTab = tabs[1];
+    gBrowser.selectedTab = tabs[runCount*2 + 1];
     waitForFocus(function() {
       // Reopen the context menu from tab 2.
       menupopups[1].addEventListener("popupshown", onpopupshown2c, false);
       menupopups[1].openPopup();
-    }, tabs[1].linkedBrowser.contentWindow);
+    }, tabs[runCount*2 + 1].linkedBrowser.contentWindow);
   }, false);
 
   executeSoon(function() {
@@ -156,12 +161,25 @@ function onpopupshown2c(aEvent)
   menupopups[1].addEventListener("popuphidden", function _onhidden(aEvent) {
     menupopups[1].removeEventListener(aEvent.type, _onhidden, false);
 
-    // Done!
-    huds = menuitems = menupopups = tabs = null;
+    // Done if on second run
     closeConsole(gBrowser.selectedTab, function() {
-      gBrowser.removeCurrentTab();
-      executeSoon(finishTest);
+      if (runCount == 0) {
+        runCount++;
+        executeSoon(test);
+      }
+      else {
+        gBrowser.removeCurrentTab();
+        gBrowser.selectedTab = tabs[2];
+        gBrowser.removeCurrentTab();
+        gBrowser.selectedTab = tabs[1];
+        gBrowser.removeCurrentTab();
+        gBrowser.selectedTab = tabs[0];
+        gBrowser.removeCurrentTab();
+        huds = menuitems = menupopups = tabs = null;
+        executeSoon(finishTest);
+      }
     });
+
   }, false);
 
   executeSoon(function() {

browser/devtools/webconsole/webconsole.js

@@ -343,11 +343,30 @@ WebConsoleFrame.prototype = {
       this.saveRequestAndResponseBodies = !this.saveRequestAndResponseBodies;
     }.bind(this));
     saveBodies.setAttribute("checked", this.saveRequestAndResponseBodies);
+    saveBodies.disabled = !this.getFilterState("networkinfo") &&
+                          !this.getFilterState("network");
 
-    let contextMenuId = this.outputNode.getAttribute("context");
-    let contextMenu = doc.getElementById(contextMenuId);
-    contextMenu.addEventListener("popupshowing", function() {
+    saveBodies.parentNode.addEventListener("popupshowing", function() {
       saveBodies.setAttribute("checked", this.saveRequestAndResponseBodies);
+      saveBodies.disabled = !this.getFilterState("networkinfo") &&
+                            !this.getFilterState("network");
+    }.bind(this));
+
+    // Remove this part when context menu entry is removed.
+    let saveBodiesContextMenu = doc.getElementById("saveBodiesContextMenu");
+    saveBodiesContextMenu.addEventListener("command", function() {
+      this.saveRequestAndResponseBodies = !this.saveRequestAndResponseBodies;
+    }.bind(this));
+    saveBodiesContextMenu.setAttribute("checked",
+                                       this.saveRequestAndResponseBodies);
+    saveBodiesContextMenu.disabled = !this.getFilterState("networkinfo") &&
+                                     !this.getFilterState("network");
+
+    saveBodiesContextMenu.parentNode.addEventListener("popupshowing", function() {
+      saveBodiesContextMenu.setAttribute("checked",
+                                         this.saveRequestAndResponseBodies);
+      saveBodiesContextMenu.disabled = !this.getFilterState("networkinfo") &&
+                                       !this.getFilterState("network");
     }.bind(this));
 
     this.closeButton = doc.getElementById("webconsole-close-button");
@@ -686,13 +705,22 @@ WebConsoleFrame.prototype = {
         let prefKey = target.getAttribute("prefKey");
         this.setFilterState(prefKey, state);
 
+        // Disable the log response and request body if network logging is off.
+        if (prefKey == "networkinfo" || prefKey == "network") {
+          let checkState = !this.getFilterState("networkinfo") &&
+                           !this.getFilterState("network");
+          this.document.getElementById("saveBodies").disabled = checkState;
+          this.document.getElementById("saveBodiesContextMenu").disabled = checkState;
+        }
+
         // Adjust the state of the button appropriately.
         let menuPopup = target.parentNode;
 
         let someChecked = false;
         let menuItem = menuPopup.firstChild;
         while (menuItem) {
-          if (menuItem.getAttribute("checked") === "true") {
+          if (menuItem.hasAttribute("prefKey") &&
+              menuItem.getAttribute("checked") === "true") {
             someChecked = true;
             break;
           }

browser/devtools/webconsole/webconsole.xul

@@ -39,7 +39,7 @@
 
   <popupset id="mainPopupSet">
     <menupopup id="output-contextmenu">
-      <menuitem id="saveBodies" type="checkbox" label="&saveBodies.label;"
+      <menuitem id="saveBodiesContextMenu" type="checkbox" label="&saveBodies.label;"
                 accesskey="&saveBodies.accesskey;"/>
       <menuitem id="menu_copy"/>
       <menuitem id="menu_selectAll"/>
@@ -63,6 +63,9 @@
                       prefKey="network"/>
             <menuitem label="&btnConsoleLog;" type="checkbox" autocheck="false"
                       prefKey="networkinfo"/>
+            <menuseparator id="saveBodiesSeparator" />
+            <menuitem id="saveBodies" type="checkbox" label="&saveBodies.label;"
+                      accesskey="&saveBodies.accesskey;"/>
           </menupopup>
         </toolbarbutton>
         <toolbarbutton label="&btnPageCSS.label;" type="menu-button"