mozilla-central/devtools/client/responsive/test/browser/browser_tooltip.js (file symbol)

Source code

Revision control

Copy as Markdown

Other Tools

Test Info: Errors

/* Any copyright is dedicated to the Public Domain.
"use strict";
const TEST_CONTENT = `<h1 title="test title" style="margin: 5px">test h1</h1>`;
const TEST_URL = `data:text/html;charset=utf-8,${TEST_CONTENT}`;
// Test for the tooltip coordinate on the browsing document in RDM.
addRDMTask(TEST_URL, async ({ ui }) => {
// Make this synthesize mouse events via the parent process because some
// code may cache the mouse cursor position like PresShell. That may prevent
// unexpected DOM events coming from the parent process.
await pushPref("test.events.async.enabled", true);
info("Create a promise which waits until the tooltip will be shown");
const tooltip = ui.browserWindow.gBrowser.ownerDocument.getElementById(
"remoteBrowserTooltip"
);
const onTooltipShown = BrowserTestUtils.waitForEvent(tooltip, "popupshown");
const onTooltipHidden = BrowserTestUtils.waitForEvent(tooltip, "popuphidden");
info("Show a tooltip");
await spawnViewportTask(ui, {}, async () => {
const target = content.document.querySelector("h1");
// First, make sure to move mouse cursor outside the target.
info("Waiting for initial mousemove");
{
// FYI: Some `mousemove` events may not be sent to the content process
// until all preparations done in the main process and the content
// process. Therefore, we need to synthesize `mousemove`s until we
// get it in the remote process at least once. Therefore, we cannot
// use a promise to wait a `mousemove` here and we need to use the while
// loop below.
let mouseMoveFired = false;
content.document.addEventListener(
"mousemove",
event => {
isnot(
event.target,
target,
"The first mousemove should be fired outside the target"
);
mouseMoveFired = true;
},
{
once: true,
}
);
while (!mouseMoveFired) {
await EventUtils.synthesizeMouse(
target,
-2,
-2,
{ type: "mousemove" },
content
);
await EventUtils.synthesizeMouse(
target,
-1,
-1,
{ type: "mousemove" },
content
);
// Wait for the tooltip for the target is hidden even if it was visible.
await new Promise(resolve =>
content.window.requestAnimationFrame(() =>
content.window.requestAnimationFrame(resolve)
)
);
}
}
const eventLogger = event =>
info(
`${event.type}: path=[${event.composedPath()}], outerHTML=${
event.target.outerHTML
}, relatedTarget=${event.relatedTarget?.outerHTML}`
);
target.addEventListener("mouseover", eventLogger);
target.addEventListener("mouseout", eventLogger);
content.document.addEventListener("mousemove", eventLogger);
// Then, move cursor over the target.
await EventUtils.synthesizeMouse(
target,
1,
1,
{ type: "mousemove", isSynthesized: false },
content
);
await EventUtils.synthesizeMouse(
target,
2,
1,
{ type: "mousemove", isSynthesized: false },
content
);
await EventUtils.synthesizeMouse(
target,
3,
1,
{ type: "mousemove", isSynthesized: false },
content
);
});
info("Wait for showing the tooltip");
await onTooltipShown;
info("Test the X coordinate of the tooltip");
isnot(tooltip.screenX, 0, "The X coordinate of tooltip should not be 0");
// Finally, clean up the tooltip if we're running in the verify mode.
info("Wait for hiding the tooltip");
await spawnViewportTask(ui, {}, async () => {
info("Cleaning up the tooltip with moving the cursor");
const target = content.document.querySelector("h1");
await EventUtils.synthesizeMouse(
target,
-1,
-1,
{ type: "mousemove", isSynthesized: false },
content
);
});
await onTooltipHidden;
});