116 lines
3.4 KiB
JavaScript
116 lines
3.4 KiB
JavaScript
/* Any copyright is dedicated to the Public Domain.
|
|
http://creativecommons.org/publicdomain/zero/1.0/ */
|
|
/* eslint no-unused-vars: [2, {"vars": "local", "args": "none"}] */
|
|
/* import-globals-from ../../shared/test/shared-head.js */
|
|
|
|
"use strict";
|
|
|
|
/**
|
|
* Helper methods for the HTMLTooltip integration tests.
|
|
*/
|
|
|
|
/**
|
|
* Display an existing HTMLTooltip on an anchor and properly wait for the popup to be
|
|
* repainted.
|
|
*
|
|
* @param {HTMLTooltip} tooltip
|
|
* The tooltip instance to display
|
|
* @param {Node} anchor
|
|
* The anchor that should be used to display the tooltip
|
|
* @param {Object} see HTMLTooltip:show documentation
|
|
* @return {Promise} promise that resolves when reflow and repaint are done.
|
|
*/
|
|
async function showTooltip(tooltip, anchor, { position, x, y } = {}) {
|
|
await tooltip.show(anchor, { position, x, y });
|
|
await waitForReflow(tooltip);
|
|
|
|
// Wait for next tick. Tooltip tests sometimes fail to successively hide and
|
|
// show tooltips on Win32 debug.
|
|
await waitForTick();
|
|
}
|
|
|
|
/**
|
|
* Hide an existing HTMLTooltip. After the tooltip "hidden" event has been fired
|
|
* a reflow will be triggered.
|
|
*
|
|
* @param {HTMLTooltip} tooltip
|
|
* The tooltip instance to hide
|
|
* @return {Promise} promise that resolves when "hidden" has been fired, reflow
|
|
* and repaint done.
|
|
*/
|
|
async function hideTooltip(tooltip) {
|
|
const onPopupHidden = tooltip.once("hidden");
|
|
tooltip.hide();
|
|
await onPopupHidden;
|
|
await waitForReflow(tooltip);
|
|
|
|
// Wait for next tick. Tooltip tests sometimes fail to successively hide and
|
|
// show tooltips on Win32 debug.
|
|
await waitForTick();
|
|
}
|
|
|
|
/**
|
|
* 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) {
|
|
const { doc } = tooltip;
|
|
return new Promise(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
|
|
* The HTMLTooltip instance to check
|
|
* @param {Node} anchor
|
|
* The tooltip's anchor
|
|
* @param {Object} expected
|
|
* - {String} position : "top" or "bottom"
|
|
* - {Boolean} leftAligned
|
|
* - {Number} width: expected tooltip width
|
|
* - {Number} height: expected tooltip height
|
|
*/
|
|
function checkTooltipGeometry(
|
|
tooltip,
|
|
anchor,
|
|
{ position, leftAligned = true, height, width } = {}
|
|
) {
|
|
info("Check the tooltip geometry matches expected position and dimensions");
|
|
const tooltipRect = tooltip.container.getBoundingClientRect();
|
|
const anchorRect = anchor.getBoundingClientRect();
|
|
|
|
if (position === "top") {
|
|
is(
|
|
tooltipRect.bottom,
|
|
Math.round(anchorRect.top),
|
|
"Tooltip is above the anchor"
|
|
);
|
|
} else if (position === "bottom") {
|
|
is(
|
|
tooltipRect.top,
|
|
Math.round(anchorRect.bottom),
|
|
"Tooltip is below the anchor"
|
|
);
|
|
} else {
|
|
ok(false, "Invalid position provided to checkTooltipGeometry");
|
|
}
|
|
|
|
if (leftAligned) {
|
|
is(
|
|
tooltipRect.left,
|
|
Math.round(anchorRect.left),
|
|
"Tooltip left-aligned with the anchor"
|
|
);
|
|
}
|
|
|
|
is(tooltipRect.height, height, "Tooltip has the expected height");
|
|
is(tooltipRect.width, width, "Tooltip has the expected width");
|
|
}
|