1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
|
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
/* eslint no-unused-vars: [2, {"vars": "local", "args": "none"}] */
"use strict";
/**
* Helper methods for the HTMLTooltip integration tests.
*/
/**
* Display an existing HTMLTooltip on an anchor. After the tooltip "shown"
* event has been fired a reflow will be triggered.
*
* @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 "shown" has been fired, reflow
* and repaint done.
*/
function* showTooltip(tooltip, anchor, {position, x, y} = {}) {
let onShown = tooltip.once("shown");
tooltip.show(anchor, {position, x, y});
yield onShown;
return waitForReflow(tooltip);
}
/**
* 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.
*/
function* hideTooltip(tooltip) {
let onPopupHidden = tooltip.once("hidden");
tooltip.hide();
yield onPopupHidden;
return waitForReflow(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 {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");
let tooltipRect = tooltip.container.getBoundingClientRect();
let anchorRect = anchor.getBoundingClientRect();
if (position === "top") {
is(tooltipRect.bottom, anchorRect.top, "Tooltip is above the anchor");
} else if (position === "bottom") {
is(tooltipRect.top, anchorRect.bottom, "Tooltip is below the anchor");
} else {
ok(false, "Invalid position provided to checkTooltipGeometry");
}
if (leftAligned) {
is(tooltipRect.left, 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");
}
|
