[mq]: use-device-pixel-ratio
authorMantaroh Yoshinaga <mantaroh@gmail.com>
Fri, 27 Apr 2018 15:12:33 +0900
changeset 1496875 f0d154be8dafacf0cbd9ad2c5737a9772c5d1a90
parent 1496874 c4e67ed361556cdb3f711e97cd0c840b8031de86
child 1496876 7dd8d0dc985473ca6a948ec067ab19cf10ede767
push id267791
push usermantaroh@gmail.com
push dateFri, 27 Apr 2018 06:44:39 +0000
treeherdertry@0d5b8f93ab57 [default view] [failures only]
milestone61.0a1
[mq]: use-device-pixel-ratio
devtools/client/framework/components/toolbox-tabs.js
devtools/client/framework/components/toolbox-toolbar.js
devtools/client/framework/menu.js
devtools/client/framework/toolbox.js
devtools/client/shared/components/tabs/TabBar.js
--- a/devtools/client/framework/components/toolbox-tabs.js
+++ b/devtools/client/framework/components/toolbox-tabs.js
@@ -211,19 +211,22 @@ class ToolboxTabs extends Component {
               type: "checkbox",
             }));
           }
         });
 
         let rect = target.getBoundingClientRect();
         let screenX = target.ownerDocument.defaultView.mozInnerScreenX;
         let screenY = target.ownerDocument.defaultView.mozInnerScreenY;
+        let devicePixelRatio = target.ownerDocument.defaultView.devicePixelRatio;
 
         // Display the popup below the button.
-        menu.popup(rect.left + screenX, rect.bottom + screenY, toolbox);
+        menu.popup(menu.even(rect.left + screenX) * devicePixelRatio,
+                   menu.even(rect.bottom + screenY) * devicePixelRatio,
+                   toolbox);
         return menu;
       },
     });
   }
 
   /**
    * Render all of the tabs, based on the panel definitions and builds out
    * a toolbox tab for each of them. Will render the chevron button if the
--- a/devtools/client/framework/components/toolbox-toolbar.js
+++ b/devtools/client/framework/components/toolbox-toolbar.js
@@ -423,12 +423,15 @@ function showMeatballMenu(
     click: () => {
       openWebLink("https://discourse.mozilla.org/c/devtools", toolbox);
     },
   }));
 
   const rect = menuButton.getBoundingClientRect();
   const screenX = menuButton.ownerDocument.defaultView.mozInnerScreenX;
   const screenY = menuButton.ownerDocument.defaultView.mozInnerScreenY;
+  let devicePixelRatio = menuButton.ownerDocument.defaultView.devicePixelRatio;
 
   // Display the popup below the button.
-  menu.popup(rect.left + screenX, rect.bottom + screenY, toolbox);
+  menu.popup(menu.even(rect.left + screenX) * devicePixelRatio,
+             menu.even(rect.bottom + screenY) * devicePixelRatio,
+             toolbox);
 }
--- a/devtools/client/framework/menu.js
+++ b/devtools/client/framework/menu.js
@@ -162,16 +162,22 @@ Menu.prototype._createMenuItems = functi
         menuitem.id = item.id;
       }
 
       parent.appendChild(menuitem);
     }
   });
 };
 
+// The popup manager rounds off (or truncates) the coordinates to
+// integers, so ensure we pass in even numbers to openPopupAtScreen
+Menu.prototype.even = function(val) {
+  return (val % 2) ? val + 1 : val;
+};
+
 Menu.setApplicationMenu = () => {
   throw Error("Not implemented");
 };
 
 Menu.sendActionToFirstResponder = () => {
   throw Error("Not implemented");
 };
 
--- a/devtools/client/framework/toolbox.js
+++ b/devtools/client/framework/toolbox.js
@@ -2250,17 +2250,20 @@ Toolbox.prototype = {
     // Show a drop down menu with frames.
     // XXX Missing menu API for specifying target (anchor)
     // and relative position to it. See also:
     // https://developer.mozilla.org/en-US/docs/Mozilla/Tech/XUL/Method/openPopup
     // https://bugzilla.mozilla.org/show_bug.cgi?id=1274551
     let rect = target.getBoundingClientRect();
     let screenX = target.ownerDocument.defaultView.mozInnerScreenX;
     let screenY = target.ownerDocument.defaultView.mozInnerScreenY;
-    menu.popup(rect.left + screenX, rect.bottom + screenY, this);
+    let devicePixelRatio = target.ownerDocument.defaultView.devicePixelRatio;
+    menu.popup(menu.even(rect.left + screenX) * devicePixelRatio,
+               menu.even(rect.bottom + screenY) * devicePixelRatio,
+               this);
 
     return menu;
   },
 
   /**
    * Handle keyDown event on 'frames' button to show available frames
    */
   handleKeyDownOnFramesButton: function(event) {
--- a/devtools/client/shared/components/tabs/TabBar.js
+++ b/devtools/client/shared/components/tabs/TabBar.js
@@ -234,18 +234,20 @@ class Tabbar extends Component {
     // Show a drop down menu with frames.
     // XXX Missing menu API for specifying target (anchor)
     // and relative position to it. See also:
     // https://developer.mozilla.org/en-US/docs/Mozilla/Tech/XUL/Method/openPopup
     // https://bugzilla.mozilla.org/show_bug.cgi?id=1274551
     let rect = target.getBoundingClientRect();
     let screenX = target.ownerDocument.defaultView.mozInnerScreenX;
     let screenY = target.ownerDocument.defaultView.mozInnerScreenY;
-    menu.popup(rect.left + screenX, rect.bottom + screenY,
-      { doc: this.props.menuDocument });
+    let devicePixelRatio = target.ownerDocument.defaultView.devicePixelRatio;
+    menu.popup(menu.even(rect.left + screenX) * devicePixelRatio,
+               menu.even(rect.bottom + screenY) * devicePixelRatio,
+               { doc: this.props.menuDocument });
 
     return menu;
   }
 
   // Rendering
 
   renderTab(tab) {
     if (typeof tab.panel === "function") {