Bug 1374230 - Wrong tooltip position after resizing browser window r?mconley draft
authorRicky Chien <ricky060709@gmail.com>
Mon, 19 Jun 2017 17:38:57 +0800
changeset 599378 9a03f8a0de900e195e30bbf72aa4281297e74935
parent 599255 b1b9129838ade91684574f42219b2010928d7db4
child 634759 bd19d43f2f554e834f4166d0b02a2a944434c04d
push id65507
push userbmo:rchien@mozilla.com
push dateFri, 23 Jun 2017 03:48:35 +0000
reviewersmconley
bugs1374230
milestone56.0a1
Bug 1374230 - Wrong tooltip position after resizing browser window r?mconley MozReview-Commit-ID: GYPjtzRTQdf
browser/components/preferences/in-content-new/findInPage.js
--- a/browser/components/preferences/in-content-new/findInPage.js
+++ b/browser/components/preferences/in-content-new/findInPage.js
@@ -13,16 +13,29 @@ var gSearchResultsPane = {
   init() {
     this.searchResultsCategory = document.getElementById("category-search-results");
 
     this.searchInput = document.getElementById("searchInput");
     this.searchInput.hidden = !Services.prefs.getBoolPref("browser.preferences.search");
     if (!this.searchInput.hidden) {
       this.searchInput.addEventListener("command", this);
       this.searchInput.addEventListener("focus", this);
+
+      // Throttling the resize event to reduce the callback frequency
+      let callbackId;
+      window.addEventListener("resize", () => {
+        if (!callbackId) {
+          callbackId = window.requestAnimationFrame(() => {
+            this.listSearchTooltips.forEach((anchorNode) => {
+              this.calculateTooltipPosition(anchorNode);
+            });
+            callbackId = null;
+          });
+        }
+      });
     }
   },
 
   handleEvent(event) {
     if (event.type === "command") {
       this.searchFunction(event);
     } else if (event.type === "focus") {
       this.initializeCategories();
@@ -386,16 +399,22 @@ var gSearchResultsPane = {
     let searchTooltip = anchorNode.ownerDocument.createElement("span");
     searchTooltip.setAttribute("class", "search-tooltip");
     searchTooltip.textContent = query;
 
     anchorNode.setAttribute("data-has-tooltip", "true");
     anchorNode.parentElement.classList.add("search-tooltip-parent");
     anchorNode.parentElement.appendChild(searchTooltip);
 
+    this.calculateTooltipPosition(anchorNode);
+  },
+
+  calculateTooltipPosition(anchorNode) {
+    let searchTooltip = anchorNode.parentElement.querySelector(":scope > .search-tooltip");
+
     // In order to get the up-to-date position of each of the nodes that we're
     // putting tooltips on, we have to flush layout intentionally, and that
     // this is the result of a XUL limitation (bug 1363730).
     let anchorRect = anchorNode.getBoundingClientRect();
     let tooltipRect = searchTooltip.getBoundingClientRect();
     let parentRect = anchorNode.parentElement.getBoundingClientRect();
 
     let offSet = (anchorRect.width / 2) - (tooltipRect.width / 2);