2 <?xml-stylesheet href=
"chrome://global/skin" type=
"text/css"?>
3 <?xml-stylesheet href=
"chrome://mochikit/content/tests/SimpleTest/test.css"
5 <window title=
"Native mouse event tests"
6 xmlns=
"http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
8 <script src=
"chrome://mochikit/content/tests/SimpleTest/SimpleTest.js" />
9 <script src=
"chrome://mochikit/content/tests/SimpleTest/EventUtils.js" />
11 <body xmlns=
"http://www.w3.org/1999/xhtml">
13 <div id=
"content" style=
"display: none">
20 <script class=
"testbody" type=
"application/javascript">
23 const XUL_NS =
"http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
25 var gLeftWindow, gRightWindow, gBrowserElement;
27 function openWindows() {
28 gLeftWindow = window.browsingContext.topChromeWindow
29 .open('empty_window.xhtml', '_blank', 'chrome,screenX=
50,screenY=
50,width=
200,height=
200');
30 SimpleTest.waitForFocus(function () {
31 gRightWindow = window.browsingContext.topChromeWindow
32 .open('empty_window.xhtml', '', 'chrome,screenX=
300,screenY=
50,width=
200,height=
200');
33 SimpleTest.waitForFocus(attachBrowserToLeftWindow, gRightWindow);
37 function attachBrowserToLeftWindow() {
38 gBrowserElement = gLeftWindow.document.createXULElement(
"browser");
39 gBrowserElement.setAttribute(
"type",
"content");
40 gBrowserElement.setAttribute(
"src",
"file_bug596600.html");
41 gBrowserElement.style.width =
"100px";
42 gBrowserElement.style.height =
"100px";
43 gBrowserElement.style.margin =
"50px";
44 gLeftWindow.document.documentElement.appendChild(gBrowserElement);
45 gBrowserElement.addEventListener(
"load", async () =
> {
51 }, { capture: true, once: true });
54 async function test1() {
55 // gRightWindow is active, gLeftWindow is inactive.
56 info(`Synthesizing native
"mousemove" event at top-left of the screen...`);
57 await promiseNativeMouseEvent({
61 scale:
"inScreenPixels",
63 await new Promise(resolve =
> SimpleTest.executeSoon(resolve));
65 // Move into the left window
66 info(`Synthesizing native
"mousemove" event in the left window (but outside the content)...`);
67 await promiseNativeMouseEventAndWaitForEvent({
69 target: gBrowserElement,
73 eventTypeToWait:
"mouseover",
74 eventTargetToListen: gLeftWindow,
76 ok(true, `
"mouseover" event is fired on the left window when cursor is moved into it`);
78 // Move over the browser
79 info(`Synthesizing native
"mousemove" event on the content in the left window...`);
80 await promiseNativeMouseEventAndWaitForEvent({
82 target: gBrowserElement,
85 eventTypeToWait:
"mouseout",
86 eventTargetToListen: gLeftWindow,
88 ok(true, `
"mouseout" event is fired on the left window when cursor is moved into its child browser`);
91 async function test2() {
92 // Make the browser cover the whole window.
93 gBrowserElement.style.margin =
"0";
94 gBrowserElement.style.width = gBrowserElement.style.height =
"200px";
96 // Add a box to the browser at the left edge.
97 var doc = gBrowserElement.contentDocument;
98 var box = doc.createElement(
"div");
99 box.setAttribute(
"id",
"box");
100 box.style.position =
"absolute";
101 box.style.left =
"0";
102 box.style.top =
"50px";
103 box.style.width =
"100px";
104 box.style.height =
"100px";
105 box.style.backgroundColor =
"green";
106 doc.body.appendChild(box);
108 ok(!box.matches(
":hover"),
"Box shouldn't be hovered (since the mouse isn't over it and since it's in a non-clickthrough browser in a background window)");
110 // A function to waitForFocus and then wait for synthetic mouse
111 // events to happen. Note that those happen off the refresh driver,
112 // and happen after animation frame requests.
113 function changeFocusAndAwaitSyntheticMouse(winToFocus,
114 elementToWatchForMouseEventOn) {
116 new Promise(resolve =
> {
117 function mouseWatcher() {
118 elementToWatchForMouseEventOn.removeEventListener(
"mouseover",
120 elementToWatchForMouseEventOn.removeEventListener(
"mouseout",
122 SimpleTest.executeSoon(resolve);
124 elementToWatchForMouseEventOn.addEventListener(
"mouseover",
126 elementToWatchForMouseEventOn.addEventListener(
"mouseout",
129 new Promise(resolve =
> SimpleTest.waitForFocus(resolve, winToFocus)),
133 // Move the mouse over the box.
134 info(`Synthesizing native
"mousemove" event into the box...`);
135 await promiseNativeMouseEvent({
141 await new Promise(resolve =
>
142 requestAnimationFrame(() =
> SimpleTest.executeSoon(resolve))
144 // XXX We cannot guarantee that the native mousemouse have already handled here.
145 ok(!box.matches(
":hover"),
"Box shouldn't be hovered (since it's in a non-clickthrough browser in a background window)");
147 // Activate the left window.
148 info(
"Waiting the left window activated...");
149 await changeFocusAndAwaitSyntheticMouse(gLeftWindow, box);
150 ok(gBrowserElement.matches(
":hover"),
"browser should be hovered");
151 ok(box.matches(
":hover"),
"Box should be hovered");
153 // De-activate the window (by activating the right window).
154 info(
"Waiting the right window activated...");
155 await changeFocusAndAwaitSyntheticMouse(gRightWindow, box);
156 ok(!gBrowserElement.matches(
":hover"),
"browser shouldn't be hovered");
157 ok(!box.matches(
":hover"),
"Box shouldn't be hovered");
160 info(
"Waiting the left window activated again...");
161 await changeFocusAndAwaitSyntheticMouse(gLeftWindow, box);
162 ok(gBrowserElement.matches(
":hover"),
"browser should be hovered");
163 ok(box.matches(
":hover"),
"Box should be hovered");
165 // Unhover the box and the left window.
166 info(`Synthesizing native
"mousemove" event outside the box and the left window...`);
167 await promiseNativeMouseEventAndWaitForEvent({
171 scale:
"inScreenPixels",
173 eventTargetToListen: box,
174 eventTypeToWait:
"mouseout",
176 await new Promise(resolve =
>
177 requestAnimationFrame(() =
> SimpleTest.executeSoon(resolve))
180 ok(!gBrowserElement.matches(
":hover"),
"browser shouldn't be hovered");
181 ok(!box.matches(
":hover"),
"box shouldn't be hovered");
184 SimpleTest.waitForExplicitFinish();
185 SimpleTest.waitForFocus(openWindows);