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
|
/* This Source Code Form is subject to the terms of the Mozilla Public
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at http://mozilla.org/MPL/2.0/. */
"use strict";
// Check hovering logged nodes highlight them in the content page.
const HTML = `
<!DOCTYPE html>
<html>
<body>
<h1>Node Highlight Test</h1>
</body>
<script>
function logNode(selector) {
console.log(document.querySelector(selector));
}
</script>
</html>
`;
const TEST_URI = "data:text/html;charset=utf-8," + encodeURI(HTML);
add_task(async function () {
const hud = await openNewTabAndConsole(TEST_URI);
const toolbox = hud.toolbox;
const highlighterTestFront = await getHighlighterTestFront(toolbox);
const highlighter = toolbox.getHighlighter();
let onHighlighterShown;
let onHighlighterHidden;
await SpecialPowers.spawn(gBrowser.selectedBrowser, [], () => {
content.wrappedJSObject.logNode("h1");
});
const msg = await waitFor(() => findConsoleAPIMessage(hud, "<h1>"));
const node = msg.querySelector(".objectBox-node");
Assert.notStrictEqual(node, null, "Node was logged as expected");
const view = node.ownerDocument.defaultView;
const nonHighlightEl = toolbox.doc.getElementById(
"toolbox-meatball-menu-button"
);
info("Highlight the node by moving the cursor on it");
onHighlighterShown = highlighter.waitForHighlighterShown();
EventUtils.synthesizeMouseAtCenter(node, { type: "mousemove" }, view);
const { nodeFront } = await onHighlighterShown;
is(nodeFront.displayName, "h1", "The correct node was highlighted");
isVisible = await highlighterTestFront.isHighlighting();
ok(isVisible, "Highlighter is displayed");
info("Unhighlight the node by moving away from the node");
onHighlighterHidden = highlighter.waitForHighlighterHidden();
EventUtils.synthesizeMouseAtCenter(
nonHighlightEl,
{ type: "mousemove" },
view
);
await onHighlighterHidden;
ok(true, "node-unhighlight event was fired when moving away from the node");
info("Check we don't have zombie highlighters when briefly hovering a node");
onHighlighterShown = highlighter.waitForHighlighterShown();
onHighlighterHidden = highlighter.waitForHighlighterHidden();
// Move hover the node and then right after move out.
EventUtils.synthesizeMouseAtCenter(node, { type: "mousemove" }, view);
EventUtils.synthesizeMouseAtCenter(
nonHighlightEl,
{ type: "mousemove" },
view
);
await Promise.all([onHighlighterShown, onHighlighterHidden]);
ok(true, "The highlighter was removed");
isVisible = await highlighterTestFront.isHighlighting();
is(isVisible, false, "The highlighter is not displayed anymore");
});
|
