Bug 1544030 - Fix quantumbar popup's vertical borders and position on Mac once again. r=mak
authorDão Gottwald <dao@mozilla.com>
Tue, 30 Apr 2019 15:03:21 +0000
changeset 530784 1c84fa9854cfb679f1c336be44dafc952142aee9
parent 530783 1e2987994551c0ff48be5aad4a095dc8f0c52366
child 530785 4369c5635972adec6ec3c81a6c7a650aec454b60
push id11265
push userffxbld-merge
push dateMon, 13 May 2019 10:53:39 +0000
treeherdermozilla-beta@77e0fe8dbdd3 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersmak
bugs1544030
milestone68.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1544030 - Fix quantumbar popup's vertical borders and position on Mac once again. r=mak Differential Revision: https://phabricator.services.mozilla.com/D29340
browser/components/urlbar/UrlbarView.jsm
browser/themes/osx/browser.css
--- a/browser/components/urlbar/UrlbarView.jsm
+++ b/browser/components/urlbar/UrlbarView.jsm
@@ -7,16 +7,17 @@
 var EXPORTED_SYMBOLS = ["UrlbarView"];
 
 const {XPCOMUtils} = ChromeUtils.import("resource://gre/modules/XPCOMUtils.jsm");
 XPCOMUtils.defineLazyModuleGetters(this, {
   Services: "resource://gre/modules/Services.jsm",
   UrlbarPrefs: "resource:///modules/UrlbarPrefs.jsm",
   UrlbarTokenizer: "resource:///modules/UrlbarTokenizer.jsm",
   UrlbarUtils: "resource:///modules/UrlbarUtils.jsm",
+  AppConstants: "resource://gre/modules/AppConstants.jsm",
 });
 
 XPCOMUtils.defineLazyGetter(this, "bundle", function() {
   return Services.strings.createBundle("chrome://global/locale/autocomplete.properties");
 });
 
 /**
  * Receives and displays address bar autocomplete results.
@@ -366,20 +367,26 @@ class UrlbarView {
     } else {
       this.panel.style.removeProperty("--item-padding-start");
       this.panel.style.removeProperty("--item-padding-end");
     }
 
     // Align the panel with the input's parent toolbar.
     let toolbarRect =
       this._getBoundsWithoutFlushing(this.input.textbox.closest("toolbar"));
-    this.panel.style.marginInlineStart = px(this.window.RTL_UI ?
+    let horizontalOffset = this.window.RTL_UI ?
       inputRect.right - documentRect.right :
-      documentRect.left - inputRect.left);
-    this.panel.style.marginTop = px(inputRect.top - toolbarRect.top);
+      documentRect.left - inputRect.left;
+    let verticalOffset = inputRect.top - toolbarRect.top;
+    if (AppConstants.platform == "macosx") {
+      // Adjust vertical offset to account for the popup's native outer border.
+      verticalOffset++;
+    }
+    this.panel.style.marginInlineStart = px(horizontalOffset);
+    this.panel.style.marginTop = px(verticalOffset);
 
     this.panel.openPopup(this.input.textbox, "after_start");
   }
 
   _updateResults(queryContext) {
     let results = queryContext.results;
     let i = 0;
     for (let row of this._rows.children) {
--- a/browser/themes/osx/browser.css
+++ b/browser/themes/osx/browser.css
@@ -331,16 +331,22 @@ html|input.urlbar-input {
 %include ../shared/autocomplete.inc.css
 %include ../shared/urlbar-autocomplete.inc.css
 
 :root {
   --urlbar-popup-url-color: hsl(210, 77%, 47%);
   --urlbar-popup-action-color: hsl(178, 100%, 28%);
 }
 
+/* Remove our custom border since we already get a native one that we can't
+ * seem to override. */
+#urlbar-results {
+  border-style: none;
+}
+
 /* Give an extra margin top to align the top of the awesomebar with the
  * bottom of the nav bar, OSX calculates the panel position with an missing
  * 1px - https://bugzilla.mozilla.org/show_bug.cgi?id=1406353
  */
 #PopupAutoCompleteRichResult {
   margin-top: 1px;
 }