| <!DOCTYPE HTML> |
| <title>click is a PointerEvent</title> |
| <meta name="variant" content="?mouse"> |
| <meta name="variant" content="?pen"> |
| <meta name="variant" content="?touch"> |
| <link rel="help" href="https://github.com/w3c/pointerevents/pull/317"> |
| <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> |
| |
| <input id="target" style="margin: 20px"> |
| |
| <script> |
| 'use strict'; |
| let target = document.getElementById("target"); |
| let pointerId_one = 0; |
| let pointerType_one = ""; |
| let pointerId_two = 0; |
| let pointerType_two = ""; |
| let pointerId_three = 0; |
| let pointerType_three = ""; |
| let inputSource = location.search.substring(1); |
| const phase_one = 1; |
| const phase_two = 2; |
| const phase_three = 3; |
| let pointerdown_phase = phase_one; |
| let click_phase = phase_one; |
| |
| target.addEventListener("pointerdown", (e)=>{ |
| if(pointerdown_phase === phase_one){ |
| pointerdown_phase = phase_two; |
| pointerId_one = e.pointerId; |
| pointerType_one = e.pointerType; |
| }else if(pointerdown_phase === phase_two){ |
| pointerdown_phase = phase_three; |
| pointerId_two = e.pointerId; |
| pointerType_two = e.pointerType; |
| }else if(pointerdown_phase === phase_three){ |
| pointerId_three = e.pointerId; |
| pointerType_three = e.pointerType; |
| } |
| }); |
| |
| function test_pointer(e, pointerId, pointerType, click_phase){ |
| assert_equals(e.constructor, window.PointerEvent, "click should use a PointerEvent constructor in phase " + click_phase); |
| assert_true(e instanceof PointerEvent, "click should be a PointerEvent in phase " + click_phase); |
| assert_equals(e.pointerId, pointerId, "click's pointerId should match the pointerId of the pointer event that triggers it in phase " + click_phase); |
| assert_equals(e.pointerType, pointerType, "click's pointerType should match the pointerType of the pointer event that triggers it in phase " + click_phase); |
| } |
| |
| function testFunction(test){ |
| return test.step_func(e=>{ |
| if(click_phase === phase_one){ |
| test_pointer(e, pointerId_one, pointerType_one, click_phase); |
| click_phase = phase_two; |
| }else if(click_phase === phase_two){ |
| test_pointer(e, pointerId_two, pointerType_two, click_phase); |
| click_phase = phase_three; |
| }else if(click_phase === phase_three) |
| test_pointer(e, pointerId_three, pointerType_three, click_phase); |
| }); |
| } |
| |
| function run_test(pointerType){ |
| promise_test((test) => new Promise((resolve, reject) => { |
| const testPointer = pointerType + "TestPointer"; |
| let clickFunc = testFunction(test); |
| test.add_cleanup(() => { |
| target.removeEventListener("click", clickFunc); |
| pointerId_one = 0; |
| pointerType_one = ""; |
| pointerId_two = 0; |
| pointerType_two = ""; |
| pointerId_three = 0; |
| pointerType_three = ""; |
| pointerdown_phase = phase_one; |
| click_phase = phase_one; |
| }); |
| target.addEventListener("click", clickFunc); |
| let eventWatcher = new EventWatcher(test, target, ["click"]); |
| let actions = new test_driver.Actions(); |
| actions = actions |
| .addPointer(testPointer, pointerType) |
| .pointerMove(0,0, {origin:target, sourceName:testPointer}) |
| .pointerDown({sourceName:testPointer}) |
| .pointerUp({sourceName:testPointer}) |
| .pointerDown({sourceName:testPointer}) |
| .pointerUp({sourceName:testPointer}) |
| .pointerDown({sourceName:testPointer}) |
| .pointerUp({sourceName:testPointer}); |
| Promise.all([eventWatcher.wait_for(["click", "click", "click"]), actions.send()]).then(()=>resolve()); |
| }), "click using " + pointerType + " is a PointerEvent"); |
| } |
| |
| run_test(inputSource); |
| </script> |