Make "onpointerlockchange" & "onpointerlockerror" enumerable

https://bugs.webkit.org/show_bug.cgi?id=245945 Reviewed by Cameron McCormack. Make onpointerlockchange and onpointerlockerror enumerable. Also import pointerlock tests. * LayoutTests/imported/w3c/resources/import-expectations.json: * LayoutTests/imported/w3c/web-platform-tests/pointerlock/META.yml: Added. * LayoutTests/imported/w3c/web-platform-tests/pointerlock/constructor-expected.txt: Added. * LayoutTests/imported/w3c/web-platform-tests/pointerlock/constructor.html: Added. * LayoutTests/imported/w3c/web-platform-tests/pointerlock/idlharness.window-expected.txt: Added. * LayoutTests/imported/w3c/web-platform-tests/pointerlock/idlharness.window.html: Added. * LayoutTests/imported/w3c/web-platform-tests/pointerlock/idlharness.window.js: Added. * LayoutTests/imported/w3c/web-platform-tests/pointerlock/mouse_buttons_back_forward-expected.txt: Added. * LayoutTests/imported/w3c/web-platform-tests/pointerlock/mouse_buttons_back_forward.html: Added. * LayoutTests/imported/w3c/web-platform-tests/pointerlock/movementX_Y_basic-expected.txt: Added. * LayoutTests/imported/w3c/web-platform-tests/pointerlock/movementX_Y_basic.html: Added. * LayoutTests/imported/w3c/web-platform-tests/pointerlock/pointerlock_remove_target-expected.txt: Added. * LayoutTests/imported/w3c/web-platform-tests/pointerlock/pointerlock_remove_target.html: Added. * LayoutTests/imported/w3c/web-platform-tests/pointerlock/pointerlock_remove_target_on_mouseup-expected.txt: Added. * LayoutTests/imported/w3c/web-platform-tests/pointerlock/pointerlock_remove_target_on_mouseup.html: Added. * LayoutTests/imported/w3c/web-platform-tests/pointerlock/pointerlock_shadow-expected.txt: Added. * LayoutTests/imported/w3c/web-platform-tests/pointerlock/pointerlock_shadow.html: Added. * LayoutTests/imported/w3c/web-platform-tests/pointerlock/w3c-import.log: Added. * LayoutTests/platform/gtk/imported/w3c/web-platform-tests/pointerlock/movementX_Y_basic-expected.txt: Added. * LayoutTests/platform/ios/TestExpectations: Skip the tests on iOS where pointerlock isn't supported. * LayoutTests/tests-options.json: * Source/WebCore/dom/Document+PointerLock.idl: Canonical link: https://commits.webkit.org/255153@main
WebKit · Oct 5, 2022 · 9fb95a34c7e1ba11c492605c964d64fdcf0ad4ea · 9fb95a3
1 parent 959f511
commit 9fb95a34c7e1ba11c492605c964d64fdcf0ad4ea
Show file tree

Hide file tree

Showing 22 changed files with 681 additions and 3 deletions.
diff --git a/LayoutTests/imported/w3c/resources/import-expectations.json b/LayoutTests/imported/w3c/resources/import-expectations.json
@@ -396,7 +396,7 @@
     "web-platform-tests/permissions": "import", 
     "web-platform-tests/picture-in-picture": "import", 
     "web-platform-tests/pointerevents": "import", 
-    "web-platform-tests/pointerlock": "skip", 
+    "web-platform-tests/pointerlock": "import", 
     "web-platform-tests/preload": "skip", 
     "web-platform-tests/presentation-api": "skip", 
     "web-platform-tests/progress-events": "skip", 

