Bug 1535725 - Follow-up: Fix multiple retrievals of bounding rect on same object. r=darktrojan

calendar/base/content/calendar-multiday-view.xml

@@ -1347,12 +1347,13 @@
             let orient = event.target.getAttribute("orient");
             let scrollbox = document.getAnonymousElementByAttribute(
                            event.target, "anonid", "scrollbox");
+            let boundingRect = scrollbox.getBoundingClientRect();
             if (orient == "vertical") {
-                diffStart = event.clientY - scrollbox.getBoundingClientRect().y;
-                diffEnd = scrollbox.getBoundingClientRect().y + scrollbox.getBoundingClientRect().height - event.clientY;
+                diffStart = event.clientY - boundingRect.y;
+                diffEnd = boundingRect.y + boundingRect.height - event.clientY;
             } else {
-                diffStart = event.clientX - scrollbox.getBoundingClientRect().x;
-                diffEnd = scrollbox.getBoundingClientRect().x + scrollbox.getBoundingClientRect().width - event.clientX;
+                diffStart = event.clientX - boundingRect.x;
+                diffEnd = boundingRect.x + boundingRect.width - event.clientX;
             }
 
             const SCROLLZONE = 55;     // Size (pixels) of the top/bottom view where the scroll starts.
@@ -1370,11 +1371,10 @@
             }
 
             if (insideScrollZone) {
-                let sbo = scrollbox.boxObject;
                 let timeout = MAXTIMEOUT - insideScrollZone * (MAXTIMEOUT - MINTIMEOUT) / SCROLLZONE;
                 this.mMagicScrollTimer = setTimeout(() => {
-                    sbo.scrollBy(orient == "horizontal" && scrollBy,
-                                 orient == "vertical" && scrollBy);
+                    scrollbox.scrollBy(orient == "horizontal" && scrollBy,
+                                       orient == "vertical" && scrollBy);
                     this.onEventSweepMouseMove(event);
                 }, timeout);
             }
@@ -1403,10 +1403,11 @@
             // If we leave the view, then stop our internal sweeping and start a
             // real drag session. Someday we need to fix the sweep to soely be a
             // drag session, no sweeping.
