Bug 969376 - correctly size Australis' menu button, make it hug right border on Windows and Linux, r=jaws
authorGijs Kruitbosch <gijskruitbosch@gmail.com>
Tue, 11 Feb 2014 19:31:43 +0000
changeset 168683 e69b0b50156466da83ffa7e00f2d7927022685b2
parent 168682 8e9dfd4baac11abdba071af8d12de9284241c21d
child 168684 4c629a023860bb6e464c1bf75580567cc160bf08
push id1
push userroot
push dateMon, 20 Oct 2014 17:29:22 +0000
reviewersjaws
bugs969376
milestone30.0a1
Bug 969376 - correctly size Australis' menu button, make it hug right border on Windows and Linux, r=jaws
browser/base/content/test/general/browser.ini
browser/base/content/test/general/browser_menuButtonFitts.js
browser/themes/linux/browser.css
browser/themes/osx/browser.css
browser/themes/shared/customizableui/panelUIOverlay.inc.css
browser/themes/windows/browser.css
--- a/browser/base/content/test/general/browser.ini
+++ b/browser/base/content/test/general/browser.ini
@@ -264,16 +264,18 @@ skip-if = true # browser_drag.js is disa
 [browser_identity_UI.js]
 [browser_keywordBookmarklets.js]
 [browser_keywordSearch.js]
 [browser_keywordSearch_postData.js]
 [browser_lastAccessedTab.js]
 [browser_locationBarCommand.js]
 skip-if = os == "linux" # Intermittent failures, bug 917535
 [browser_locationBarExternalLoad.js]
+[browser_menuButtonFitts.js]
+skip-if = os != "win" # The Fitts Law menu button is only supported on Windows (bug 969376)
 [browser_middleMouse_inherit.js]
 [browser_minimize.js]
 [browser_mixedcontent_securityflags.js]
 [browser_notification_tab_switching.js]
 [browser_offlineQuotaNotification.js]
 [browser_overflowScroll.js]
 [browser_pageInfo.js]
 [browser_pageInfo_plugins.js]
