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 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134
|
<!DOCTYPE HTML>
<html>
<!--
https://bugzilla.mozilla.org/show_bug.cgi?id=633602
-->
<head>
<title>Bug 633602 - file_childIframe.html</title>
<script src="/tests/SimpleTest/SimpleTest.js">
</script>
<script src="/tests/SimpleTest/EventUtils.js"></script>
<script type="application/javascript" src="pointerlock_utils.js"></script>
<link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
<style>
#parent, #childDiv, #iframe, #table, #table td {
margin: 0;
padding: 0;
border: none;
}
#iframe, #table {
background-color: red;
width: 100%;
height: 100%;
}
#childDiv, #table td {
background-color: blue;
width: 50%;
height: 50%;
}
</style>
</head>
<body>
<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=633602">
Mozilla Bug 633602
</a>
<div id="parent">
<table id="childTable">
<tr>
<td>
<iframe id="iframe" src="iframe_differentDOM.html">
</iframe>
</td>
<td>
<div id="childDiv">
</div>
</td>
</tr>
</table>
</div>
<pre id="test">
<script type="application/javascript">
/*
* Test for Bug 633602
* Check if pointer is locked when over a child iframe of
* the locked element
* Check if pointer is being repositioned back to center of
* the locked element even when pointer goes over a child ifame
*/
SimpleTest.waitForExplicitFinish();
var parent = document.getElementById("parent")
, childDiv = document.getElementById("childDiv")
, iframe = document.getElementById("iframe");
function MovementStats() {
this.movementX = false;
this.movementY = false;
}
var firstMove = new MovementStats()
, secondMove = new MovementStats()
, hoverIframe = false;
function runTests () {
ok(hoverIframe, "Pointer should be locked even when pointer " +
"hovers over a child iframe");
is(firstMove.movementX, secondMove.movementX, "MovementX of first " +
"move to childDiv should be equal to movementX of second move " +
"to child div");
is(firstMove.movementY, secondMove.movementY, "MovementY of first " +
"move to childDiv should be equal to movementY of second move " +
"to child div");
}
var firstMoveChild = function (e) {
firstMove.movementX = e.movementX;
firstMove.movementY = e.movementY;
parent.removeEventListener("mousemove", firstMoveChild);
parent.addEventListener("mousemove", moveIframe);
synthesizeMouseAtCenter(iframe, {type: "mousemove"}, window);
};
var moveIframe = function (e) {
hoverIframe = !!document.pointerLockElement;
parent.removeEventListener("mousemove", moveIframe);
parent.addEventListener("mousemove", secondMoveChild);
synthesizeMouseAtCenter(childDiv, {type: "mousemove"}, window);
};
var secondMoveChild = function (e) {
secondMove.movementX = e.movementX;
secondMove.movementY = e.movementY;
parent.removeEventListener("mousemove", secondMoveChild);
addFullscreenChangeContinuation("exit", function() {
runTests();
SimpleTest.finish();
});
document.exitFullscreen();
};
document.addEventListener("pointerlockchange", function () {
if (document.pointerLockElement === parent) {
parent.addEventListener("mousemove", firstMoveChild);
synthesizeMouseAtCenter(childDiv, {type: "mousemove"}, window);
}
});
function start() {
addFullscreenChangeContinuation("enter", function() {
parent.requestPointerLock();
});
parent.requestFullscreen();
}
</script>
</pre>
</body>
</html>
|