click-timing.html (2569B)
1 <!DOCTYPE html> 2 <html> 3 <meta charset=utf-8 /> 4 <title>Event Timing: compare timing of two long clicks 5 </title> 6 <button id='button'>Generate a 'click' event</button> 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-vendor.js></script> 11 <script src=resources/event-timing-test-utils.js></script> 12 <script> 13 /* Timeline: 14 Observer starts 15 Long click 1 16 Long click 2 17 Once two clicks have been received by observer, compare the timestamps. 18 */ 19 let timeBeforeFirstClick; 20 let timeAfterFirstClick; 21 let timeAfterSecondClick; 22 23 function testExpectations(observedEntries) { 24 assert_not_equals(timeBeforeFirstClick, undefined); 25 assert_not_equals(timeAfterFirstClick, undefined); 26 assert_not_equals(timeAfterSecondClick, undefined); 27 28 // First click. 29 verifyClickEvent(observedEntries[0], 'button'); 30 assert_between_exclusive(observedEntries[0].processingStart, 31 timeBeforeFirstClick, 32 timeAfterFirstClick, 33 "First click's processingStart"); 34 assert_greater_than(timeAfterFirstClick, observedEntries[0].startTime, 35 "timeAfterFirstClick should be later than first click's start time."); 36 37 // Second click. 38 verifyClickEvent(observedEntries[1], 'button'); 39 assert_between_exclusive(observedEntries[1].processingStart, 40 timeAfterFirstClick, 41 timeAfterSecondClick, 42 "Second click's processingStart"); 43 assert_greater_than(timeAfterSecondClick, observedEntries[1].startTime, 44 "timeAfterSecondClick should be later than second click's start time."); 45 } 46 47 promise_test(async function(t) { 48 assert_implements(window.PerformanceEventTiming, 'Event Timing is not supported.'); 49 50 const observerPromise = new Promise(resolve => { 51 const observedEntries = []; 52 new PerformanceObserver(entryList => { 53 observedEntries.push(...entryList.getEntriesByName("pointerdown")); 54 if (observedEntries.length < 2) 55 return; 56 resolve(observedEntries); 57 }).observe({type: 'event'}); 58 }) 59 60 timeBeforeFirstClick = performance.now(); 61 mainThreadBusy(2); 62 await clickAndBlockMain('button'); 63 timeAfterFirstClick = performance.now(); 64 mainThreadBusy(2); 65 await clickAndBlockMain('button'); 66 timeAfterSecondClick = performance.now(); 67 68 const observedEntries = await observerPromise; 69 testExpectations(observedEntries); 70 71 }, "Event Timing: compare click timings."); 72 </script> 73 </html>