copy from browser/base/content/test/general/browser_backButtonFitts.js
copy to browser/base/content/test/general/browser_menuButtonFitts.js
--- a/browser/base/content/test/general/browser_backButtonFitts.js
+++ b/browser/base/content/test/general/browser_menuButtonFitts.js
@@ -1,30 +1,32 @@
 /* Any copyright is dedicated to the Public Domain.
  * http://creativecommons.org/publicdomain/zero/1.0/
  */
 
 function test () {
   waitForExplicitFinish();
-  var firstLocation = "http://example.org/browser/browser/base/content/test/general/dummy_page.html";
-  gBrowser.selectedTab = gBrowser.addTab(firstLocation);
-  gBrowser.selectedBrowser.addEventListener("pageshow", function onPageShow1() {
-    gBrowser.selectedBrowser.removeEventListener("pageshow", onPageShow1);
-    gBrowser.selectedBrowser.contentWindow.history.pushState("page2", "page2", "page2");
-    window.maximize();
+  window.maximize();
+
+  // Find where the nav-bar is vertically.
+  var navBar = document.getElementById("nav-bar");
+  var boundingRect = navBar.getBoundingClientRect();
+  var yPixel = boundingRect.top + Math.floor(boundingRect.height / 2);
+  var xPixel = boundingRect.width - 1; // Use the last pixel of the screen since it is maximized.
 
-    // Find where the nav-bar is vertically.
-    var navBar = document.getElementById("nav-bar");
-    var boundingRect = navBar.getBoundingClientRect();
-    var yPixel = boundingRect.top + Math.floor(boundingRect.height / 2);
-    var xPixel = 0; // Use the first pixel of the screen since it is maximized.
-
-    gBrowser.selectedBrowser.contentWindow.addEventListener("popstate", function onPopState() {
-      gBrowser.selectedBrowser.contentWindow.removeEventListener("popstate", onPopState);
-      is(gBrowser.selectedBrowser.contentDocument.location.href, firstLocation,
-         "Clicking the first pixel should have navigated back.");
-      window.restore();
-      gBrowser.removeCurrentTab();
-      finish();
-    });
-    EventUtils.synthesizeMouseAtPoint(xPixel, yPixel, {}, window);
+  function onPopupHidden() {
+    PanelUI.panel.removeEventListener("popuphidden", onPopupHidden);
+    window.restore();
+    finish();
+  }
+  function onPopupShown() {
+    PanelUI.panel.removeEventListener("popupshown", onPopupShown);
+    ok(true, "Clicking at the far edge of the window opened the menu popup.");
+    PanelUI.panel.addEventListener("popuphidden", onPopupHidden);
+    PanelUI.hide();
+  }
+  registerCleanupFunction(function() {
+    PanelUI.panel.removeEventListener("popupshown", onPopupShown);
+    PanelUI.panel.removeEventListener("popuphidden", onPopupHidden);
   });
+  PanelUI.panel.addEventListener("popupshown", onPopupShown);
+  EventUtils.synthesizeMouseAtPoint(xPixel, yPixel, {}, window);
 }
--- a/browser/themes/linux/browser.css
+++ b/browser/themes/linux/browser.css
@@ -586,16 +586,20 @@ toolbarbutton[sdk-button="true"][cui-are
   width: 16px;
 }
 
 :-moz-any(#TabsToolbar, #nav-bar) toolbarbutton[sdk-button="true"][cui-areatype="toolbar"] > .toolbarbutton-icon {
   /* XXXgijs box models strike again: this is 16px + 2 * 7px padding + 2 * 1px border (from the rules above) */
   width: 32px;
 }
 
+#nav-bar #PanelUI-menu-button {
+  -moz-padding-start: 7px;
+  -moz-padding-end: 5px;
+}
 
 :-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1 > .toolbarbutton-menubutton-button:not([disabled]):hover > .toolbarbutton-icon,
 :-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not([buttonover]):not([open]):hover > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon,
 :-moz-any(#TabsToolbar, #nav-bar) .toolbarbutton-1:not([disabled]):hover > .toolbarbutton-icon {
   background-color: hsla(0,0%,100%,.3);
   background-image: linear-gradient(hsla(0,0%,100%,.7), hsla(0,0%,100%,.2));
   border: 1px solid rgb(154,154,154);
   box-shadow: 0 1px 0 hsla(0,0%,100%,.3) inset,
--- a/browser/themes/osx/browser.css
+++ b/browser/themes/osx/browser.css
@@ -502,16 +502,23 @@ toolbar .toolbarbutton-1:not([type="menu
 #nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
   -moz-box-orient: horizontal;
 }
 
 #nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker > .dropmarker-icon {
   -moz-margin-start: 10px;
 }
 
+#nav-bar #PanelUI-menu-button {
+  margin-top: 0;
+  margin-bottom: 0;
+  -moz-margin-start: 9px;
+  -moz-margin-end: 7px;
+}
+
 @media not all and (min-resolution: 2dppx) {
 %include ../shared/toolbarbuttons.inc.css
 %include ../shared/menupanel.inc.css
 
   #back-button:hover:active:not([disabled="true"]) {
     -moz-image-region: rect(18px, 36px, 36px, 18px);
   }
 
--- a/browser/themes/shared/customizableui/panelUIOverlay.inc.css
+++ b/browser/themes/shared/customizableui/panelUIOverlay.inc.css
@@ -21,20 +21,16 @@
   background-image: linear-gradient(to bottom, hsla(0,0%,100%,0), hsla(0,0%,100%,.3) 30%, hsla(0,0%,100%,.3) 70%, hsla(0,0%,100%,0)),
                     linear-gradient(to bottom, hsla(210,54%,20%,0), hsla(210,54%,20%,.3) 30%, hsla(210,54%,20%,.3) 70%, hsla(210,54%,20%,0)),
                     linear-gradient(to bottom, hsla(0,0%,100%,0), hsla(0,0%,100%,.3) 30%, hsla(0,0%,100%,.3) 70%, hsla(0,0%,100%,0));
   background-size: 1px calc(100% - 1px), 1px calc(100% - 1px), 1px  calc(100% - 1px) !important;
   background-position: 0px 0px, 1px 0px, 2px 0px;
   background-repeat: no-repeat;
 }
 
-#PanelUI-menu-button {
-  margin: 0 7px 0 9px;
-}
-
 .panel-subviews {
   padding: 4px;
   background-color: hsla(0,0%,100%,.97);
   background-clip: padding-box;
   border-right: 1px solid hsla(210,4%,10%,.2);
   border-left: 1px solid hsla(210,4%,10%,.2);
   box-shadow: 0 3px 5px hsla(210,4%,10%,.1),
               0 0 7px hsla(210,4%,10%,.1);
--- a/browser/themes/windows/browser.css
+++ b/browser/themes/windows/browser.css
@@ -491,16 +491,21 @@ menuitem.bookmark-item {
 
 #nav-bar .toolbarbutton-1:not([type=menu-button]),
 #nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-button,
 #nav-bar .toolbarbutton-1 > .toolbarbutton-menubutton-dropmarker {
   padding: 8px 2px;
   -moz-box-pack: center;
 }
 
+#nav-bar #PanelUI-menu-button {
+  -moz-padding-start: 7px;
+  -moz-padding-end: 5px;
+}
+
 #nav-bar .toolbarbutton-1[type=menu]:not(#back-button):not(#forward-button):not(#feed-button):not(#social-provider-button):not(#PanelUI-menu-button) {
   padding-left: 5px;
   padding-right: 5px;
 }
 
 #nav-bar .toolbarbutton-1 > menupopup {
   margin-top: -3px;
 }