Bug 1590408 - Add test to check doorhanger tooltip display on screen edge r=miker
authorJulian Descottes <jdescottes@mozilla.com>
Tue, 12 Nov 2019 15:48:35 +0000
changeset 501663 f1293ec6b6da76ec757a420e2969f444d1531738
parent 501662 40b9a55b447d71a80645db1f043f61047f018663
child 501664 5b26b747f3bd5be47e43b07531a88cc292dfdebb
push id114172
push userdluca@mozilla.com
push dateTue, 19 Nov 2019 11:31:10 +0000
treeherdermozilla-inbound@b5c5ba07d3db [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersmiker
bugs1590408
milestone72.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 1590408 - Add test to check doorhanger tooltip display on screen edge r=miker Depends on D52668 Differential Revision: https://phabricator.services.mozilla.com/D52647
devtools/client/shared/test/browser.ini
devtools/client/shared/test/browser_html_tooltip_screen_edge.js
devtools/client/shared/test/browser_html_tooltip_xul-wrapper.js
--- a/devtools/client/shared/test/browser.ini
+++ b/devtools/client/shared/test/browser.ini
@@ -165,16 +165,17 @@ skip-if = e10s # Bug 1221911, bug 122228
 [browser_html_tooltip_consecutive-show.js]
 [browser_html_tooltip_doorhanger-01.js]
 [browser_html_tooltip_doorhanger-02.js]
 [browser_html_tooltip_height-auto.js]
 [browser_html_tooltip_hover.js]
 [browser_html_tooltip_offset.js]
 [browser_html_tooltip_resize.js]
 [browser_html_tooltip_rtl.js]
+[browser_html_tooltip_screen_edge.js]
 [browser_html_tooltip_variable-height.js]
 [browser_html_tooltip_width-auto.js]
 [browser_html_tooltip_xul-wrapper.js]
 [browser_html_tooltip_zoom.js]
 [browser_inplace-editor-01.js]
 [browser_inplace-editor-02.js]
 [browser_inplace-editor_autoclose_parentheses.js]
 [browser_inplace-editor_autocomplete_01.js]
new file mode 100644
--- /dev/null
+++ b/devtools/client/shared/test/browser_html_tooltip_screen_edge.js
@@ -0,0 +1,74 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+/* import-globals-from helper_html_tooltip.js */
+
+"use strict";
+
+/**
+ * Test the HTMLTooltip "doorhanger" when the anchor is near the edge of the
+ * screen and uses a XUL wrapper. The XUL panel cannot be displayed off screen
+ * at all so this verifies that the calculated position of the tooltip always
+ * ensure that the whole tooltip is rendered on the screen
+ *
+ * See Bug 1590408
+ */
+
+const HTML_NS = "http://www.w3.org/1999/xhtml";
+const TEST_URI = CHROME_URL_ROOT + "doc_html_tooltip_doorhanger-01.xul";
+
+const {
+  HTMLTooltip,
+} = require("devtools/client/shared/widgets/tooltip/HTMLTooltip");
+loadHelperScript("helper_html_tooltip.js");
+
+add_task(async function() {
+  // Force the toolbox to be 200px high;
+  await pushPref("devtools.toolbox.footer.height", 200);
+
+  const [, win, doc] = await createHost("bottom", TEST_URI);
+
+  const originalTop = win.screenTop;
+  const originalLeft = win.screenLeft;
+  const screenWidth = win.screen.width;
+  win.moveTo(screenWidth - win.outerWidth, originalTop);
+
+  registerCleanupFunction(() => {
+    info(`Restore original window position. ${originalTop}, ${originalLeft}`);
+    win.moveTo(originalLeft, originalTop);
+  });
+
+  info("Create a doorhanger HTML tooltip with XULPanel");
+  const tooltip = new HTMLTooltip(doc, {
+    type: "doorhanger",
+    useXulWrapper: true,
+  });
+  const div = doc.createElementNS(HTML_NS, "div");
+  div.style.width = "200px";
+  div.style.height = "35px";
+  tooltip.panel.appendChild(div);
+
+  const anchor = doc.querySelector("#anchor5");
+
+  info("Display the tooltip on an anchor.");
+  await showTooltip(tooltip, anchor);
+
+  const arrow = tooltip.arrow;
+  ok(arrow, "Tooltip has an arrow");
+
+  const panelBounds = tooltip.panel
+    .getBoxQuads({ relativeTo: doc })[0]
+    .getBounds();
+
+  const anchorBounds = anchor.getBoxQuads({ relativeTo: doc })[0].getBounds();
+  ok(
+    anchorBounds.left < panelBounds.right &&
+      panelBounds.left < anchorBounds.right,
+    `The tooltip panel is over (ie intersects) the anchor horizontally: ` +
+      `${anchorBounds.left} < ${panelBounds.right} and ` +
+      `${panelBounds.left} < ${anchorBounds.right}`
+  );
+
+  await hideTooltip(tooltip);
+
+  tooltip.destroy();
+});
--- a/devtools/client/shared/test/browser_html_tooltip_xul-wrapper.js
+++ b/devtools/client/shared/test/browser_html_tooltip_xul-wrapper.js
@@ -35,17 +35,17 @@ add_task(async function() {
 
   const originalTop = win.screenTop;
   const originalLeft = win.screenLeft;
   win.moveTo(100, 100);
 
   registerCleanupFunction(() => {
     info("Restore original window dimensions and position.");
     win.resizeTo(originalWidth, originalHeight);
-    win.moveTo(originalTop, originalLeft);
+    win.moveTo(originalLeft, originalTop);
   });
 
   info("Create HTML tooltip");
   const tooltip = new HTMLTooltip(doc, { useXulWrapper: true });
   const div = doc.createElementNS(HTML_NS, "div");
   div.style.height = "200px";
   div.style.background = "red";
   tooltip.panel.appendChild(div);