timingconditions.html (3499B)
1 <!DOCTYPE html> 2 <html> 3 <meta charset=utf-8 /> 4 <title>Event Timing only times certain types of trusted event. 5 </title> 6 <meta name="timeout" content="long"> 7 <button id='button' tabindex="0">Generate a 'click' event</button> 8 <script src=/resources/testharness.js></script> 9 <script src=/resources/testharnessreport.js></script> 10 <script src=/resources/testdriver.js></script> 11 <script src=/resources/testdriver-vendor.js></script> 12 13 <script src=resources/event-timing-test-utils.js></script> 14 <script> 15 let trustedClickStart; 16 function trustedClickAndBlockMain(id) { 17 trustedClickStart = performance.now(); 18 mainThreadBusy(2); 19 return clickAndBlockMain(id); 20 } 21 22 function untrustedClickAndBlockMain(id) { 23 const target = document.getElementById(id); 24 // Block mainthread in the callback, as dispatchEvent() is a sync call. 25 target.addEventListener('pointerdown', () => mainThreadBusy(120), true); 26 const eventDispatchStart = performance.now(); 27 target.dispatchEvent(new PointerEvent('pointerdown')); 28 assert_greater_than(performance.now() - eventDispatchStart, 119, "dispatchEvent() should run the event handler synchronously."); 29 } 30 31 function trustedFocusAndBlockMain(id) { 32 const target = document.getElementById(id); 33 // Guarantees target isn't focused to ensure the focus event is fired: 34 target.blur() 35 trustedFocusStart = performance.now(); 36 // Block mainthread in the callback, as focus() is a sync call. 37 target.addEventListener('focus', () => mainThreadBusy(120), true); 38 target.focus(); 39 assert_greater_than(performance.now() - trustedFocusStart, 119, "focus() should run the event handler synchronously."); 40 } 41 42 promise_test(function(t) { 43 assert_implements(window.PerformanceEventTiming, 'Event Timing is not supported.'); 44 let observedPointerDown = false; 45 const observerPromise = new Promise(resolve => { 46 new PerformanceObserver(t.step_func(entryList => { 47 const observerCallbackTime = performance.now(); 48 const pointerDowns = entryList.getEntriesByName('pointerdown'); 49 assert_equals(entryList.getEntriesByName('focus').length, 0); 50 // Ignore cases in which there is no pointerdown. 51 if (pointerDowns.length === 0) 52 return; 53 54 assert_false(observedPointerDown, 'Got more than one callback with pointerdown.'); 55 assert_equals(pointerDowns.length, 1, 56 "Should only observe one pointerdown entry. Instead, got these: " + 57 JSON.stringify(pointerDowns) + "."); 58 assert_equals(pointerDowns[0].name, 'pointerdown', 59 "The observed entry should be a pointerdown"); 60 assert_less_than(pointerDowns[0].startTime, observerCallbackTime, 61 "The startTime should be before observerCallbackTime"); 62 assert_greater_than(pointerDowns[0].startTime, trustedClickStart, 63 "The startTime should be after trustedClickStart"); 64 observedPointerDown = true; 65 resolve(); 66 })).observe({ entryTypes: ['event'] }); 67 }); 68 // Untrusted event of a type event timing cares about. 69 untrustedClickAndBlockMain('button'); 70 // Trusted event of a type event timing doesn't cares about. 71 trustedFocusAndBlockMain('button'); 72 // Trusted event of a type event timing cares about. 73 const clickPromise = trustedClickAndBlockMain('button').then(wait); 74 return Promise.all([observerPromise, clickPromise]); 75 }, "Event Timing only times certain types of trusted event."); 76 </script> 77 </html>