Bug 1263674 - Fix awesomebar popup truncation in RTL. r?mak draft
authorDrew Willcoxon <adw@mozilla.com>
Mon, 11 Apr 2016 10:53:38 -0700
changeset 349479 1bd0ec3fb330bb432108f90da93ebcac75409a2e
parent 348897 34293bb847d1e28198d596a87ea4baf96bfb0286
child 518112 8a6944a23f8b8c551366f19cc8077f3ca2ffe092
push id15101
push userdwillcoxon@mozilla.com
push dateMon, 11 Apr 2016 17:53:53 +0000
reviewersmak
bugs1263674
milestone48.0a1
Bug 1263674 - Fix awesomebar popup truncation in RTL. r?mak MozReview-Commit-ID: HisFFXqyze5
toolkit/content/widgets/autocomplete.xml
--- a/toolkit/content/widgets/autocomplete.xml
+++ b/toolkit/content/widgets/autocomplete.xml
@@ -1997,31 +1997,33 @@ extends="chrome://global/content/binding
           this._actionText.style.removeProperty("max-width");
           ]]>
         </body>
       </method>
 
       <!-- This method truncates the displayed strings as necessary. -->
       <method name="_handleOverflow">
         <body><![CDATA[
+          let itemRect = this.parentNode.getBoundingClientRect();
           let titleRect = this._titleText.getBoundingClientRect();
           let tagsRect = this._tagsText.getBoundingClientRect();
           let urlRect = this._urlText.getBoundingClientRect();
           let actionRect = this._actionText.getBoundingClientRect();
           let urlActionWidth = Math.max(urlRect.width, actionRect.width);
 
           // Total width for the title and URL/action is the width of the item
           // minus the start of the title text minus a little extra padding.
-          // This extra padding amount is basically arbitrary but balances out
-          // the listbox's padding on the left side.
+          // This extra padding amount is basically arbitrary but helps to
+          // visually balance out the listbox's padding on the left side.
+          let dir =
+            this.ownerDocument.defaultView.getComputedStyle(this).direction;
+          let titleStart = dir == "rtl" ? itemRect.right - titleRect.right
+                                        : titleRect.left - itemRect.left;
           let extraPadding = 30;
-          let itemWidth =
-            this.parentNode.getBoundingClientRect().width -
-            this._titleText.getBoundingClientRect().left -
-            extraPadding;
+          let itemWidth = itemRect.width - titleStart - extraPadding;
 
           if (this._tags.hasAttribute("empty")) {
             // The tags box is not displayed in this case.
             tagsRect.width = 0;
           }
 
           let titleTagsWidth = titleRect.width + tagsRect.width;
           if (titleTagsWidth + urlActionWidth > itemWidth) {