backout Bug 694954, Bug 689939; a=orange

browser/devtools/highlighter/inspector.jsm

@@ -160,7 +160,6 @@ Highlighter.prototype = {
 
     this.transitionDisabler = null;
 
-    this.computeZoomFactor();
     this.handleResize();
   },
 
@@ -442,10 +441,16 @@ Highlighter.prototype = {
       return this._highlighting; // same rectangle
     }
 
+    // get page zoom factor, if any
+    let zoom =
+      this.win.QueryInterface(Components.interfaces.nsIInterfaceRequestor)
+      .getInterface(Components.interfaces.nsIDOMWindowUtils)
+      .screenPixelsPerCSSPixel;
+
     // adjust rect for zoom scaling
     let aRectScaled = {};
     for (let prop in aRect) {
-      aRectScaled[prop] = aRect[prop] * this.zoom;
+      aRectScaled[prop] = aRect[prop] * zoom;
     }
 
     if (aRectScaled.left >= 0 && aRectScaled.top >= 0 &&
@@ -518,29 +523,14 @@ Highlighter.prototype = {
    */
   moveInfobar: function Highlighter_moveInfobar()
   {
-    if (this._highlightRect) {
+    let rect = this._highlightRect;
-      let winHeight = this.win.innerHeight * this.zoom;
+    if (rect && this._highlighting) {
-      let winWidth = this.win.innerWidth * this.zoom;
-
-      let rect = {top: this._highlightRect.top,
-                  left: this._highlightRect.left,
-                  width: this._highlightRect.width,
-                  height: this._highlightRect.height};
-
-      rect.top = Math.max(rect.top, 0);
-      rect.left = Math.max(rect.left, 0);
-      rect.width = Math.max(rect.width, 0);
-      rect.height = Math.max(rect.height, 0);
-
-      rect.top = Math.min(rect.top, winHeight);
-      rect.left = Math.min(rect.left, winWidth);
-
       this.nodeInfo.container.removeAttribute("disabled");
       // Can the bar be above the node?
       if (rect.top < this.nodeInfo.barHeight) {
         // No. Can we move the toolbar under the node?
         if (rect.top + rect.height +
-            this.nodeInfo.barHeight > winHeight) {
+            this.nodeInfo.barHeight > this.win.innerHeight) {
           // No. Let's move it inside.
           this.nodeInfo.container.style.top = rect.top + "px";
           this.nodeInfo.container.setAttribute("position", "overlap");
@@ -564,8 +554,8 @@ Highlighter.prototype = {
         left = 0;
         this.nodeInfo.container.setAttribute("hide-arrow", "true");
       } else {
-        if (left + barWidth > winWidth) {
+        if (left + barWidth > this.win.innerWidth) {
-          left = winWidth - barWidth;
+          left = this.win.innerWidth - barWidth;
           this.nodeInfo.container.setAttribute("hide-arrow", "true");
         } else {
           this.nodeInfo.container.removeAttribute("hide-arrow");
@@ -648,16 +638,6 @@ Highlighter.prototype = {
     return !INSPECTOR_INVISIBLE_ELEMENTS[nodeName];
   },
 
-  /**
-   * Store page zoom factor.
-   */
-  computeZoomFactor: function Highlighter_computeZoomFactor() {
-    this.zoom =
-      this.win.QueryInterface(Components.interfaces.nsIInterfaceRequestor)
-      .getInterface(Components.interfaces.nsIDOMWindowUtils)
-      .screenPixelsPerCSSPixel;
-  },
-
   /////////////////////////////////////////////////////////////////////////
   //// Event Handling
 
@@ -696,7 +676,6 @@ Highlighter.prototype = {
         this.handleMouseMove(aEvent);
         break;
       case "resize":
-        this.computeZoomFactor();
         this.brieflyDisableTransitions();
         this.handleResize(aEvent);
         break;

browser/devtools/highlighter/test/browser_inspector_highlighter.js

@@ -153,27 +153,29 @@ function finishTestComparisons()
                              .QueryInterface(Ci.nsIMarkupDocumentViewer);
   contentViewer.fullZoom = 2;
 
-  executeSoon(function() {
+  // check what zoom factor we're at, should be 2
-    // check what zoom factor we're at, should be 2
+  let zoom =
-    let zoom = InspectorUI.highlighter.zoom;
+      InspectorUI.win.QueryInterface(Components.interfaces.nsIInterfaceRequestor)
-    is(zoom, 2, "zoom is 2?");
+      .getInterface(Components.interfaces.nsIDOMWindowUtils)
+      .screenPixelsPerCSSPixel;
 
-    // simulate the zoomed dimensions of the div element
+  is(zoom, 2, "zoom is 2?");
-    let divDims = div.getBoundingClientRect();
-    let divWidth = divDims.width * zoom;
-    let divHeight = divDims.height * zoom;
 
-    // now zoomed, get new dimensions of transparent veil box over element
+  // simulate the zoomed dimensions of the div element
-    let veilBoxDims = InspectorUI.highlighter.veilTransparentBox.getBoundingClientRect();
+  let divDims = div.getBoundingClientRect();
-    let veilBoxWidth = veilBoxDims.width;
+  let divWidth = divDims.width * zoom;
-    let veilBoxHeight = veilBoxDims.height;
+  let divHeight = divDims.height * zoom;
 
-    is(veilBoxWidth, divWidth, "transparent veil box width matches width of element (2x zoom)");
+  // now zoomed, get new dimensions of transparent veil box over element
-    is(veilBoxHeight, divHeight, "transparent veil box height matches width of element (2x zoom)");
+  let veilBoxDims = InspectorUI.highlighter.veilTransparentBox.getBoundingClientRect();
+  let veilBoxWidth = veilBoxDims.width;
+  let veilBoxHeight = veilBoxDims.height;
 
-    doc = h1 = div = null;
+  is(veilBoxWidth, divWidth, "transparent veil box width matches width of element (2x zoom)");
-    executeSoon(finishUp);
+  is(veilBoxHeight, divHeight, "transparent veil box height matches width of element (2x zoom)");
-  });
+
+  doc = h1 = div = null;
+  executeSoon(finishUp);
 }
 
 function finishUp() {

browser/devtools/highlighter/test/browser_inspector_infobar.js

@@ -17,8 +17,8 @@ function test()
     waitForFocus(setupInfobarTest, content);
   }, true);
 
-  let style = "body{width:100%;height: 100%} div {position: absolute;height: 100px;width: 500px}#bottom {bottom: 0px}#vertical {height: 100%}#farbottom{bottom: -200px}";
+  let style = "body{width:100%;height: 100%} div {position: absolute;height: 100px;width: 500px}#bottom {bottom: 0px}#vertical {height: 100%}";
-  let html = "<style>" + style + "</style><div id=vertical></div><div id=top class='class1 class2'></div><div id=bottom></div><div id=farbottom></div>"
+  let html = "<style>" + style + "</style><div id=vertical></div><div id=top class='class1 class2'></div><div id=bottom></div>"
 
   content.location = "data:text/html," + encodeURIComponent(html);
 
@@ -28,7 +28,6 @@ function test()
       {node: doc.querySelector("#top"), position: "bottom", tag: "DIV", id: "#top", classes: ".class1 .class2"},
       {node: doc.querySelector("#vertical"), position: "overlap", tag: "DIV", id: "#vertical", classes: ""},
       {node: doc.querySelector("#bottom"), position: "top", tag: "DIV", id: "#bottom", classes: ""},
-      {node: doc.querySelector("#farbottom"), position: "top", tag: "DIV", id: "#farbottom", classes: ""},
       {node: doc.querySelector("body"), position: "overlap", tag: "BODY", id: "", classes: ""},
     ]