diff --git a/LayoutTests/imported/w3c/web-platform-tests/pointerlock/META.yml b/LayoutTests/imported/w3c/web-platform-tests/pointerlock/META.yml
@@ -0,0 +1,4 @@
+spec: https://w3c.github.io/pointerlock/
+suggested_reviewers:
+  - scheib
+  - siusin
diff --git a/LayoutTests/imported/w3c/web-platform-tests/pointerlock/constructor-expected.txt b/LayoutTests/imported/w3c/web-platform-tests/pointerlock/constructor-expected.txt
@@ -0,0 +1,6 @@
+Create Pointer Lock events and check each default value.
+
+
+PASS Default event values for mouse event interface and its pointer lock extensions.
+FAIL Default event values for pointerlockerror using a dictionary assert_equals: expected 10 but got 0
+
diff --git a/LayoutTests/imported/w3c/web-platform-tests/pointerlock/constructor.html b/LayoutTests/imported/w3c/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/LayoutTests/imported/w3c/web-platform-tests/pointerlock/idlharness.window-expected.txt b/LayoutTests/imported/w3c/web-platform-tests/pointerlock/idlharness.window-expected.txt
@@ -0,0 +1,49 @@
+
+PASS idl_test setup
+PASS idl_test validation
+PASS Partial interface Element: original interface defined
+PASS Partial interface Element: member names are unique
+PASS Partial interface Document: original interface defined
+PASS Partial interface Document: member names are unique
+PASS Partial interface mixin DocumentOrShadowRoot: original interface mixin defined
+PASS Partial interface mixin DocumentOrShadowRoot: member names are unique
+PASS Partial interface MouseEvent: original interface defined
+PASS Partial interface MouseEvent: member names are unique
+PASS Partial dictionary MouseEventInit: original dictionary defined
+PASS Partial dictionary MouseEventInit: member names are unique
+PASS Partial interface UIEvent: member names are unique
+PASS Partial interface MouseEvent[2]: member names are unique
+PASS Partial interface UIEvent[2]: member names are unique
+PASS Partial dictionary UIEventInit: member names are unique
+PASS Partial interface Document[2]: member names are unique
+PASS Partial interface mixin DocumentOrShadowRoot[2]: member names are unique
+PASS Partial interface Document[3]: member names are unique
+PASS Document includes GlobalEventHandlers: member names are unique
+PASS Document includes DocumentAndElementEventHandlers: member names are unique
+PASS Document includes NonElementParentNode: member names are unique
+PASS DocumentFragment includes NonElementParentNode: member names are unique
+PASS Document includes DocumentOrShadowRoot: member names are unique
+PASS ShadowRoot includes DocumentOrShadowRoot: member names are unique
+PASS Document includes ParentNode: member names are unique
+PASS DocumentFragment includes ParentNode: member names are unique
+PASS Element includes ParentNode: member names are unique
+PASS Element includes NonDocumentTypeChildNode: member names are unique
+PASS Element includes ChildNode: member names are unique
+PASS Element includes Slottable: member names are unique
+PASS Document includes XPathEvaluatorBase: member names are unique
+PASS MouseEvent interface: attribute movementX
+PASS MouseEvent interface: attribute movementY
+PASS MouseEvent interface: new MouseEvent('foo') must inherit property "movementX" with the proper type
+PASS MouseEvent interface: new MouseEvent('foo') must inherit property "movementY" with the proper type
+PASS Document interface: attribute onpointerlockchange
+PASS Document interface: attribute onpointerlockerror
+PASS Document interface: operation exitPointerLock()
+PASS Document interface: attribute pointerLockElement
+PASS Document interface: window.document must inherit property "onpointerlockchange" with the proper type
+PASS Document interface: window.document must inherit property "onpointerlockerror" with the proper type
+PASS Document interface: window.document must inherit property "exitPointerLock()" with the proper type
+PASS Document interface: window.document must inherit property "pointerLockElement" with the proper type
+PASS ShadowRoot interface: attribute pointerLockElement
+PASS Element interface: operation requestPointerLock()
+PASS Element interface: window.document.documentElement must inherit property "requestPointerLock()" with the proper type
+
diff --git a/LayoutTests/imported/w3c/web-platform-tests/pointerlock/idlharness.window.html b/LayoutTests/imported/w3c/web-platform-tests/pointerlock/idlharness.window.html
@@ -0,0 +1 @@
+<!-- This file is required for WebKit test infrastructure to run the templated test -->
diff --git a/LayoutTests/imported/w3c/web-platform-tests/pointerlock/idlharness.window.js b/LayoutTests/imported/w3c/web-platform-tests/pointerlock/idlharness.window.js
@@ -0,0 +1,18 @@
+// META: script=/resources/WebIDLParser.js
+// META: script=/resources/idlharness.js
+
+'use strict';
+
+// https://w3c.github.io/pointerlock/
+
+idl_test(
+  ['pointerlock'],
+  ['uievents', 'html', 'dom'],
+  idl_array => {
+    idl_array.add_objects({
+      Document: ["window.document"],
+      Element: ["window.document.documentElement"],
+      MouseEvent: ["new MouseEvent('foo')"]
+    });
+  }
+);
diff --git a/...Tests/imported/w3c/web-platform-tests/pointerlock/mouse_buttons_back_forward-expected.txt b/...Tests/imported/w3c/web-platform-tests/pointerlock/mouse_buttons_back_forward-expected.txt
@@ -0,0 +1,10 @@
+Test Description: Tests that the mouseup event is prevented.
+Click the left mouse button to lock pointer
+Click the back mouse button
+Click the forward mouse button
+
+
+Harness Error (TIMEOUT), message = null
+
+NOTRUN Tests that when pointer is locked, the mouseup is preventable.
+
diff --git a/LayoutTests/imported/w3c/web-platform-tests/pointerlock/mouse_buttons_back_forward.html b/LayoutTests/imported/w3c/web-platform-tests/pointerlock/mouse_buttons_back_forward.html
@@ -0,0 +1,70 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <meta charset="utf-8" />
+        <title>Mouse Button Back/Forward</title>
+        <link rel="author" title="Google" href="http://www.google.com/" />
+        <script src="/resources/testharness.js"></script>
+        <script src="/resources/testharnessreport.js"></script>
+        <script src="/resources/testdriver.js"></script>
+        <script src="/resources/testdriver-actions.js"></script>
+        <script src="/resources/testdriver-vendor.js"></script>
+        <script>
+            var testMouseUp = async_test('Tests that when pointer is locked, the mouseup is preventable.');
+            var received_back = false;
+            var received_forward = false;
+            const left_button = 0;
+            const back_button = 3;
+            const forward_button = 4;
+            window.addEventListener('mouseup', function(e) {
+              if (e.button == left_button) {
+                document.body.requestPointerLock();
+              } else if (e.button == back_button) {
+                received_back = true;
+                e.preventDefault();
+              } else if (e.button == forward_button) {
+                received_forward = true;
+                e.preventDefault();
+              }
+              if (document.pointerLockElement && received_back && received_forward) {
+                testMouseUp.done();
+                document.exitPointerLock();
+              }
+            });
+
+            document.addEventListener("pointerlockchange", function() {
+              assert_equals(document.pointerLockElement, document.body);
+
+              // Inject mouse input
+              var actions = new test_driver.Actions();
+              actions.pointerMove(1, 1)
+                .pointerDown({button: actions.ButtonType.BACK})
+                .pointerUp({button: actions.ButtonType.BACK})
+                .pointerDown({button: actions.ButtonType.FORWARD})
+                .pointerUp({button: actions.ButtonType.FORWARD})
+                .send();
+            }, { once: true });
+
+            document.addEventListener("pointerlockerror", function() {
+              assert_unreached("Pointer lock error");
+            });
+
+            // Inject mouse input
+            var actions = new test_driver.Actions();
+            actions.pointerMove(1, 1)
+              .pointerDown({button: actions.ButtonType.LEFT})
+              .pointerUp({button: actions.ButtonType.LEFT})
+              .send();
+        </script>
+
+    </head>
+    <body id="target">
+        <h4>Test Description: Tests that the mouseup event is prevented.
+            <ol>
+                <li>Click the left mouse button to lock pointer</li>
+                <li>Click the back mouse button</li>
+                <li>Click the forward mouse button</li>
+            </ol>
+        </h4>
+    </body>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/pointerlock/movementX_Y_basic-expected.txt b/LayoutTests/imported/w3c/web-platform-tests/pointerlock/movementX_Y_basic-expected.txt
@@ -0,0 +1,19 @@
+Description
+
+This test if movementX/Y can provide the change in position of the pointer, as if movementX/Y = eNow.screenX/Y-ePrevious.screenX/Y
+
+Manual Test Steps:
+
+Click to start Test1.
+Move the mouse within the window, slow and fast, like a scribble.
+Click again to end test.
+inside window: done
+X	Y
+screen_init:	-9600	-9700
+screen_last:	-9650	-9650
+screen_delta:	0	0
+movement_sum:	-50	50
+movement:	0	0
+
+PASS Test that movementX/Y = eNow.screenX/Y-ePrevious.screenX/Y.
+
diff --git a/LayoutTests/imported/w3c/web-platform-tests/pointerlock/movementX_Y_basic.html b/LayoutTests/imported/w3c/web-platform-tests/pointerlock/movementX_Y_basic.html
@@ -0,0 +1,150 @@
+<!DOCTYPE html>
+<html>
+<body>
+<meta name="timeout" content="long">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="/resources/testdriver.js"></script>
+<script src="/resources/testdriver-actions.js"></script>
+<script src="/resources/testdriver-vendor.js"></script>
+<style type="text/css">
+    #status-log {
+        margin: 10px 0;
+        color: green;
+        color: green;
+    }
+</style>
+</head>
+<body onload="run_test()">
+    <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>screen_init:</td><td id="screenX_init-log">X</td><td id="screenY_init-log">Y</td></tr>
+            <tr><td>screen_last:</td><td id="screenX_last-log">X</td><td id="screenY_last-log">Y</td></tr>
+            <tr><td>screen_delta:</td><td id="screenX_delta-log">X</td><td id="screenY_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'),
+            screenX_init_log = document.querySelector('#screenX_init-log'),
+            screenY_init_log = document.querySelector('#screenY_init-log'),
+            screenX_last_log = document.querySelector('#screenX_last-log'),
+            screenY_last_log = document.querySelector('#screenY_last-log');
+            screenX_delta_log = document.querySelector('#screenX_delta-log'),
+            screenY_delta_log = document.querySelector('#screenY_delta-log');
+
+        var click_counter = 0;
+
+        var screenX_init, screenY_init, movementX, movementY, movementX_sum, movementY_sum, screenX_last, screenY_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";
+
+                    movementX_Y_inside_window_Test.step(function() {
+                        assert_equals(movementX_sum, screenX_last - screenX_init, "sum of movementX = screenX_last - screenX_init");
+                        assert_equals(movementY_sum, screenY_last - screenY_init, "sum of movementY = screenY_last - screenY_init");
+                    });
+                    movementX_Y_inside_window_Test.done();
+                break;
+            }
+        });
+
+        document.addEventListener("mousemove", function (e) {
+            movementX = e.movementX;
+            movementY = e.movementY;
+
+            if(click_counter === 1) {
+                if(!screenX_init) {
+                    screenX_init = screenX_last = e.screenX;
+                    screenY_init = screenY_last = e.screenY;
+                    movementX_sum = 0;
+                    movementY_sum = 0;
+                }
+                else {
+                    movementX_sum += movementX;
+                    movementY_sum += movementY;
+
+                    screenX_delta = e.screenX - screenX_last;
+                    screenY_delta = e.screenY - screenY_last;
+
+                    movementX_Y_inside_window_Test.step(function() {
+                        assert_equals(movementX, screenX_delta, "movementX = screen_delta");
+                        assert_equals(movementY, screenY_delta, "movementY = screen_delta");
+                    });
+
+                    screenX_last = e.screenX;
+                    screenY_last = e.screenY;
+
+                    updateData();
+                }
+            }
+        });
+
+        function updateData() {
+            screenX_init_log.innerHTML = screenX_init;
+            screenY_init_log.innerHTML = screenY_init;
+            screenX_last_log.innerHTML = screenX_last;
+            screenY_last_log.innerHTML = screenY_last;
+            screenX_delta_log.innerHTML = screenX_delta;
+            screenY_delta_log.innerHTML = screenY_delta;
+            movementX_log.innerHTML = movementX;
+            movementY_log.innerHTML = movementY;
+            movementX_sum_log.innerHTML = movementX_sum;
+            movementY_sum_log.innerHTML = movementY_sum;
+        }
+
+        function run_test() {
+            x = Math.round(window.innerWidth / 2);
+            y = Math.round(window.innerHeight / 2);
+            var actions = new test_driver.Actions();
+            actions.pointerMove(x, y)
+              .pointerDown()
+              .pointerUp();
+            for (var i = 0; i < 10; i++) {
+                // Alternatively move left/right and up/down.
+                x += ((-1)**i) * i * 10;
+                y -= ((-1)**i) * i * 10;
+                actions.pointerMove(x, y);
+            }
+            actions.pointerMove(x, y)
+              .pointerDown()
+              .pointerUp()
+              .send();
+        }
+        </script>
+    </body>
+</html>