| <!DOCTYPE html> | |
| <html> | |
| <meta charset=utf-8 /> | |
| <title>First Input: interactionId-click.</title> | |
| <button id='testButtonId'>Click me</button> | |
| <script src=/resources/testharness.js></script> | |
| <script src=/resources/testharnessreport.js></script> | |
| <script src=/resources/testdriver.js></script> | |
| <script src=/resources/testdriver-vendor.js></script> | |
| <script src=resources/event-timing-test-utils.js></script> | |
| <script> | |
| let firstInputInteractionId = 0; | |
| let eventTimingPointerDownInteractionId = 0; | |
| let hasFirstInputEntry = false; | |
| let hasEventTimingPointerDownEntry = false; | |
| promise_test(async t => { | |
| assert_implements(window.PerformanceEventTiming, 'Event Timing is not supported.'); | |
| const callback = (entryList) => { | |
| entryList.getEntries().forEach(entry => { | |
| switch (entry.entryType) { | |
| case 'first-input': { | |
| firstInputInteractionId = entry.interactionId; | |
| hasFirstInputEntry = true; | |
| break; | |
| } | |
| case 'event': { | |
| if ('pointerdown' == entry.name) { | |
| eventTimingPointerDownInteractionId = entry.interactionId; | |
| hasEventTimingPointerDownEntry = true; | |
| } | |
| break; | |
| } | |
| } | |
| }); | |
| }; | |
| const readyToResolve = () => { | |
| return hasFirstInputEntry && hasEventTimingPointerDownEntry; | |
| } | |
| const observerPromise = createPerformanceObserverPromise(['event', 'first-input'], callback, readyToResolve); | |
| await interactAndObserve('click', document.getElementById('testButtonId'), observerPromise); | |
| assert_greater_than(firstInputInteractionId, 0, 'The first input entry should have a non-trivial interactionId'); | |
| assert_equals(firstInputInteractionId, eventTimingPointerDownInteractionId, 'The first input entry should have the same interactionId as the event timing pointerdown entry'); | |
| }, "The interactionId of the first input entry should match the same pointerdown entry of event timing when click."); | |
| </script> | |
| </html> |