Add m-esr52 at 52.6.0

author: Matt A. Tobin <mattatobin@localhost.localdomain> 2018-02-02 04:16:08 -0500
committer: Matt A. Tobin <mattatobin@localhost.localdomain> 2018-02-02 04:16:08 -0500
commit: 5f8de423f190bbb79a62f804151bc24824fa32d8 (patch)
tree: 10027f336435511475e392454359edea8e25895d /testing/web-platform/tests/pointerlock
parent: 49ee0794b5d912db1f95dce6eb52d781dc210db5 (diff)
download: UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.gz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.lz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.xz
UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.zip
12 files changed, 1173 insertions, 0 deletions
diff --git a/testing/web-platform/tests/pointerlock/OWNERS b/testing/web-platform/tests/pointerlock/OWNERS
new file mode 100644
index 000000000..640884d64
--- /dev/null
+++ b/testing/web-platform/tests/pointerlock/OWNERS
@@ -0,0 +1,2 @@
+@scheib
+@siusin
+\ No newline at end of file
diff --git a/testing/web-platform/tests/pointerlock/constructor.html b/testing/web-platform/tests/pointerlock/constructor.html
new file mode 100644
index 000000000..8c43cf6da
--- /dev/null
+++ b/testing/web-platform/tests/pointerlock/constructor.html
@@ -0,0 +1,53 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Pointer Lock event constructor</title>
+    <script src="/resources/testharness.js"></script>
+    <script src="/resources/testharnessreport.js"></script>
+    <link rel="help" href="http://www.w3.org/TR/pointerlock/#pointerlockchange-and-pointerlockerror-events">
+    <link rel="help" href="http://www.w3.org/TR/dom/#interface-event">
+  </head>
+  <body>
+    <p>Create Pointer Lock events and check each default value.</p>
+    <div id='log'></div>
+    <script>
+test(function() {
+  var ev = new MouseEvent("pointerlockchange");
+  assert_equals(ev.type, "pointerlockchange");
+  assert_equals(ev.target, null);
+  assert_equals(ev.currentTarget, null);
+  assert_equals(ev.bubbles, false);
+  assert_equals(ev.eventPhase, Event.NONE);
+  assert_equals(ev.cancelable, false);
+  assert_true("preventDefault" in ev);
+  assert_equals(ev.defaultPrevented, false);
+  assert_true(ev.timeStamp > 0);
+  assert_true("initEvent" in ev);
+  assert_true("movementX" in ev, "movementX exists");
+  assert_true("movementY" in ev, "movementY exists");
+  assert_equals(ev.movementX, 0);
+  assert_equals(ev.movementY, 0);
+}, "Default event values for mouse event interface and its pointer lock extensions.");
+test(function() {
+  var ev = new MouseEvent("pointerlockerror",
+                            { type: "trololol",
+                              bubbles: true,
+                              cancelable: false,
+                              get defaultPrevented() {
+                                  assert_unreached("Should not look at the defaultPrevented property.");
+                               },
+                              movementX: 10,
+                              movementY: 10});
+  assert_equals(ev.type, "pointerlockerror");
+  assert_equals(ev.bubbles, true); // this is synthetic event, so follow the dictionary
+  assert_equals(ev.cancelable, false);
+  assert_equals(ev.defaultPrevented, false);
+  assert_equals(ev.movementX, 10); // this is synthetic event, so follow the dictionary
+  assert_equals(ev.movementY, 10); // this is synthetic event, so follow the dictionary
+}, "Default event values for pointerlockerror using a dictionary");
+   </script>
+
+</body>
+
+</html>
diff --git a/testing/web-platform/tests/pointerlock/idlharness.html b/testing/web-platform/tests/pointerlock/idlharness.html
new file mode 100644
index 000000000..aa876f58f
--- /dev/null
+++ b/testing/web-platform/tests/pointerlock/idlharness.html
@@ -0,0 +1,85 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta charset="utf-8">
+<title>Pointer Lock IDL tests</title>
+<link rel="author" title="W3C" href="http://www.w3.org/" />
+<link rel="help" href="http://www.w3.org/TR/pointerlock/#element-interface"/>
+<link rel="help" href="http://www.w3.org/TR/pointerlock/#extensions-to-the-document-interface">
+<link rel="help" href="http://www.w3.org/TR/pointerlock/#extensions-to-the-mouseevent-interface">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/WebIDLParser.js"></script>
+<script src="/resources/idlharness.js"></script>
+</head>
+
+<body>
+<h1>Pointer Lock IDL tests</h1>
+
+<pre id='untested_idl' style='display:none'>
+
+interface EventTarget {
+};
+
+interface Node : EventTarget {
+};
+
+interface Element : Node {
+};
+
+interface Document : Node {
+};
+
+interface Event {
+};
+
+interface MouseEvent : Event {
+};
+</pre>
+
+<pre id='idl'>
+
+partial interface Element {
+    void requestPointerLock ();
+};
+
+partial interface Document {
+                attribute EventHandler onpointerlockchange;
+                attribute EventHandler onpointerlockerror;
+    readonly    attribute Element?     pointerLockElement;
+    void exitPointerLock ();
+};
+
+partial interface MouseEvent {
+    readonly    attribute long movementX;
+    readonly    attribute long movementY;
+};
+
+partial dictionary MouseEventInit {
+        long movementX = 0;
+        long movementY = 0;
+};
+
+
+</pre>
+
+<div id="log"></div>
+
+<script>
+
+var idl_array = new IdlArray();
+
+setup(function() {
+	idl_array.add_untested_idls(document.getElementById("untested_idl").textContent);
+	idl_array.add_idls(document.getElementById("idl").textContent);
+
+	idl_array.add_objects({ Document: ["window.document"],
+                            Element: ["window.document.documentElement"],
+                            MouseEvent: ["new MouseEvent('mousemove')", "new MouseEvent('pointerlockchange')"] });
+});
+
+idl_array.test();
+
+</script>
+</body>
+</html>
diff --git a/testing/web-platform/tests/pointerlock/movementX_Y_basic-manual.html b/testing/web-platform/tests/pointerlock/movementX_Y_basic-manual.html
new file mode 100644
index 000000000..1e8fc1f53
--- /dev/null
+++ b/testing/web-platform/tests/pointerlock/movementX_Y_basic-manual.html
@@ -0,0 +1,124 @@
+<!DOCTYPE html>
+<html>
+<body>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<meta name='flags' content='interact'>
+<meta name="timeout" content="long">
+<style type="text/css">
+    #status-log {
+        margin: 10px 0;
+        color: green;
+        color: green;
+    }
+</style>
+</head>
+<body>
+    <h2>Description</h2>
+    <p>This test if movementX/Y can provide the change in position of the pointer, as if movementX/Y = eNow.screenX/Y-ePrevious.screenX/Y</p>
+    <hr/>
+
+    <h2>Manual Test Steps:</h2>
+    <p>
+        <ol>
+            <li>Click to start Test1.</li>
+            <li>Move the mouse within the window, slow and fast, like a scribble.</li>
+            <li>Click again to end test.</li>
+        </ol>
+    </p>
+    <hr/>
+
+    <div id="status-log">Waiting... Click to start loging.</div>
+    <div class="data-log">
+	    <table>
+	    	<tr><td></td><td>X</td><td>Y</td></tr>
+	    	<tr><td>client_init:</td><td id="clientX_init-log">X</td><td id="clientY_init-log">Y</td></tr>
+	    	<tr><td>client_last:</td><td id="clientX_last-log">X</td><td id="clientY_last-log">Y</td></tr>
+	    	<tr><td>client_delta:</td><td id="clientX_delta-log">X</td><td id="clientY_delta-log">Y</td></tr>
+	    	<tr><td>movement_sum:</td><td id="movementX_sum-log">X</td><td id="movementY_sum-log">Y</td></tr>
+	    	<tr><td>movement:</td><td id="movementX-log">X</td><td id="movementY-log">Y</td></tr>
+	    </table>
+    </div>
+    <hr/>
+
+    <div id="log"></div>
+
+    <script type="text/javascript" >
+        var status_log = document.querySelector('#status-log'),
+            movementX_log = document.querySelector('#movementX-log'),
+            movementY_log = document.querySelector('#movementY-log'),
+            movementX_sum_log = document.querySelector('#movementX_sum-log'),
+            movementY_sum_log = document.querySelector('#movementY_sum-log'),
+            clientX_init_log = document.querySelector('#clientX_init-log'),
+            clientY_init_log = document.querySelector('#clientY_init-log'),
+            clientX_last_log = document.querySelector('#clientX_last-log'),
+            clientY_last_log = document.querySelector('#clientY_last-log');
+            clientX_delta_log = document.querySelector('#clientX_delta-log'),
+            clientY_delta_log = document.querySelector('#clientY_delta-log');
+
+        var click_counter = 0;
+
+        var clientX_init, clientY_init, movementX, movementY, movementX_sum, movementY_sum, clientX_last, clientY_last;
+
+        var movementX_Y_inside_window_Test = async_test("Test that movementX/Y = eNow.screenX/Y-ePrevious.screenX/Y.");
+
+        document.addEventListener("click", function (e) {
+            click_counter++;
+
+            switch(click_counter) {
+                case 1:
+                    status_log.innerHTML = "inside window: logging...";
+                break;
+                case 2:
+                    status_log.innerHTML = "inside window: done";
+
+                    // approximately(+/- 10)
+                    // a little drift should be tollerated
+                    movementX_Y_inside_window_Test.step(function() {
+                        assert_equals(movementX_sum, clientX_last - clientX_init, "sum of movementX = clientX_init - clientX_last");
+                        assert_equals(movementY_sum, clientY_last - clientY_init, "sum of movementY = clientY_init - clientY_last");
+                    });
+                    movementX_Y_inside_window_Test.done();
+                break;
+            }
+        });
+
+        document.addEventListener("mousemove", function (e) {
+            movementX = e.movementX;
+            movementY = e.movementY;
+
+            if(click_counter === 1) {
+                if(!clientX_init) {
+                    clientX_init = e.clientX;
+                    clientY_init = e.clientY;
+                    movementX_sum = movementX;
+                    movementY_sum = movementY;
+                }
+
+                movementX_sum += movementX;
+                movementY_sum += movementY;
+
+                clientX_last = e.clientX;
+                clientY_last = e.clientY;
+                clientX_delta = clientX_last - clientX_init;
+                clientY_delta = clientY_last - clientY_init;
+
+                updateData();
+            }
+        });
+
+        function updateData() {
+            clientX_init_log.innerHTML = clientX_init;
+            clientY_init_log.innerHTML = clientY_init;
+            clientX_last_log.innerHTML = clientX_last;
+            clientY_last_log.innerHTML = clientY_last;
+            clientX_delta_log.innerHTML = clientX_delta;
+            clientY_delta_log.innerHTML = clientY_delta;
+            movementX_log.innerHTML = movementX;
+            movementY_log.innerHTML = movementY;
+            movementX_sum_log.innerHTML = movementX_sum;
+            movementY_sum_log.innerHTML = movementY_sum;
+        }
+        </script>
+    </body>
+</html>
diff --git a/testing/web-platform/tests/pointerlock/movementX_Y_no-jumps-manual.html b/testing/web-platform/tests/pointerlock/movementX_Y_no-jumps-manual.html
new file mode 100644
index 000000000..9c8fabd28
--- /dev/null
+++ b/testing/web-platform/tests/pointerlock/movementX_Y_no-jumps-manual.html
@@ -0,0 +1,140 @@
+<!DOCTYPE html>
+<html>
+<body>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<meta name='flags' content='interact'>
+<meta name="timeout" content="long">
+<style type="text/css">
+    #status-log {
+        margin: 10px 0;
+        color: green;
+        color: green;
+    }
+</style>
+</head>
+<body>
+    <h2>Description</h2>
+    <p>This test that movementX/Y do not jump by a large value when exiting and re-entering the window.</p>
+    <hr/>
+
+    <h2>Manual Test Steps:</h2>
+    <p>
+        <ol>
+            <li>Make sure the window is not maximized.</li>
+            <li>Click to start Test.</li>
+            <li>Move the mouse slowly out of the window.
+            <li>Move as fast as needed to a different location outside the window at least 100 pixels away</li>
+            <li>Slowly re-enter the window.</li>
+            <li>Click again to end tests.</li>
+        </ol>
+    </p>
+    <hr/>
+
+    <div id="status-log">Waiting... Click to start loging.</div>
+    <div class="data-log">
+	    <table>
+	    	<tr><td></td><td>X</td><td>Y</td></tr>
+	    	<tr><td>client_init:</td><td id="clientX_init-log">X</td><td id="clientY_init-log">Y</td></tr>
+	    	<tr><td>client_last:</td><td id="clientX_last-log">X</td><td id="clientY_last-log">Y</td></tr>
+	    	<tr><td>client_delta:</td><td id="clientX_delta-log">X</td><td id="clientY_delta-log">Y</td></tr>
+	    	<tr><td>movement_sum:</td><td id="movementX_sum-log">X</td><td id="movementY_sum-log">Y</td></tr>
+	    	<tr><td>movement:</td><td id="movementX-log">X</td><td id="movementY-log">Y</td></tr>
+	    </table>
+    </div>
+    <hr/>
+
+    <div id="log"></div>
+
+    <script type="text/javascript" >
+        var status_log = document.querySelector('#status-log'),
+            movementX_log = document.querySelector('#movementX-log'),
+            movementY_log = document.querySelector('#movementY-log'),
+            movementX_sum_log = document.querySelector('#movementX_sum-log'),
+            movementY_sum_log = document.querySelector('#movementY_sum-log'),
+            clientX_init_log = document.querySelector('#clientX_init-log'),
+            clientY_init_log = document.querySelector('#clientY_init-log'),
+            clientX_last_log = document.querySelector('#clientX_last-log'),
+            clientY_last_log = document.querySelector('#clientY_last-log');
+            clientX_delta_log = document.querySelector('#clientX_delta-log'),
+            clientY_delta_log = document.querySelector('#clientY_delta-log');
+
+        var click_counter = 0;
+
+        var clientX_init, clientY_init, movementX, movementY, movementX_sum, movementY_sum, clientX_last, clientY_last;
+
+        var movementX_Y_outside_window_Test = async_test("Test that movementX/Y do not have large values when re-entering from outside the window.");
+
+        document.addEventListener("click", function (e) {
+            click_counter++;
+
+            switch(click_counter) {
+                case 1:
+                    status_log.innerHTML = "logging...";
+                break;
+                case 2:
+                    status_log.innerHTML = "done";
+
+                    // approximately(+/- 10)
+                    // a little drift should be tollerated
+                    movementX_Y_outside_window_Test.step(function() {
+                        assert_equals(movementX_sum, clientX_last - clientX_init, "sum of movementX = clientX_init - clientX_last");
+                        assert_equals(movementY_sum, clientY_last - clientY_init, "sum of movementY = clientY_init - clientY_last");
+                    });
+                    movementX_Y_outside_window_Test.done();
+                break;
+            }
+        });
+
+        document.addEventListener("mousemove", function (e) {
+            movementX = e.movementX;
+            movementY = e.movementY;
+
+            if(click_counter === 1) {
+                if(!clientX_init) {
+                    clientX_init = e.clientX;
+                    clientY_init = e.clientY;
+                    movementX_sum = movementX;
+                    movementY_sum = movementY;
+                }
+
+	            movementX_Y_outside_window_Test.step(function() {
+	            	assert_less_than(Math.abs(movementX), 50, "movementX should not have large jumps in value.");
+	            	assert_less_than(Math.abs(movementY), 50, "movementY should not have large jumps in value.");
+	            });
+
+                movementX_sum += movementX;
+                movementY_sum += movementY;
+
+                clientX_last = e.clientX;
+                clientY_last = e.clientY;
+                clientX_delta = clientX_last - clientX_init;
+                clientY_delta = clientY_last - clientY_init;
+
+                updateData();
+            }
+        });
+
+        document.addEventListener("mouseenter", function (e) {
+            if(click_counter === 1) {
+	            movementX_Y_outside_window_Test.step(function() {
+                    assert_greater_than(Math.abs(e.clientX-clientX_last) + Math.abs(e.clientY-clientY_last), 100, "Test requires mouse to be moved at least 100 pixels outside of window.");
+	            });
+	        }
+        });
+
+        function updateData() {
+            clientX_init_log.innerHTML = clientX_init;
+            clientY_init_log.innerHTML = clientY_init;
+            clientX_last_log.innerHTML = clientX_last;
+            clientY_last_log.innerHTML = clientY_last;
+            clientX_delta_log.innerHTML = clientX_delta;
+            clientY_delta_log.innerHTML = clientY_delta;
+            movementX_log.innerHTML = movementX;
+            movementY_log.innerHTML = movementY;
+            movementX_sum_log.innerHTML = movementX_sum;
+            movementY_sum_log.innerHTML = movementY_sum;
+        }
+        </script>
+    </body>
+</html>
diff --git a/testing/web-platform/tests/pointerlock/pointerlock_basic-manual.html b/testing/web-platform/tests/pointerlock/pointerlock_basic-manual.html
new file mode 100644
index 000000000..d926318ab
--- /dev/null
+++ b/testing/web-platform/tests/pointerlock/pointerlock_basic-manual.html
@@ -0,0 +1,149 @@
+<!DOCTYPE html>
+<html>
+<body>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<meta name='flags' content='interact'>
+<meta name="timeout" content="long">
+<style type="text/css">
+    button {
+        color: blue;
+    }
+
+    #locktarget {
+        position: relative;
+        background-color: grey;
+        width: 50px;
+        color: white;
+        line-height: 30px;
+        height: 30px;
+    }
+
+    #basic-log {
+        margin: 10px 0;
+        color: green;
+    }
+</style>
+</head>
+<body>
+    <h2>Description</h2>
+    <p>This test validates that the pointer properly be locked in a DOM element, and exit afterwards.</p>
+    <hr/>
+
+    <h2>Manual Test Steps:</h2>
+    <p>
+        <ol>
+            <li>Click the "Lock Target" to test if requestPointerLock() and exitPointerLock() causing a pointerlockchange event.</li>
+            <li>Confirm the lock with a user action (in Firefox).</li>
+            <li>Exit the pointer lock with a user action (usually 'esc'), to test if the cursor is at the same location.</li>
+            <li>Click the "ReEnterLock" to test that no engagement gesture is required to reenter pointer lock if pointer lock is exited via exitPointerLock.</li>
+            <li>Exit the pointer lock with a user action (usually 'esc').</li>
+            <li>Click the "RepeatLock" to validate that each requestPointerLock() will fire a pointerlockchange event.</li>
+            <li>Exit the pointer lock with a user action (usually 'esc').</li>
+        </ol>
+    </p>
+    <hr/>
+
+    <button onclick="LockTarget();">Lock Target</button>
+    <button onclick="ReEnterLock();">ReEnter Lock</button>
+    <button onclick="RepeatLock();">Repeat Lock</button>
+    <div id="basic-log">Waiting... Please click the "Lock Target" button.</div>
+    <div id="locktarget">Target</div>
+    <hr/>
+
+    <div id="log"></div>
+
+    <script type="text/javascript" >
+        var locktarget = document.querySelector('#locktarget'),
+            lock_log = document.querySelector('#basic-log');
+
+        var pointerlockchangeIsFiredonRequest = false;
+        var posX = posY = 0;
+        var event_counter = 0;
+        var request_counter = 0;
+
+        var requestPointerLockTest = async_test("Test that the pointer properly be locked in a DOM element.");
+        var exitPointerLockTest = async_test("Test that the pointer lock properly be exited, the cursor is at the same location when exited.");
+        var reenterPointerLockTest = async_test("Test that no engagement gesture is required to reenter pointer lock if pointer lock is exited via exitPointerLock.");
+        var repeatLockPointerTest = async_test("Test validates that each requestPointerLock() will fire a pointerlockchange event.");
+
+        document.addEventListener("pointerlockchange", function() {
+            event_counter ++;
+
+            if(event_counter === 1) {
+                pointerlockchangeIsFiredonRequest = true;
+                runRequestPointerLockTest();
+            } else if(event_counter === 2) {
+                runExitPointerLockTest();
+            } else if(event_counter === 3) {
+                runReEnterPointerLockTest()
+            } else if(event_counter > 104) {
+                runRepeatLockPointerTest();
+            }
+        });
+
+        function runRequestPointerLockTest() {
+            posX = window.screenX;
+            posY = window.screenY;
+
+            requestPointerLockTest.step(function() {
+                assert_true(pointerlockchangeIsFiredonRequest === true, "pointerlockchange is fired when requesting pointerlock");
+                assert_true(document.pointerLockElement === locktarget, "pointer is locked at the target element");
+            });
+
+            lock_log.innerHTML = "Pointer is locked on the target element;";
+
+            requestPointerLockTest.done();
+        }
+
+        function runExitPointerLockTest() {
+            locktarget.requestPointerLock(); // To re-enter pointer lock
+
+            exitPointerLockTest.step(function() {
+                assert_true(document.pointerLockElement === null, "pointer is unlocked");
+                assert_equals(posX, window.screenX, "mouse cursor X is at the same location that it was when pointer lock was entered");
+                assert_equals(posY, window.screenY, "mouse cursor Y is at the same location that it was when pointer lock was entered");
+            });
+
+            lock_log.innerHTML = "Status: Exited pointer lock; Please click the 'Re-enter Lock' button and exit the lock.";
+
+            exitPointerLockTest.done();
+        }
+
+        function runReEnterPointerLockTest() {
+            reenterPointerLockTest.step(function() {
+                assert_true(document.pointerLockElement === locktarget, "Pointer is locked again without engagement gesture");
+            });
+
+            lock_log.innerHTML = "Status: Exited pointer lock; Please click the 'Repeat Lock' button and exit the lock.";
+
+            reenterPointerLockTest.done();
+        }
+
+        function runRepeatLockPointerTest() {
+            repeatLockPointerTest.step(function() {
+                assert_equals(request_counter + 5, event_counter, "Each requestPointerLock() will fire a pointerlockchange event");
+            });
+
+            lock_log.innerHTML = "Status: Test over.";
+
+            repeatLockPointerTest.done();
+        }
+
+        function LockTarget() {
+            locktarget.requestPointerLock();
+        }
+
+        function ReEnterLock() {
+            locktarget.requestPointerLock();
+        }
+
+        function RepeatLock() {
+            for(var i = 0; i < 100; i++) {
+                request_counter++;
+                locktarget.requestPointerLock();
+            }
+        }
+        </script>
+    </body>
+</html>
diff --git a/testing/web-platform/tests/pointerlock/pointerlock_fullscreen-manual.html b/testing/web-platform/tests/pointerlock/pointerlock_fullscreen-manual.html
new file mode 100644
index 000000000..7ce91ad16
--- /dev/null
+++ b/testing/web-platform/tests/pointerlock/pointerlock_fullscreen-manual.html
@@ -0,0 +1,173 @@
+<!DOCTYPE html>
+<html>
+<body>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<meta name='flags' content='interact'>
+<meta name="timeout" content="long">
+<style type="text/css">
+    button {
+        color: blue;
+    }
+
+    #test-element-wrap {
+        position: relative;
+        background-color: lightgrey;
+        width: 400px;
+        height: 200px;
+        border: grey 1px solid;
+    }
+
+    #test-element {
+        position: relative;
+        background-color: lightyellow;
+        width: 100px;
+        height: 30px;
+        border: yellow 1px solid;
+    }
+
+    #status-log {
+        margin: 10px 0;
+        color: green;
+    }
+</style>
+</head>
+<body>
+    <h2>Description</h2>
+    <p>This test validates that pointer lock won't be exited when fullscreen is entered or exited, unless fullscreen is exited with the same user gesture as pointer lock.</p>
+    <hr/>
+
+    <h2>Manual Test Steps:</h2>
+    <p>
+        <ol>
+            <li>Click the "scriptExitFullscreen" button.</li>
+            <li>If the exitFullscreen doesn't work, use the menu (or any other interaction except for the "esc" key) to exit fullscreen.</li>
+            <li>First test case done.</li>
+            <li>Click the "gestureExitFullscreen" button.</li>
+            <li>Use the "esc" key to exit fullscreen.</li>
+            <li>Second test case done.</li>
+        </ol>
+    </p>
+    <hr/>
+
+    <button onclick="scriptExitFullscreen();">scriptExitFullscreen</button>
+    <button onclick="gestureExitFullscreen();">gestureExitFullscreen</button>
+
+    <div id="test-element-wrap">
+        <div id="status-log">Waiting... Please click the "scriptExitFullscreen" button.</div>
+        <div id="test-element">Target</div>
+    </div>
+    <hr/>
+
+    <div id="log"></div>
+
+    <script type="text/javascript" >
+        var test_element = document.querySelector('#test-element'),
+            test_element_wrap = document.querySelector('#test-element-wrap')
+            status_log = document.querySelector('#status-log');
+        var enable_gestureExitFullscreen = false;
+        var gestureExit_pl = false;
+        var gestureExit_fs = false;
+        var gestureLock = false;
+
+        var scriptExitFullscreenTest = async_test("Test that pointer lock won't be exited when fullscreen is entered or exited with script.");
+        var gestureExitFullscreenTest = async_test("Test that pointer lock is exited when fullscreen is entered or exited with the same user gesture.");
+
+    function RequestFullscreen(element) {
+        var requestFullscreen = element.requestFullscreen || element.webkitRequestFullscreen || element.mozRequestFullscreen || element.msRequestFullscreen;
+        requestFullscreen.call(element);
+    }
+
+    function ExitFullscreen() {
+        var exitFullscreen = document.exitFullscreen || document.webkitExitFullscreen || document.mozExitFullscreen || document.msExitFullscreen;
+        exitFullscreen.call(document);
+    }
+
+    function FullscreenElement() {
+        var fullscreenElement = document.fullscreenElement || document.webkitFullscreenElement || document.mozFullscreenElement || document.msFullscreenElement;
+        return fullscreenElement ? fullscreenElement : null;
+    }
+
+    document.addEventListener("pointerlockchange", function() {
+        if(!enable_gestureExitFullscreen) {
+            // first test, enable fullscreen and pointer lock
+            if(document.pointerLockElement) {
+                ExitFullscreen();
+                logStatus();
+
+                scriptExitFullscreenTest.step(function() {
+                    assert_true(FullscreenElement() === null, "fullscreen is sucessfully exited");
+                    assert_true(document.pointerLockElement === test_element, "pointer is still locked at the target element");
+                });
+                scriptExitFullscreenTest.done();
+                document.exitPointerLock();
+            } else{
+            // first test, fullscreen and pointer lock are exited
+                enable_gestureExitFullscreen = true;
+            }
+        } else {
+            gestureLock = true;
+            if(!document.pointerLockElement) {
+            // second test, pointer lock exited
+                gestureExit_pl = true;
+
+                if(gestureExit_fs) {
+                // second test, fullscreen and pointer lock both exited
+                    gestureExitFullscreenTest.step(function() {
+                        assert_true(document.pointerLockElement === null, "pointer is sucessfully exited");
+                        assert_true(FullscreenElement() === null, "fullscreen is sucessfully exited");
+                });
+                gestureExitFullscreenTest.done();
+                }
+            }
+        }
+    });
+
+    document.addEventListener("fullscreenchange", fullscreenChangeHandler);
+
+    document.addEventListener("webkitfullscreenchange",fullscreenChangeHandler);
+
+    function fullscreenChangeHandler() {
+        if(enable_gestureExitFullscreen && gestureLock && !FullscreenElement()) {
+            if(gestureExit_pl) {
+            // second test, fullscreen and pointer lock both exited
+                gestureExitFullscreenTest.step(function() {
+                    assert_true(document.pointerLockElement === null, "pointer is sucessfully exited");
+                    assert_true(FullscreenElement() === null, "fullscreen is sucessfully exited");
+                });
+
+            gestureExitFullscreenTest.done();
+        } else {
+                gestureExit_fs = true;
+            }
+        }
+    }
+
+        function logStatus() {
+            var status = "";
+            if(document.pointerLockElement) {
+                status = "<p>Pointer is Locked.</p>"
+            } else {
+                status = "<p>Pointer Lock exited.</p>"
+            }
+            if(FullscreenElement()) {
+                status += "<p>Fullscreen is on now.</p>"
+            } else {
+                status += "<p>Fullscreen exited.</p>"
+            }
+
+            status_log.innerHTML = status;
+        }
+
+        function scriptExitFullscreen() {
+            test_element.requestPointerLock();
+            RequestFullscreen(test_element_wrap);
+        }
+
+        function gestureExitFullscreen() {
+            RequestFullscreen(test_element_wrap);
+            test_element.requestPointerLock();
+        }
+        </script>
+    </body>
+</html>
diff --git a/testing/web-platform/tests/pointerlock/pointerlock_indefinite-manual.html b/testing/web-platform/tests/pointerlock/pointerlock_indefinite-manual.html
new file mode 100644
index 000000000..0db1227ad
--- /dev/null
+++ b/testing/web-platform/tests/pointerlock/pointerlock_indefinite-manual.html
@@ -0,0 +1,107 @@
+<!DOCTYPE html>
+<html>
+<body>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<meta name='flags' content='interact'>
+<meta name="timeout" content="long">
+<style type="text/css">
+    button {
+        color: blue;
+    }
+
+    #target-wrap {
+        position: relative;
+        background-color: lightgrey;
+        width: 400px;
+        height: 150px;
+        border: grey 1px solid;
+    }
+
+    #target-wrap span, #status-log {
+        color: green;
+    }
+</style>
+</head>
+<body>
+    <h2>Description</h2>
+    <p>This test validates that movementX/Y provided indefinitely even when the mouse cursor would have otherwise hit the edge of a screen.</p>
+    <hr/>
+
+    <h2>Manual Test Steps:</h2>
+    <p>
+        <ol>
+            <li>Click the "lockTarget" button to request a pointer lock.</li>
+            <li>Move the pointer constantly in a diagonal direction (e.g. up and right).</li>
+            <li>Test is done.</li>
+        </ol>
+    </p>
+    <hr/>
+
+    <button onclick="lockTarget();">lockTarget</button>
+
+    <div id="target-wrap">
+        <div id="status-log">Click the "lockTarget" button.</div>
+        <p>screenSize: <span id="screenSize-log">NaN</span></p>
+        <p>movementX_sum: <span id="movementX_sum-log">NaN</span></p>
+        <p>movementY_sum: <span id="movementY_sum-log">NaN</span></p>
+    </div>
+    <hr/>
+
+    <div id="log"></div>
+
+    <script type="text/javascript" >
+        var screenSize_log = document.querySelector('#screenSize-log'),
+            movementX_sum_log = document.querySelector('#movementX_sum-log'),
+            movementY_sum_log = document.querySelector('#movementY_sum-log'),
+            status_log = document.querySelector('#status-log'),
+            target = document.querySelector('#target-wrap');
+        var movementX_sum = 0,
+            movementY_sum = 0;
+        var screenWidth = screen.width,
+            screenHeight = screen.height;
+
+        var enable_logging = false;
+
+        screenSize_log.innerHTML = "width: " + screenWidth + " px, " + "height: " + screenHeight + " px"
+
+        var movementXYIndefiniteTest = async_test("Test that movementX/Y provided indefinitely even when the mouse cursor would have otherwise hit the edge of a screen.");
+
+    document.addEventListener("pointerlockchange", function() {
+        if(document.pointerLockElement) {
+            status_log.innerHTML = "Keep moving...";
+            enable_logging = true;
+        }
+    });
+
+    document.addEventListener("mousemove", function (e) {
+        if(enable_logging) {
+            movementX_sum += Math.abs(e.movementX);
+            movementY_sum += Math.abs(e.movementY);
+
+            movementX_sum_log.innerHTML = movementX_sum + "px";
+            movementY_sum_log.innerHTML = movementY_sum + "px";
+
+            if(movementX_sum > 2 * screen.width && movementY_sum > 2 * screen.height) {
+                movementXYIndefiniteTest.step(function() {
+                    assert_greater_than(movementX_sum, 2 * screenWidth, "Sum of movementX is greater than 2 times of screen width");
+                    assert_greater_than(movementY_sum, 2 * screenHeight, "Sum of movementY is greater than 2 times of screen height");
+                });
+
+                movementXYIndefiniteTest.done();
+
+                status_log.innerHTML = "Test succeeds...";
+
+                enable_logging = false;
+
+                document.exitPointerLock();
+            }
+        }
+        });
+
+    function lockTarget() {
+        target.requestPointerLock();
+    }
+    </script>
+    </body>
+</html>
diff --git a/testing/web-platform/tests/pointerlock/pointerlock_leave_Tab-manual.html b/testing/web-platform/tests/pointerlock/pointerlock_leave_Tab-manual.html
new file mode 100644
index 000000000..198e2fe63
--- /dev/null
+++ b/testing/web-platform/tests/pointerlock/pointerlock_leave_Tab-manual.html
@@ -0,0 +1,85 @@
+<!DOCTYPE html>
+<html>
+<body>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<meta name='flags' content='interact'>
+<meta name="timeout" content="long">
+<style type="text/css">
+    button {
+        color: blue;
+    }
+
+    #target-wrap {
+        position: relative;
+        background-color: lightgrey;
+        width: 200px;
+        height: 100px;
+        border: grey 1px solid;
+    }
+
+    #target {
+        position: relative;
+        background-color: lightyellow;
+        width: 100px;
+        height: 30px;
+        border: yellow 1px solid;
+    }
+
+    #status-log {
+        margin: 10px 0;
+        color: green;
+    }
+</style>
+</head>
+<body>
+    <h2>Description</h2>
+    <p>This test validates that pointer lock will be lost the user agent / window loses focus.</p>
+    <hr/>
+
+    <h2>Manual Test Steps:</h2>
+    <p>
+        <ol>
+            <li>Click the "lockTarget" button to request a pointer lock.</li>
+            <li>Focus to another tab with keyboard (Ctrl-TAB).</li>
+            <li>Test is done.</li>
+        </ol>
+    </p>
+    <hr/>
+
+    <button onclick="lockTarget();">lockTarget</button>
+
+    <div id="target-wrap">
+        <div id="status-log">Click the "lockTarget" button.</div>
+        <div id="target">Target</div>
+    </div>
+    <hr/>
+
+    <div id="log"></div>
+
+    <script type="text/javascript" >
+        var target = document.querySelector('#target'),
+            status_log = document.querySelector('#status-log');
+
+        var leaveTabTest = async_test("Test that pointer lock will be lost when the current Tab loses focus.");
+
+    document.addEventListener("pointerlockchange", function() {
+        if(document.pointerLockElement) {
+            status_log.innerHTML = "Please leave the current tab.";
+        } else {
+            status_log.innerHTML = "Pointer lock exited!";
+
+            leaveTabTest.step(function() {
+                assert_true(document.pointerLockElement === null, "Pointer lock exited!");
+            });
+
+            leaveTabTest.done();
+        }
+    });
+
+    function lockTarget() {
+        target.requestPointerLock();
+    }
+    </script>
+    </body>
+</html>
diff --git a/testing/web-platform/tests/pointerlock/pointerlock_leave_UA-manual.html b/testing/web-platform/tests/pointerlock/pointerlock_leave_UA-manual.html
new file mode 100644
index 000000000..e14400844
--- /dev/null
+++ b/testing/web-platform/tests/pointerlock/pointerlock_leave_UA-manual.html
@@ -0,0 +1,85 @@
+<!DOCTYPE html>
+<html>
+<body>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<meta name='flags' content='interact'>
+<meta name="timeout" content="long">
+<style type="text/css">
+    button {
+        color: blue;
+    }
+
+    #target-wrap {
+        position: relative;
+        background-color: lightgrey;
+        width: 200px;
+        height: 100px;
+        border: grey 1px solid;
+    }
+
+    #target {
+        position: relative;
+        background-color: lightyellow;
+        width: 100px;
+        height: 30px;
+        border: yellow 1px solid;
+    }
+
+    #status-log {
+        margin: 10px 0;
+        color: green;
+    }
+</style>
+</head>
+<body>
+    <h2>Description</h2>
+    <p>This test validates that pointer lock will be lost the user agent / window loses focus.</p>
+    <hr/>
+
+    <h2>Manual Test Steps:</h2>
+    <p>
+        <ol>
+            <li>Click the "lockTarget" button to request a pointer lock.</li>
+            <li>Focus to another window with keyboard (ALT-TAB).</li>
+            <li>Test is done.</li>
+        </ol>
+    </p>
+    <hr/>
+
+    <button onclick="lockTarget();">lockTarget</button>
+
+    <div id="target-wrap">
+        <div id="status-log">Click the "lockTarget" button.</div>
+        <div id="target">Target</div>
+    </div>
+    <hr/>
+
+    <div id="log"></div>
+
+    <script type="text/javascript" >
+        var target = document.querySelector('#target'),
+            status_log = document.querySelector('#status-log');
+
+        var leaveUATest = async_test("Test that pointer lock will be lost when the user agent / window loses focus.");
+
+    document.addEventListener("pointerlockchange", function() {
+        if(document.pointerLockElement) {
+            status_log.innerHTML = "Please leave the current window.";
+        } else {
+            status_log.innerHTML = "Pointer lock exited!";
+
+            leaveUATest.step(function() {
+                assert_true(document.pointerLockElement === null, "Pointer lock exited!");
+            });
+
+            leaveUATest.done();
+        }
+    });
+
+    function lockTarget() {
+        target.requestPointerLock();
+    }
+    </script>
+    </body>
+</html>
diff --git a/testing/web-platform/tests/pointerlock/pointerlock_remove_target-manual.html b/testing/web-platform/tests/pointerlock/pointerlock_remove_target-manual.html
new file mode 100644
index 000000000..210365090
--- /dev/null
+++ b/testing/web-platform/tests/pointerlock/pointerlock_remove_target-manual.html
@@ -0,0 +1,87 @@
+<!DOCTYPE html>
+<html>
+<body>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<meta name='flags' content='interact'>
+<meta name="timeout" content="long">
+<style type="text/css">
+    button {
+        color: blue;
+    }
+
+    #target-wrap {
+        position: relative;
+        background-color: lightgrey;
+        width: 200px;
+        height: 100px;
+        border: grey 1px solid;
+    }
+
+    #target {
+        position: relative;
+        background-color: lightyellow;
+        width: 100px;
+        height: 30px;
+        border: yellow 1px solid;
+    }
+
+    #status-log {
+        margin: 10px 0;
+        color: green;
+    }
+</style>
+</head>
+<body>
+    <h2>Description</h2>
+    <p>This test validates that pointer lock will be lost when the target is disconnected.</p>
+    <hr/>
+
+    <h2>Manual Test Steps:</h2>
+    <p>
+        <ol>
+            <li>Click the "lockTarget" button to request a pointer lock.</li>
+            <li>Test is done.</li>
+        </ol>
+    </p>
+    <hr/>
+
+    <button onclick="lockTarget();">lockTarget</button>
+
+    <div id="target-wrap">
+        <div id="status-log">Click the "lockTarget" button.</div>
+        <div id="target">Target</div>
+    </div>
+    <hr/>
+
+    <div id="log"></div>
+
+    <script type="text/javascript" >
+        var target = document.querySelector('#target'),
+            target_wrap = document.querySelector('#target-wrap')
+            status_log = document.querySelector('#status-log');
+
+        var removeTargetTest = async_test("Test that pointer lock will be lost when taking the target element out of the DOM.");
+
+    document.addEventListener("pointerlockchange", function() {
+        if(document.pointerLockElement) {
+            status_log.innerHTML = "Target is locked!";
+
+            target_wrap.removeChild(target);
+        } else {
+            status_log.innerHTML = "Pointer lock exited!";
+
+            removeTargetTest.step(function() {
+                assert_true(document.pointerLockElement === null, "Pointer lock exited!");
+            });
+
+            removeTargetTest.done();
+        }
+    });
+
+    function lockTarget() {
+        target.requestPointerLock();
+    }
+    </script>
+    </body>
+</html>
diff --git a/testing/web-platform/tests/pointerlock/pointerlock_shadow-manual.html b/testing/web-platform/tests/pointerlock/pointerlock_shadow-manual.html
new file mode 100644
index 000000000..e7893c33b
--- /dev/null
+++ b/testing/web-platform/tests/pointerlock/pointerlock_shadow-manual.html
@@ -0,0 +1,83 @@
+<!DOCTYPE html>
+<html>
+<head>
+<meta name='author' title='Takayoshi Kochi' href='mailto:kochi@chromium.org'>
+<meta name='assert' content='Test for DocumentOrShadowRoot.pointerLockElement.'>
+<link rel='help' href='https://w3c.github.io/pointerlock/#widl-DocumentOrShadowRoot-pointerLockElement'>
+<meta name='flags' content='interact'>
+<meta name='timeout' content='long'>
+<script src='/resources/testharness.js'></script>
+<script src='/resources/testharnessreport.js'></script>
+<script src='../shadow-dom/resources/shadow-dom.js'></script>
+</head>
+<body>
+<div id='host'>
+  <template data-mode='open' id='root'>
+    <slot></slot>
+  </template>
+  <div id='host2'>
+    <template data-mode='open' id='root2'>
+      <div id='host3'>
+        <template data-mode='open' id='root3'>
+          <canvas id='canvas'></canvas>
+          <div id='host4'>
+            <template data-mode='open' id='root4'>
+              <div></div>
+            </template>
+          </div>
+        </template>
+      </div>
+      <div id='host5'>
+        <template data-mode='open' id='root5'>
+          <div></div>
+        </template>
+      </div>
+    </template>
+  </div>
+</div>
+
+<script>
+function run_test() {
+    async_test((test) => {
+	document.onpointerlockerror = test.unreached_func('onpointerlockerror is not expected.');
+
+	document.onpointerlockchange = test.step_func_done(() => {
+	    // Not interested in handling before or after exitPointerLock.
+	    if (document.pointerLockElement === null)
+		return;
+
+	    assert_equals(document.pointerLockElement, ids.host2, 'document.pointerLockElement should be shadow #host2.');
+	    assert_equals(ids.root.pointerLockElement, null, '#root\'s shadowRoot.pointerLockElement should be null.');
+	    assert_equals(ids.root2.pointerLockElement, ids.host3, '#root2\'s shadowRoot.pointerLockElement should be host3.');
+	    assert_equals(ids.root3.pointerLockElement, ids.canvas, '#root3\'s shadowRoot.pointerLockElement should be canvas element.');
+	    assert_equals(ids.root4.pointerLockElement, null, '#root4\'s shadowRoot.pointerLockElement should be null.');
+	    assert_equals(ids.root5.pointerLockElement, null, '#root5\'s shadowRoot.pointerLockElement should be null.');
+
+	    document.exitPointerLock();
+	});
+
+	var ids = createTestTree(host);
+	document.body.appendChild(ids.host);
+
+	// All pointerLockElement should default to null.
+	test.step(() => {
+	    assert_equals(document.pointerLockElement, null);
+	    assert_equals(ids.root.pointerLockElement, null);
+	    assert_equals(ids.root2.pointerLockElement, null);
+	    assert_equals(ids.root3.pointerLockElement, null);
+	    assert_equals(ids.root4.pointerLockElement, null);
+	    assert_equals(ids.root5.pointerLockElement, null);
+	});
+
+	var canvas = ids.canvas;
+	canvas.requestPointerLock();
+    }, 'Test for pointerLockElement adjustment for Shadow DOM.');
+}
+</script>
+<div>
+  <h2>Description</h2>
+  <p>Click the button below to trigger pointer lock on an element in a shadow root.</p>
+  <button onclick="run_test()">Click Me!</button>
+</div>
+</body>
+</html>
author	Matt A. Tobin <mattatobin@localhost.localdomain>	2018-02-02 04:16:08 -0500
committer	Matt A. Tobin <mattatobin@localhost.localdomain>	2018-02-02 04:16:08 -0500
commit	5f8de423f190bbb79a62f804151bc24824fa32d8 (patch)
tree	10027f336435511475e392454359edea8e25895d /testing/web-platform/tests/pointerlock
parent	49ee0794b5d912db1f95dce6eb52d781dc210db5 (diff)
download	UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.gz UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.lz UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.xz UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.zip