Bug 1468953 - Use node bounds in viewport instead of offsets from offsetParent. r=jdescottes, a=lizzard
authorDaisuke Akatsuka <dakatsuka@mozilla.com>
Tue, 26 Jun 2018 10:51:40 +0900
changeset 480278 c1d5fc9c6abff4aaab56948463592c112b0d54d8
parent 480277 01156ddc21ac01bed44c9eed988e34f9a6cab95a
child 480279 ba5c8834fe515abe183c0a8f0cad39d5046a1351
push id1757
push userffxbld-merge
push dateFri, 24 Aug 2018 17:02:43 +0000
treeherdermozilla-release@736023aebdb1 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersjdescottes, lizzard
bugs1468953
milestone62.0
Bug 1468953 - Use node bounds in viewport instead of offsets from offsetParent. r=jdescottes, a=lizzard MozReview-Commit-ID: nqMLetevCZ
devtools/client/shared/components/splitter/SplitBox.js
--- a/devtools/client/shared/components/splitter/SplitBox.js
+++ b/devtools/client/shared/components/splitter/SplitBox.js
@@ -161,42 +161,43 @@ class SplitBox extends Component {
 
   /**
    * Adjust size of the controlled panel. Depending on the current
    * orientation we either remember the width or height of
    * the splitter box.
    */
   onMove(x, y) {
     const node = ReactDOM.findDOMNode(this);
+    const nodeBounds = node.getBoundingClientRect();
 
     let size;
     let { endPanelControl, vert } = this.state;
 
     if (vert) {
       // Use the document owning the SplitBox to detect rtl. The global document might be
       // the one bound to the toolbox shared BrowserRequire, which is irrelevant here.
       const doc = node.ownerDocument;
 
       // Switch the control flag in case of RTL. Note that RTL
       // has impact on vertical splitter only.
       if (doc.dir === "rtl") {
         endPanelControl = !endPanelControl;
       }
 
       size = endPanelControl ?
-        (node.offsetLeft + node.offsetWidth) - x :
-        x - node.offsetLeft;
+        (nodeBounds.left + nodeBounds.width) - x :
+        x - nodeBounds.left;
 
       this.setState({
         width: size
       });
     } else {
       size = endPanelControl ?
-        (node.offsetTop + node.offsetHeight) - y :
-        y - node.offsetTop;
+        (nodeBounds.top + nodeBounds.height) - y :
+        y - nodeBounds.top;
 
       this.setState({
         height: size
       });
     }
   }
 
   // Rendering