Bug 1267401 - part1: Rename HTMLTooltip properties for backward comp with Tooltip;r=bgrins
authorJulian Descottes <jdescottes@mozilla.com>
Mon, 23 May 2016 22:49:21 +0200
changeset 338000 f8d7e7040b88a0bdc9df708f3ae2540efd625fbb
parent 337999 d721681cae580e407c0a898cf9b6422079a6bbd8
child 338001 5a9b084f41a53cf9a502b51e91e87548782eda11
push id6249
push userjlund@mozilla.com
push dateMon, 01 Aug 2016 13:59:36 +0000
treeherdermozilla-beta@bad9d4f5bf7e [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersbgrins
bugs1267401
milestone49.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 1267401 - part1: Rename HTMLTooltip properties for backward comp with Tooltip;r=bgrins Rename document -> doc for consistency and parent to panel for test compatibility. MozReview-Commit-ID: KHT7plLtNQc
devtools/client/shared/test/helper_html_tooltip.js
devtools/client/shared/widgets/HTMLTooltip.js
--- a/devtools/client/shared/test/helper_html_tooltip.js
+++ b/devtools/client/shared/test/helper_html_tooltip.js
@@ -47,20 +47,20 @@ function* hideTooltip(tooltip) {
 /**
  * Forces the reflow of an HTMLTooltip document and waits for the next repaint.
  *
  * @param {HTMLTooltip} the tooltip to reflow
  * @return {Promise} a promise that will resolve after the reflow and repaint
  *         have been executed.
  */
 function waitForReflow(tooltip) {
-  let {document} = tooltip;
+  let {doc} = tooltip;
   return new Promise(resolve => {
-    document.documentElement.offsetWidth;
-    document.defaultView.requestAnimationFrame(resolve);
+    doc.documentElement.offsetWidth;
+    doc.defaultView.requestAnimationFrame(resolve);
   });
 }
 
 /**
  * Test helper designed to check that a tooltip is displayed at the expected
  * position relative to an anchor, given a set of expectations.
  *
  * @param {HTMLTooltip} tooltip
--- a/devtools/client/shared/widgets/HTMLTooltip.js
+++ b/devtools/client/shared/widgets/HTMLTooltip.js
@@ -26,23 +26,23 @@ const IFRAME_CONTAINER_ID = "tooltip-ifr
  *        - {Boolean} consumeOutsideClicks
  *          Defaults to true. The tooltip is closed when clicking outside.
  *          Should this event be stopped and consumed or not.
  */
 function HTMLTooltip(toolbox,
   {type = "normal", autofocus = true, consumeOutsideClicks = true} = {}) {
   EventEmitter.decorate(this);
 
-  this.document = toolbox.doc;
+  this.doc = toolbox.doc;
   this.type = type;
   this.autofocus = autofocus;
   this.consumeOutsideClicks = consumeOutsideClicks;
 
   // Use the topmost window to listen for click events to close the tooltip
-  this.topWindow = this.document.defaultView.top;
+  this.topWindow = this.doc.defaultView.top;
 
   this._onClick = this._onClick.bind(this);
 
   this.container = this._createContainer();
 
   // Promise that will resolve when the container can be filled with content.
   this.containerReady = new Promise(resolve => {
     if (this._isXUL()) {
@@ -64,25 +64,16 @@ function HTMLTooltip(toolbox,
 module.exports.HTMLTooltip = HTMLTooltip;
 
 HTMLTooltip.prototype = {
   position: {
     TOP: "top",
     BOTTOM: "bottom",
   },
 
-  get parent() {
-    if (this._isXUL()) {
-      // In XUL context, we are wrapping the HTML content in an iframe.
-      let win = this.container.contentWindow.wrappedJSObject;
-      return win.document.getElementById(IFRAME_CONTAINER_ID);
-    }
-    return this.container;
-  },
-
   /**
    * Set the tooltip content element. The preferred width/height should also be
    * specified here.
    *
    * @param {Element} content
    *        The tooltip content, should be a HTML element.
    * @param {Number} width
    *        Preferred width for the tooltip container
@@ -91,18 +82,18 @@ HTMLTooltip.prototype = {
    * @return {Promise} a promise that will resolve when the content has been
    *         added in the tooltip container.
    */
   setContent: function (content, width, height) {
     this.preferredWidth = width;
     this.preferredHeight = height;
 
     return this.containerReady.then(() => {
-      this.parent.innerHTML = "";
-      this.parent.appendChild(content);
+      this.panel.innerHTML = "";
+      this.panel.appendChild(content);
     });
   },
 
   /**
    * Show the tooltip next to the provided anchor element. A preferred position
    * can be set. The event "shown" will be fired after the tooltip is displayed.
    *
    * @param {Element} anchor
@@ -128,64 +119,73 @@ HTMLTooltip.prototype = {
       this.container.style.top = top + "px";
       this.container.style.left = left + "px";
       this.container.style.display = "block";
 
       if (this.autofocus) {
         this.container.focus();
       }
 
-      this.attachEventsTimer = this.document.defaultView.setTimeout(() => {
+      this.attachEventsTimer = this.doc.defaultView.setTimeout(() => {
         this.topWindow.addEventListener("click", this._onClick, true);
         this.emit("shown");
       }, 0);
     });
   },
 
   /**
    * Hide the current tooltip. The event "hidden" will be fired when the tooltip
    * is hidden.
    */
   hide: function () {
-    this.document.defaultView.clearTimeout(this.attachEventsTimer);
+    this.doc.defaultView.clearTimeout(this.attachEventsTimer);
 
     if (this.isVisible()) {
       this.topWindow.removeEventListener("click", this._onClick, true);
       this.container.style.display = "none";
       this.emit("hidden");
     }
   },
 
+  get panel() {
+    if (this._isXUL()) {
+      // In XUL context, we are wrapping the HTML content in an iframe.
+      let win = this.container.contentWindow.wrappedJSObject;
+      return win.document.getElementById(IFRAME_CONTAINER_ID);
+    }
+    return this.container;
+  },
+
   /**
    * Check if the tooltip is currently displayed.
    * @return {Boolean} true if the tooltip is visible
    */
   isVisible: function () {
-    let win = this.document.defaultView;
+    let win = this.doc.defaultView;
     return win.getComputedStyle(this.container).display != "none";
   },
 
   /**
    * Destroy the tooltip instance. Hide the tooltip if displayed, remove the
    * tooltip container from the document.
    */
   destroy: function () {
     this.hide();
     this.container.remove();
   },
 
   _createContainer: function () {
     let container;
     if (this._isXUL()) {
-      container = this.document.createElementNS(XHTML_NS, "iframe");
+      container = this.doc.createElementNS(XHTML_NS, "iframe");
       container.classList.add("devtools-tooltip-iframe");
-      this.document.querySelector("window").appendChild(container);
+      this.doc.querySelector("window").appendChild(container);
     } else {
-      container = this.document.createElementNS(XHTML_NS, "div");
-      this.document.body.appendChild(container);
+      container = this.doc.createElementNS(XHTML_NS, "div");
+      this.doc.body.appendChild(container);
     }
 
     container.classList.add("theme-body");
     container.classList.add("devtools-htmltooltip-container");
 
     return container;
   },
 
@@ -197,23 +197,23 @@ HTMLTooltip.prototype = {
     this.hide();
     if (this.consumeOutsideClicks) {
       e.preventDefault();
       e.stopPropagation();
     }
   },
 
   _isInTooltipContainer: function (node) {
-    let contentWindow = this.parent.ownerDocument.defaultView;
+    let contentWindow = this.panel.ownerDocument.defaultView;
     let win = node.ownerDocument.defaultView;
 
     if (win === contentWindow) {
       // If node is in the same window as the tooltip, check if the tooltip
       // parent contains node.
-      return this.parent.contains(node);
+      return this.panel.contains(node);
     }
 
     // Otherwise check if the node window is in the tooltip window.
     while (win.parent && win.parent != win) {
       win = win.parent;
       if (win === contentWindow) {
         return true;
       }
@@ -221,20 +221,20 @@ HTMLTooltip.prototype = {
     return false;
   },
 
   _findBestPosition: function (anchor, position) {
     let top, left;
     let {TOP, BOTTOM} = this.position;
 
     let {left: anchorLeft, top: anchorTop, height: anchorHeight}
-      = this._getRelativeRect(anchor, this.document);
+      = this._getRelativeRect(anchor, this.doc);
 
     let {bottom: docBottom, right: docRight} =
-      this.document.documentElement.getBoundingClientRect();
+      this.doc.documentElement.getBoundingClientRect();
 
     let height = this.preferredHeight;
     // Check if the popup can fit above the anchor.
     let availableTop = anchorTop;
     let fitsAbove = availableTop >= height;
     // Check if the popup can fit below the anchor.
     let availableBelow = docBottom - (anchorTop + anchorHeight);
     let fitsBelow = availableBelow >= height;
@@ -285,11 +285,11 @@ HTMLTooltip.prototype = {
     // Compute right and bottom coordinates using the rest of the data.
     let right = left + width;
     let bottom = top + height;
 
     return {top, right, bottom, left, width, height};
   },
 
   _isXUL: function () {
-    return this.document.documentElement.namespaceURI === XUL_NS;
+    return this.doc.documentElement.namespaceURI === XUL_NS;
   },
 };