| <!DOCTYPE HTML> |
| <meta charset=utf-8> |
| <title>Layout Instability: PerformanceObserver sees entries with buffered flag</title> |
| <body> |
| <style> |
| #myDiv { position: relative; width: 300px; height: 100px; } |
| </style> |
| <div id='myDiv'></div> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <script> |
| async_test(t => { |
| if (!window.LayoutShift) |
| assert_unreached('LayoutShift entries are not supported'); |
| const startTime = performance.now(); |
| // First observer creates second in callback to ensure the entry has been dispatched by the time |
| // the second observer begins observing. |
| new PerformanceObserver(() => { |
| const endTime = performance.now(); |
| // Second observer requires 'buffered: true' to see entries. |
| new PerformanceObserver(t.step_func_done(list => { |
| assert_equals(list.getEntries().length, 1); |
| const entry = list.getEntries()[0]; |
| assert_equals(entry.entryType, "layout-shift"); |
| assert_greater_than_equal(entry.startTime, startTime) |
| assert_less_than_equal(entry.startTime, endTime) |
| assert_equals(entry.duration, 0.0); |
| })).observe({'type': 'layout-shift', buffered: true}); |
| }).observe({type: 'layout-shift'}); |
| // Modify the position of the div to cause a layout-shift entry. |
| document.getElementById('myDiv').style = "top: 60px"; |
| }, 'PerformanceObserver with buffered flag sees previous layout-shift entry.'); |
| </script> |
| </body> |