-            if (event.clientX < (event.target.getBoundingClientRect().x) ||
-                event.clientX > (event.target.getBoundingClientRect().x + event.target.getBoundingClientRect().width) ||
-                event.clientY < (event.target.getBoundingClientRect().y) ||
-                event.clientY > (event.target.getBoundingClientRect().y + event.target.getBoundingClientRect().height)) {
+            let boundingRect = event.target.getBoundingClientRect();
+            if (event.clientX < (boundingRect.x) ||
+                event.clientX > (boundingRect.x + boundingRect.width) ||
+                event.clientY < (boundingRect.y) ||
+                event.clientY > (boundingRect.y + boundingRect.height)) {
                 // Remove the drag state
                 for (let column = firstCol, i = firstIndex;
                      column && i < col.mDragState.shadows;
@@ -3567,10 +3568,11 @@
             }
             for (let col of this.mDateColumns) {
                 let element = document.getAnonymousElementByAttribute(col.column, "anonid", "boxstack");
+                let boundingRect = element.getBoundingClientRect();
                 if (aClientX >= element.screenX &&
-                    aClientX <= (element.screenX + element.getBoundingClientRect().width) &&
+                    aClientX <= (element.screenX + boundingRect.width) &&
                     aClientY >= element.screenY &&
-                    aClientY <= (element.screenY + element.getBoundingClientRect().height)) {
+                    aClientY <= (element.screenY + boundingRect.height)) {
                     return col.column;
                 }
             }

calendar/base/content/dialogs/calendar-event-dialog-recurrence.js

@@ -62,16 +62,18 @@ const RecurrencePreview = {
         let row = this.node.querySelector("row");
         let rows = row.parentNode;
 
-        let contentWidth = minimonth.getBoundingClientRect().width;
-        let containerWidth = this.node.getBoundingClientRect().width;
+        let minimonthRect = minimonth.getBoundingClientRect();
+        let nodeRect = this.node.getBoundingClientRect();
+        let contentWidth = minimonthRect.width;
+        let containerWidth = nodeRect.width;
 
         // Now find out how much elements can be displayed.
         // this is a simple division which always yields a positive integer value.
         const cWidth = containerWidth % contentWidth;
         let numHorizontal = (containerWidth - cWidth) / contentWidth;
 
-        let contentHeight = minimonth.getBoundingClientRect().height;
-        let containerHeight = this.node.getBoundingClientRect().height;
+        let contentHeight = minimonthRect.height;
+        let containerHeight = nodeRect.height;
 
         const cHeight = containerHeight % contentHeight;
         // Now find out how much elements can be displayed.

calendar/test/mozmill/testTimezones.js

@@ -266,7 +266,8 @@ function verify(controller, dates, timezones, times) {
             let [correctHour, minutes, day] = selectedTime[tzIdx];
 
             let timeNode = lookup(`${timeLine}/[${correctHour}]`).getNode();
-            let timeY = timeNode.getBoundingClientRect().y + timeNode.getBoundingClientRect().height * (minutes / 60);
+            let boundingRect = timeNode.getBoundingClientRect();
+            let timeY = boundingRect.y + boundingRect.height * (minutes / 60);
 
             let eventNodes = [];
 

common/bindings/richlistbox.xml

@@ -671,8 +671,9 @@
             var y = this.scrollTop + this.getBoundingClientRect().y;
 
             // Partially visible items are also considered visible
-            return (aItem.getBoundingClientRect().y + aItem.clientHeight > y) &&
-                   (aItem.getBoundingClientRect().y < y + this.clientHeight);
+            let boundingRect = aItem.getBoundingClientRect();
+            return (boundingRect.y + aItem.clientHeight > y) &&
+                   (boundingRect.y < y + this.clientHeight);
           ]]>
         </body>
       </method>

common/src/customizeToolbar.js

@@ -113,9 +113,10 @@ function repositionDialog(aWindow) {
     width = document.documentElement.getAttribute("width");
   else
     width = parseInt(document.documentElement.style.width);
+  var boundingRect = gToolbox.getBoundingClientRect();
   var screenX = gToolbox.screenX
-                + ((gToolbox.getBoundingClientRect().width - width) / 2);
-  var screenY = gToolbox.screenY + gToolbox.getBoundingClientRect().height;
+                + ((boundingRect.width - width) / 2);
+  var screenY = gToolbox.screenY + boundingRect.height;
 
   aWindow.moveTo(screenX, screenY);
 }
@@ -674,7 +675,8 @@ function onToolbarDragOver(aEvent) {
     gCurrentDragOverItem = null;
 
     var direction = window.getComputedStyle(dropTarget.parentNode).direction;
-    var dropTargetCenter = dropTarget.getBoundingClientRect().x + (dropTarget.getBoundingClientRect().width / 2);
+    var boundingRect = dropTarget.getBoundingClientRect();
+    var dropTargetCenter = boundingRect.x + (boundingRect.width / 2);
     var dragAfter;
     if (direction == "ltr")
       dragAfter = aEvent.clientX > dropTargetCenter;

editor/ui/composer/content/StructBarContextMenu.js

@@ -111,7 +111,7 @@ function StructChangeTag()
 {
   var textbox = document.createElementNS(XUL_NS, "textbox");
   textbox.setAttribute("value", gContextMenuNode.getAttribute("value"));
-  textbox.setAttribute("width", gContextMenuNode.boxObject.width);
+  textbox.setAttribute("width", gContextMenuNode.getBoundingClientRect().width);
   textbox.className = "struct-textbox";
 
   gContextMenuNode.parentNode.replaceChild(textbox, gContextMenuNode);

mail/base/content/mailWidgets.xml

@@ -144,15 +144,15 @@
         <parameter name="item"/>
         <body><![CDATA[
           let box = this;
+          let boxRect = box.getBoundingClientRect();
+          let itemRect = item.getBoundingClientRect();
 
           // Are we too far down?
           if (item.screenY < box.screenY)
-            box.scrollTop = item.getBoundingClientRect().y - box.getBoundingClientRect().y;
+            box.scrollTop = itemRect.y - boxRect.y;
           // ... or not far enough?
-          else if (item.screenY + item.getBoundingClientRect().height >
-                   box.screenY + box.getBoundingClientRect().height)
-            box.scrollTop = item.getBoundingClientRect().y + item.getBoundingClientRect().height -
-                            box.getBoundingClientRect().y - box.getBoundingClientRect().height;
+          else if (item.screenY + itemRect.height > box.screenY + boxRect.height)
+            box.scrollTop = itemRect.y + itemRect.height - boxRect.y - boxRect.height;
         ]]></body>
       </method>
       <method name="scrollToIndex">

mail/base/content/tabmail.xml

@@ -2300,10 +2300,11 @@
           if ((event.type != "drop") && (event.type != "dragover"))
             return tab;
 
-          if (event.screenX < tab.screenX + tab.getBoundingClientRect().width * .25)
+          let tabRect = tab.getBoundingClientRect();
+          if (event.screenX < tab.screenX + tabRect.width * .25)
             return null;
 
-          if (event.screenX > tab.screenX + tab.getBoundingClientRect().width * .75)
+          if (event.screenX > tab.screenX + tabRect.width * .75)
             return null;
 
           return tab;

mail/base/modules/GlobalPopupNotifications.jsm

@@ -832,23 +832,29 @@ PopupNotifications.prototype = {
 
     this._refreshPanel(notificationsToShow);
 
+    function isNullOrHidden(elem) {
+      if (!elem) {
+        return true;
+      }
+
+      let anchorRect = elem.getBoundingClientRect();
+      return (anchorRect.width == 0 && anchorRect.height == 0);
+    }
+
     // If the anchor element is hidden or null, fall back to the identity icon.
-    if (!anchorElement || (anchorElement.getBoundingClientRect().height == 0 &&
-                           anchorElement.getBoundingClientRect().width == 0)) {
+    if (isNullOrHidden(anchorElement)) {
       anchorElement = this.window.document.getElementById("identity-icon");
 
       // If the identity icon is not available in this window, or maybe the
       // entire location bar is hidden for any reason, use the tab as the
       // anchor. We only ever show notifications for the current browser, so we
       // can just use the current tab.
-      if (!anchorElement || (anchorElement.getBoundingClientRect().height == 0 &&
-                             anchorElement.getBoundingClientRect().width == 0)) {
+      if (isNullOrHidden(anchorElement)) {
         anchorElement = this.tabbrowser.selectedTab;
 
         // If we're in an entirely chromeless environment, set the anchorElement
         // to null and let openPopup show the notification at (0,0) later.
-        if (!anchorElement || (anchorElement.getBoundingClientRect().height == 0 &&
-                               anchorElement.getBoundingClientRect().width == 0)) {
+        if (isNullOrHidden(anchorElement)) {
           anchorElement = null;
         }
       }

mail/components/compose/content/addressingWidgetOverlay.js

@@ -61,9 +61,10 @@ function awInitializeNumberOfRowsShown() {
   // This lets users shrink the address widget to one row (with delicate UX)
   // and thus maximize the space available for composition body,
   // especially on small screens.
-  msgHeadersToolbar.minHeight = msgHeadersToolbar.getBoundingClientRect().height;
+  let toolbarRect = msgHeadersToolbar.getBoundingClientRect();
+  msgHeadersToolbar.minHeight = toolbarRect.height;
 
-  msgHeadersToolbar.height = msgHeadersToolbar.getBoundingClientRect().height +
+  msgHeadersToolbar.height = toolbarRect.height +
     addressingWidget.getBoundingClientRect().height * (awNumRowsShownDefault - 1) +
     extraHeight;
 

mail/test/mozmill/folder-display/test-opening-messages.js

@@ -192,10 +192,11 @@ function check_message_pane_in_window_full_height(aWC) {
   let childrenHeightsSum = 0;
   let childrenHeightsStr = "";
   for (let child of messengerChildren) {
-    if ("boxObject" in child) {
-      childrenHeightsSum += child.getBoundingClientRect().height;
-      childrenHeightsStr += '"' + child.id + '": ' + child.getBoundingClientRect().height + ', ';
-    }
+    try {
+      let childRect = child.getBoundingClientRect();
+      childrenHeightsSum += childRect.height;
+      childrenHeightsStr += '"' + child.id + '": ' + childRect.height + ', ';
+    } catch (ex) {}
   }
 
   assert_equals(messengerWindowHeight, childrenHeightsSum,

mail/test/mozmill/shared-modules/test-folder-display-helpers.js

@@ -1096,12 +1096,14 @@ function _row_click_helper(aController, aTree, aViewIndex, aButton, aExtra) {
   // very important, gotta be able to see the row
   aTree.ensureRowIsVisible(aViewIndex);
   // coordinates of the upper left of the entire tree widget (headers included)
-  let tx = aTree.getBoundingClientRect().x, ty = aTree.getBoundingClientRect().y;
+  let treeRect = aTree.getBoundingClientRect();
+  let tx = treeRect.x, ty = treeRect.y;
   // coordinates of the row display region of the tree (below the headers)
   let children = aController.e(aTree.id, {tagName: "treechildren"});
-  let x = children.getBoundingClientRect().x, y = children.getBoundingClientRect().y;
+  let childrenRect = children.getBoundingClientRect();
+  let x = childrenRect.x, y = childrenRect.y;
   // Click in the middle of the row by default
-  let rowX = children.getBoundingClientRect().width / 2;
+  let rowX = childrenRect.width / 2;
   // For the thread tree, Position our click on the subject column (which cannot
   // be hidden), and far enough in that we are in no danger of clicking the
   // expand toggler unless that is explicitly requested.

mail/test/mozmill/shared-modules/test-mouse-event-helpers.js

@@ -55,11 +55,10 @@ function drag_n_drop_element(aDragObject, aDragWindow, aDropObject,
 
   synthesize_drag_over(aDropWindow, aDropObject, dt);
 
+  let dropRect = aDropObject.getBoundingClientRect();
   synthesize_drop(aDropWindow, aDropObject, dt,
-      { screenX : aDropObject.screenX +
-                    (aDropObject.getBoundingClientRect().width * aRelDropX),
-        screenY : aDropObject.screenY +
-                    (aDropObject.getBoundingClientRect().width * aRelDropY)
+      { screenX : aDropObject.screenX + (dropRect.width * aRelDropX),
+        screenY : aDropObject.screenY + (dropRect.height * aRelDropY)
       });
 }
 
@@ -171,13 +170,13 @@ function _synthesizeDragEvent(aType, aWindow, aDispatcher, aDt, aArgs)
   if (aArgs && ("screenX" in aArgs))
     screenX = aArgs.screenX;
   else
-    screenX = aDispatcher.ScreenX;
+    screenX = aDispatcher.screenX;
 
   let screenY;
   if (aArgs && ("screenY" in aArgs))
     screenY = aArgs.screenY;
   else
-    screenY = aDispatcher.ScreenY;
+    screenY = aDispatcher.screenY;
 
   let event = aWindow.document.createEvent("DragEvent");
   event.initDragEvent(aType, true, true, aWindow, 0,

mail/test/mozmill/tabmail/test-tabmail-dragndrop.js

@@ -234,9 +234,10 @@ function test_tab_reorder_detach(){
   synthesize_drag_over(mc.window, dropContent, dt);
 
   // notify tab1 drag has ended
+  let dropRect = aDropObject.getBoundingClientRect();
   synthesize_drag_end(mc.window, dropContent, tab1, dt,
-      { screenX : (dropContent.screenX + dropContent.getBoundingClientRect().width / 2 ),
-        screenY : (dropContent.screenY + dropContent.getBoundingClientRect().height / 2 ) });
+      { screenX : (dropContent.screenX + dropRect.width / 2 ),
+        screenY : (dropContent.screenY + dropRect.height / 2 ) });
 
   // ... and wait for the new window
   mc2 = wait_for_new_window("mail:3pane");

mailnews/extensions/smime/content/msgCompSecurityInfo.xul

@@ -20,10 +20,10 @@
       function resizeColumns() {
         let list = document.getElementById("infolist");
         let cols = list.getElementsByTagName("treecol");
-        list.style.setProperty("--recipientWidth", cols[0].boxObject.width + "px");
-        list.style.setProperty("--statusWidth", cols[1].boxObject.width + "px");
-        list.style.setProperty("--issuedWidth", cols[2].boxObject.width + "px");
-        list.style.setProperty("--expireWidth", cols[3].boxObject.width - 5 + "px");
+        list.style.setProperty("--recipientWidth", cols[0].getBoundingClientRect().width + "px");
+        list.style.setProperty("--statusWidth", cols[1].getBoundingClientRect().width + "px");
+        list.style.setProperty("--issuedWidth", cols[2].getBoundingClientRect().width + "px");
+        list.style.setProperty("--expireWidth", cols[3].getBoundingClientRect().width - 5 + "px");
       }
       addEventListener("load", resizeColumns, { once: true });
       addEventListener("resize", resizeColumns);

mailnews/import/content/fieldMapImport.xul

@@ -23,8 +23,8 @@
       function resizeColumns() {
         let list = document.getElementById("fieldList");
         let cols = list.getElementsByTagName("treecol");
-        list.style.setProperty("--column1width", cols[0].boxObject.width + "px");
-        list.style.setProperty("--column2width", cols[1].boxObject.width + "px");
+        list.style.setProperty("--column1width", cols[0].getBoundingClientRect().width + "px");
+        list.style.setProperty("--column2width", cols[1].getBoundingClientRect().width + "px");
       }
       addEventListener("load", resizeColumns, { once: true });
       addEventListener("resize", resizeColumns);