Bug 1368535 - translate the matrix also by element's borders; r=gl
authorMatteo Ferretti <mferretti@mozilla.com>
Wed, 07 Jun 2017 12:06:53 +0200
changeset 410792 94fbb0e81d896da3b09968ac5f9383c72a841911
parent 410791 ac7da51d8cccd569c02a76d74d0245369f448b54
child 410793 ff33e6c6f6a55f68d48af4b94b43ae1f54f56ce1
push id7391
push usermtabara@mozilla.com
push dateMon, 12 Jun 2017 13:08:53 +0000
treeherdermozilla-beta@2191d7f87e2e [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersgl
bugs1368535
milestone55.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 1368535 - translate the matrix also by element's borders; r=gl MozReview-Commit-ID: 6otecA8D18y
devtools/server/actors/highlighters/css-grid.js
--- a/devtools/server/actors/highlighters/css-grid.js
+++ b/devtools/server/actors/highlighters/css-grid.js
@@ -1049,31 +1049,34 @@ CssGridHighlighter.prototype = extend(Au
   updateCurrentMatrix() {
     let origin = getNodeTransformOrigin(this.currentNode);
     let bounds = getNodeBounds(this.win, this.currentNode);
     let nodeMatrix = getNodeTransformationMatrix(this.currentNode);
     let computedStyle = this.currentNode.ownerGlobal.getComputedStyle(this.currentNode);
 
     let paddingTop = parseFloat(computedStyle.paddingTop);
     let paddingLeft = parseFloat(computedStyle.paddingLeft);
+    let borderTop = parseFloat(computedStyle.borderTopWidth);
+    let borderLeft = parseFloat(computedStyle.borderLeftWidth);
 
-    // Subtract padding values to compensate for top/left being moved by padding.
-    let ox = origin[0] - paddingLeft;
-    let oy = origin[1] - paddingTop;
+    // Subtract padding and border values to compensate for top/left being moved by
+    // padding and / or borders.
+    let ox = origin[0] - paddingLeft - borderLeft;
+    let oy = origin[1] - paddingTop - borderTop;
 
     let m = identity();
 
     // First, we scale based on the display's current pixel ratio.
     m = multiply(m, scale(getDisplayPixelRatio(this.win)));
     // Then we translate the origin to the node's top left corner.
     m = multiply(m, translate(bounds.p1.x, bounds.p1.y));
     // And scale based on the current zoom factor.
     m = multiply(m, scale(getCurrentZoom(this.win)));
-    // Then translate the origin based on the node's padding values.
-    m = multiply(m, translate(paddingLeft, paddingTop));
+    // Then translate the origin based on the node's padding and border values.
+    m = multiply(m, translate(paddingLeft + borderLeft, paddingTop + borderTop));
     // Finally, we can apply the current node's transformation matrix, taking in account
     // the `transform-origin` property and the node's top and left padding.
     if (nodeMatrix) {
       m = multiply(m, translate(ox, oy));
       m = multiply(m, nodeMatrix);
       m = multiply(m, translate(-ox, -oy));
       this.hasNodeTransformations = true;
     } else {