| <!DOCTYPE html> |
| <meta charset="utf-8"> |
| <title>Test the sequence of events when reporting link timing.</title> |
| <meta name="timeout" content="long"> |
| <script src="/resources/testharness.js"></script> |
| <script src="/resources/testharnessreport.js"></script> |
| <body> |
| <script> |
| promise_test(async t => { |
| const link = document.createElement('link'); |
| const delay = 500; |
| const src = `./resources/import.sub.css?delay=${delay}` |
| const absoluteURL = new URL(src, location.href).toString(); |
| new PerformanceObserver(t.step_func(() => { |
| const allPerformanceEntries = performance.getEntriesByType('resource'); |
| const linkEntry = allPerformanceEntries.find(e => e.name.includes('import.sub.css')); |
| const importEntry = allPerformanceEntries.find(e => e.name.includes('delay-css')); |
| if (!linkEntry || !importEntry) |
| return; |
| const linkEndTime = linkEntry.startTime + linkEntry.duration; |
| const importEndTime = importEntry.startTime + importEntry.duration; |
| assert_greater_than_equal(importEndTime, linkEndTime + delay, "link load should be done before import load"); |
| t.done(); |
| |
| })).observe({type: 'resource'}); |
| link.href = src; |
| link.rel = 'stylesheet'; |
| document.head.appendChild(link); |
| }, "test that @imports don't affect link resource timings"); |
| </script> |