crossiframe.html (3441B)
1 <!DOCTYPE html> 2 <html> 3 4 <head> 5 <meta charset=utf-8 /> 6 <title>Event Timing: entries should be observable by its own frame.</title> 7 <meta name="timeout" content="long"> 8 </head> 9 10 <body> 11 <button id='button'>Generate a 'click' event</button> 12 <script src=/resources/testharness.js></script> 13 <script src=/resources/testharnessreport.js></script> 14 <script src=/resources/testdriver.js></script> 15 <script src=/resources/testdriver-actions.js></script> 16 <script src=/resources/testdriver-vendor.js></script> 17 18 <script src=resources/event-timing-test-utils.js></script> 19 <iframe id='iframe' src=resources/crossiframe-childframe.html></iframe> 20 <script> 21 let clickTimeMin; 22 let clickDone; 23 24 function validateEntries(entries) { 25 assert_equals(entries.length, 1, "Only 1 entry should be received"); 26 const entry = entries[0]; 27 verifyClickEvent(entry, 'button', true); 28 29 assert_less_than(entry.processingStart, clickDone, 30 "The entry's processing start should be before clickDone."); 31 assert_greater_than(entry.startTime, clickTimeMin, 32 "The entry's start time should be later than clickTimeMin."); 33 } 34 35 function validateChildFrameEntries(childFrameData) { 36 if (childFrameData === "failed") { 37 assert_unreached("Did not receive exactly one entry from child as expected"); 38 } 39 // |childFrameData| has properties with the same names as its 40 // PerformanceEventTiming counterpart. 41 assert_equals(childFrameData.target, 'iframe_div'); 42 verifyClickEvent(childFrameData, null, false, 104, 'mousedown'); 43 assert_less_than(childFrameData.processingStart, childFrameData.clickDone, 44 "The entry's processing start should be before than the child frame's clickDone."); 45 } 46 47 promise_test(async t => { 48 assert_implements(window.PerformanceEventTiming, "Event Timing is not supported"); 49 50 // Wait for load event so we can interact with the iframe. 51 await new Promise(resolve => { 52 window.addEventListener('load', resolve); 53 }); 54 55 clickTimeMin = performance.now(); 56 mainThreadBusy(2); 57 58 let observedPointerDown = false; 59 const observerPromise = new Promise(resolve => { 60 new PerformanceObserver(t.step_func(entries => { 61 const pointerDowns = entries.getEntriesByName('pointerdown'); 62 // Ignore the callback if there were no pointerdown entries. 63 if (pointerDowns.length === 0) 64 return; 65 66 assert_false(observedPointerDown, 67 "Observer of main frames should only capture main-frame event-timing entries"); 68 observedPointerDown = true; 69 resolve(pointerDowns); 70 })).observe({type: 'event'}); 71 }); 72 73 await clickAndBlockMain('button'); 74 clickDone = performance.now(); 75 const pointerDowns = await observerPromise; 76 validateEntries(pointerDowns); 77 78 const childFrameEntriesPromise = new Promise(resolve => { 79 window.addEventListener("message", (event) => { 80 t.step(() => { 81 validateChildFrameEntries(event.data); 82 }); 83 resolve(); 84 }, false); 85 }); 86 87 // Tap on the iframe, with an offset of 10 to target the div inside it. 88 const actions = new test_driver.Actions() 89 .pointerMove(10, 10, { origin: document.getElementById("iframe") }) 90 .pointerDown() 91 .pointerUp(); 92 actions.send(); 93 94 await childFrameEntriesPromise; 95 }, "Event Timing: entries should only be observable by its own frame."); 96 97 </script> 98 </body> 99 </html>