predicted_events_attributes.html (5715B)
1 <!doctype html> 2 <title>Predicted events count and properties</title> 3 <meta name="variant" content="?mouse"> 4 <meta name="variant" content="?pen"> 5 <meta name="variant" content="?touch"> 6 <meta name="viewport" content="width=device-width"> 7 <script src="/resources/testharness.js"></script> 8 <script src="/resources/testharnessreport.js"></script> 9 <script src="/resources/testdriver.js"></script> 10 <script src="/resources/testdriver-actions.js"></script> 11 <script src="/resources/testdriver-vendor.js"></script> 12 <script src="pointerevent_support.js"></script> 13 <link rel="stylesheet" type="text/css" href="pointerevent_styles.css"> 14 <style> 15 div { 16 width: 100px; 17 height: 100px; 18 } 19 </style> 20 <div id="target"></div> 21 <div id="done"></div> 22 23 <script> 24 "use strict"; 25 assert_true(location.search.length > 0, 26 "Test URL should contain pointer_type"); 27 const pointer_type = location.search.substring(1); 28 assert_true(["mouse", "touch", "pen"].includes(pointer_type)); 29 const target = document.getElementById("target"); 30 31 // https://w3c.github.io/pointerevents/#predicted-events 32 function checkListAttributes(event) { 33 assert_equals(typeof event.getPredictedEvents, "function", 34 event.type + ".getPredictedEvents is a function"); 35 assert_equals(typeof event.getPredictedEvents(), "object", 36 event.type + ".getPredictedEvents() returns an object"); 37 38 let predicted_events = event.getPredictedEvents(); 39 40 if (event.type == "pointermove") { 41 assert_greater_than_equal(predicted_events.length, 0, 42 event.type + ".getPredictedEvents() has 0 or more entry"); 43 for (let i = 0; i < predicted_events.length; i++) { 44 let predicted_event = predicted_events[i]; 45 46 assert_equals(predicted_event.isTrusted, true, 47 "predicted_event.isTrusted is true"); 48 assert_equals(predicted_event.bubbles, false, 49 "predicted_event.bubbles is false"); 50 assert_equals(predicted_event.cancelable, false, 51 "predicted_event.cancelable is false"); 52 53 assert_equals(predicted_event.pointerId, event.pointerId, 54 "predicted_event.pointerId matches the same in the container event"); 55 assert_equals(predicted_event.pointerType, event.pointerType, 56 "predicted_event.pointerType matches the same in the container event"); 57 assert_equals(predicted_event.isPrimary, event.isPrimary, 58 "predicted_event.isPrimary matches the same in the container event"); 59 assert_equals(predicted_event.target, event.target, 60 "predicted_event.target matches the same in the container event"); 61 62 if (i > 0) { 63 assert_greater_than_equal(predicted_event.timeStamp, 64 predicted_events[i - 1].timeStamp, 65 "predicted_event.timeStamp must be ascending"); 66 } 67 } 68 } else { 69 assert_equals(predicted_events.length, 0, 70 event.type + ".getPredictedEvents() has 0 entry"); 71 } 72 } 73 74 function actionToDragPointerInTarget() { 75 return new test_driver.Actions() 76 .addPointer("TestPointer", pointer_type) 77 .pointerMove(0, 0, {origin: target}) 78 .pointerDown() 79 .pointerMove(20, 20, {origin: target}) 80 .pointerUp() 81 } 82 83 promise_test(async () => { 84 const done = document.getElementById("done"); 85 86 let pointerover_promise = getEvent("pointerover", target); 87 let pointerenter_promise = getEvent("pointerenter", target); 88 let pointerout_promise = getEvent("pointerout", target); 89 let pointerleave_promise = getEvent("pointerleave", target); 90 91 await clickInTarget(pointer_type, target); 92 await clickInTarget(pointer_type, done); 93 94 checkListAttributes(await pointerover_promise); 95 checkListAttributes(await pointerenter_promise); 96 checkListAttributes(await pointerout_promise); 97 checkListAttributes(await pointerleave_promise); 98 }, "Predicted list in boundary events"); 99 100 promise_test(async () => { 101 // We need "touch-action:none" to guarantee pointermove events. 102 target.classList.add("touchActionNone"); 103 104 target.addEventListener("pointerdown", 105 e => target.setPointerCapture(e.pointerId), 106 {once: true}); 107 108 target.addEventListener("pointermove", 109 e => target.releasePointerCapture(e.pointerId), 110 {once: true}); 111 112 let gotpointercapture_promise = getEvent("gotpointercapture", target); 113 let lostpointercapture_promise = getEvent("lostpointercapture", target); 114 115 await actionToDragPointerInTarget().send(); 116 117 checkListAttributes(await gotpointercapture_promise); 118 checkListAttributes(await lostpointercapture_promise); 119 120 target.classList.remove("touchActionNone"); 121 }, "Predicted list in pointer-capture events"); 122 123 promise_test(async () => { 124 // We need "touch-action:none" to guarantee pointermove events. 125 target.classList.add("touchActionNone"); 126 127 let pointerdown_promise = getEvent("pointerdown", target); 128 let pointermove_promise = getEvent("pointermove", target); 129 let pointerup_promise = getEvent("pointerup", target); 130 131 await actionToDragPointerInTarget().send(); 132 133 checkListAttributes(await pointerdown_promise); 134 checkListAttributes(await pointermove_promise); 135 checkListAttributes(await pointerup_promise); 136 137 target.classList.remove("touchActionNone"); 138 }, "Predicted list in pointerdown/move/up events"); 139 140 promise_test(async () => { 141 if (pointer_type !== "touch") { 142 assert_true(true, "Skipped for " + pointer_type); 143 return; 144 } 145 146 let pointercancel_promise = getEvent("pointercancel", target); 147 148 await actionToDragPointerInTarget().send(); 149 150 checkListAttributes(await pointercancel_promise); 151 }, "Predicted list in pointercancel event"); 152 </script>