<!DOCTYPE html>
<meta charset="utf-8">
<title>Test the sequence of events when reporting image timing.</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<body>
<script>
function test_image_sequence(src, event, t) {
const image = document.createElement('img');
const absoluteURL = new URL(src, location.href).toString();
document.body.appendChild(image);
t.add_cleanup(() => image.remove());
return new Promise(resolve => {
image.addEventListener(event, t.step_func(() => {
assert_equals(performance.getEntriesByName(absoluteURL).length, 1);
resolve();
}));
image.src = src;
});
}
promise_test(t => test_image_sequence('resources/blue.png', 'load', t),
"An image should receive its load event after the ResourceTiming entry is available");
promise_test(t => test_image_sequence('resources/nothing-at-all.png', 'error', t),
"A non-existent (404) image should receive its error event after the ResourceTiming entry is available");
promise_test(t => test_image_sequence('resources/invalid.png', 'error', t),
"An invalid image should receive its error event after the ResourceTiming entry is available");
</script>