Bug 1266456 - part2: HTMLTooltip setContent() use object as 2nd arg;r=jsnajdr

setContent expects 3 arguments: content, width, height. Height is already optional
but for the autocomplete migration, the width will also become optional.

Using an object argument for width and height makes this easier.

MozReview-Commit-ID: 9CiMG0BdLOR

--HG--
extra : rebase_source : 4ec54714ccc2476fa4b341aaad3773ba095cca5a

devtools/client/inspector/shared/test/browser_styleinspector_tooltip-closes-on-new-selection.js

@@ -27,7 +27,7 @@ function* testRuleView(ruleView, inspector) {
 
   let tooltip = ruleView.tooltips.previewTooltip;
   let tooltipContent = ruleView.styleDocument.createElementNS(XHTML_NS, "div");
-  yield tooltip.setContent(tooltipContent, 100, 30);
+  yield tooltip.setContent(tooltipContent, {width: 100, height: 30});
 
   // Stop listening for mouse movements because it's not needed for this test,
   // and causes intermittent failures on Linux. When this test runs in the suite
@@ -52,7 +52,8 @@ function* testComputedView(computedView, inspector) {
 
   let tooltip = computedView.tooltips.previewTooltip;
   let tooltipContent = computedView.styleDocument.createElementNS(XHTML_NS, "div");
-  yield tooltip.setContent(tooltipContent, 100, 30);
+  yield tooltip.setContent(tooltipContent, {width: 100, height: 30});
+
   // Stop listening for mouse movements because it's not needed for this test,
   // and causes intermittent failures on Linux. When this test runs in the suite
   // sometimes a mouseleave event is dispatched at the start, which causes the

devtools/client/netmonitor/netmonitor-view.js

@@ -2385,7 +2385,7 @@ RequestsMenuView.prototype = Heritage.extend(WidgetMethods, {
       el.appendChild(frameEl);
     }
 
-    tooltip.setContent(el, REQUESTS_TOOLTIP_STACK_TRACE_WIDTH);
+    tooltip.setContent(el, {width: REQUESTS_TOOLTIP_STACK_TRACE_WIDTH});
 
     return true;
   }),

devtools/client/shared/test/browser_html_tooltip-01.js

@@ -40,7 +40,7 @@ add_task(function* () {
   let tooltip = new HTMLTooltip({doc}, {});
 
   info("Set tooltip content");
-  tooltip.setContent(getTooltipContent(doc), 100, 50);
+  tooltip.setContent(getTooltipContent(doc), {width: 100, height: 50});
 
   is(tooltip.isVisible(), false, "Tooltip is not visible");
 

devtools/client/shared/test/browser_html_tooltip-02.js

@@ -42,7 +42,7 @@ function* testClickInTooltipContent(doc) {
   info("Test a tooltip is not closed when clicking inside itself");
 
   let tooltip = new HTMLTooltip({doc}, {});
-  tooltip.setContent(getTooltipContent(doc), 100, 50);
+  tooltip.setContent(getTooltipContent(doc), {width: 100, height: 50});
   yield showTooltip(tooltip, doc.getElementById("box1"));
 
   let onTooltipContainerClick = once(tooltip.container, "click");
@@ -58,7 +58,7 @@ function* testConsumeOutsideClicksFalse(doc) {
   let box4 = doc.getElementById("box4");
 
   let tooltip = new HTMLTooltip({doc}, {consumeOutsideClicks: false});
-  tooltip.setContent(getTooltipContent(doc), 100, 50);
+  tooltip.setContent(getTooltipContent(doc), {width: 100, height: 50});
   yield showTooltip(tooltip, doc.getElementById("box1"));
 
   let onBox4Clicked = once(box4, "click");
@@ -81,7 +81,7 @@ function* testConsumeOutsideClicksTrue(doc) {
   box4.addEventListener("click", () => box4clicks++);
 
   let tooltip = new HTMLTooltip({doc}, {consumeOutsideClicks: true});
-  tooltip.setContent(getTooltipContent(doc), 100, 50);
+  tooltip.setContent(getTooltipContent(doc), {width: 100, height: 50});
   yield showTooltip(tooltip, doc.getElementById("box1"));
 
   let onHidden = once(tooltip, "hidden");
@@ -99,7 +99,7 @@ function* testClickInOuterIframe(doc) {
   let frame = doc.getElementById("frame");
 
   let tooltip = new HTMLTooltip({doc});
-  tooltip.setContent(getTooltipContent(doc), 100, 50);
+  tooltip.setContent(getTooltipContent(doc), {width: 100, height: 50});
   yield showTooltip(tooltip, doc.getElementById("box1"));
 
   let onHidden = once(tooltip, "hidden");
@@ -118,7 +118,7 @@ function* testClickInInnerIframe(doc) {
   let iframe = doc.createElementNS(HTML_NS, "iframe");
   iframe.style.width = "100px";
   iframe.style.height = "50px";
-  tooltip.setContent(iframe, 100, 50);
+  tooltip.setContent(iframe, {width: 100, height: 50});
   yield showTooltip(tooltip, doc.getElementById("box1"));
 
   let onTooltipContainerClick = once(tooltip.container, "click");

devtools/client/shared/test/browser_html_tooltip-03.js

@@ -132,6 +132,6 @@ function* createTooltip(doc, autofocus) {
   div.style.height = "50px";
   div.innerHTML = '<input type="text"></input>';
 
-  tooltip.setContent(div, 150, 50);
+  tooltip.setContent(div, {width: 150, height: 50});
   return tooltip;
 }

devtools/client/shared/test/browser_html_tooltip-04.js

@@ -43,7 +43,7 @@ add_task(function* () {
   let tooltip = new HTMLTooltip({doc}, {});
   let div = doc.createElementNS(HTML_NS, "div");
   div.style.height = "100%";
-  tooltip.setContent(div, TOOLTIP_WIDTH, TOOLTIP_HEIGHT);
+  tooltip.setContent(div, {width: TOOLTIP_WIDTH, height: TOOLTIP_HEIGHT});
 
   let box1 = doc.getElementById("box1");
   let box2 = doc.getElementById("box2");

devtools/client/shared/test/browser_html_tooltip-05.js

@@ -40,7 +40,7 @@ add_task(function* () {
   let tooltip = new HTMLTooltip({doc}, {});
   let div = doc.createElementNS(HTML_NS, "div");
   div.style.height = "100%";
-  tooltip.setContent(div, TOOLTIP_WIDTH, TOOLTIP_HEIGHT);
+  tooltip.setContent(div, {width: TOOLTIP_WIDTH, height: TOOLTIP_HEIGHT});
 
   let box1 = doc.getElementById("box1");
   let box2 = doc.getElementById("box2");

devtools/client/shared/test/browser_html_tooltip_arrow-01.js

@@ -60,7 +60,7 @@ add_task(function* () {
   let tooltip = new HTMLTooltip({doc}, {type: "arrow"});
   let div = doc.createElementNS(HTML_NS, "div");
   div.style.height = "35px";
-  tooltip.setContent(div, 200, 35);
+  tooltip.setContent(div, {width: 200, height: 35});
 
   let {right: docRight} = doc.documentElement.getBoundingClientRect();
 

devtools/client/shared/test/browser_html_tooltip_arrow-02.js

@@ -54,7 +54,7 @@ add_task(function* () {
   let tooltip = new HTMLTooltip({doc}, {type: "arrow"});
   let div = doc.createElementNS(HTML_NS, "div");
   div.style.height = "35px";
-  tooltip.setContent(div, 200, 35);
+  tooltip.setContent(div, {width: 200, height: 35});
 
   let {right: docRight} = doc.documentElement.getBoundingClientRect();
 

devtools/client/shared/test/browser_html_tooltip_variable-height.js

@@ -40,7 +40,7 @@ add_task(function* () {
   info("Set tooltip content 50px tall, but request a container 200px tall");
   let tooltipContent = doc.createElementNS(HTML_NS, "div");
   tooltipContent.style.cssText = "height: " + TOOLTIP_HEIGHT + "px; background: red;";
-  tooltip.setContent(tooltipContent, CONTAINER_WIDTH, CONTAINER_HEIGHT);
+  tooltip.setContent(tooltipContent, {width: CONTAINER_WIDTH, height: CONTAINER_HEIGHT});
 
   info("Show the tooltip and check the container and panel height.");
   yield showTooltip(tooltip, doc.getElementById("box1"));

devtools/client/shared/widgets/HTMLTooltip.js

@@ -108,15 +108,13 @@ HTMLTooltip.prototype = {
    *
    * @param {Element} content
    *        The tooltip content, should be a HTML element.
-   * @param {Number} width
-   *        Preferred width for the tooltip container
-   * @param {Number} height (optional)
-   *        Preferred height for the tooltip container. If the content height is
-   *        smaller than the container's height, the tooltip will automatically
-   *        shrink around the content. If not specified, will use all the height
-   *        available.
+   * @param {Object}
+   *        - {Number} width: preferred width for the tooltip container
+   *        - {Number} height: optional, preferred height for the tooltip container. This
+   *          parameter acts as a max-height for the tooltip content. If not specified,
+   *          the tooltip will be able to use all the height available.
    */
-  setContent: function (content, width, height = Infinity) {
+  setContent: function (content, {width, height = Infinity}) {
     let themeHeight = EXTRA_HEIGHT[this.type] + 2 * EXTRA_BORDER[this.type];
     let themeWidth = 2 * EXTRA_BORDER[this.type];
 

devtools/client/shared/widgets/tooltip/EventTooltipHelper.js

@@ -160,7 +160,7 @@ EventTooltip.prototype = {
       this._addContentListeners(header);
     }
 
-    this._tooltip.setContent(this.container, CONTAINER_WIDTH);
+    this._tooltip.setContent(this.container, {width: CONTAINER_WIDTH});
     this._tooltip.on("hidden", this.destroy);
   },
 

devtools/client/shared/widgets/tooltip/ImageTooltipHelper.js

@@ -111,7 +111,7 @@ function setImageTooltip(tooltip, doc, imageUrl, options) {
   }
   let width = Math.max(CONTAINER_MIN_WIDTH, imgWidth + 2 * IMAGE_PADDING);
 
-  tooltip.setContent(div, width, height);
+  tooltip.setContent(div, {width, height});
 }
 
 /*
@@ -133,7 +133,7 @@ function setBrokenImageTooltip(tooltip, doc) {
 
   let message = GetStringFromName("previewTooltip.image.brokenImage");
   div.textContent = message;
-  tooltip.setContent(div, 150, 30);
+  tooltip.setContent(div, {width: 150, height: 30});
 }
 
 module.exports.getImageDimensions = getImageDimensions;