Source code
Revision control
Copy as Markdown
Other Tools
Test Info: Warnings
- This test has a WPT meta file that expects 1 subtest issues.
- This WPT test may be referenced by the following Test IDs:
- /css/selectors/media/media-loading-state-timing.sub.html - WPT Dashboard Interop Dashboard
<!DOCTYPE html>
<title>Media Loading State: the :buffering and :stalled pseudo-classes</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<script src="/common/media.js"></script>
<body>
<video width="300" height="300" muted autoplay></video>
<script>
// The order of "is currently stalled" changing and events firing changed in
// the stalled event is fired, :stalled already matches, and that when the
// progress event is fired, it no longer matches.
//
// This uses a Python custom handler that sends the initial part of the
// video and then waits for a POST request to send the rest.
const key = "{{uuid()}}";
// Wait for the load event so that the video delaying-the-load-event flag
// doesn't interact with the test harness.
window.addEventListener("load", () => {
async_test((t) => {
assert_implements(CSS.supports("selector(:stalled)"), ":stalled is not supported");
const video = document.querySelector("video");
video.src = `support/stall-resume.py?video&key=${key}`;
video.addEventListener("stalled", t.step_func(() => {
assert_true(video.matches(":stalled"), ":stalled matches in stalled event handler");
video.addEventListener("progress", t.step_func_done(() => {
assert_false(video.matches(":stalled"), ":stalled matches in progress event handler");
}));
// This POST request resumes the video delivery.
fetch(`support/stall-resume.py?resume&key=${key}`, { method: 'POST' });
}));
}, "Test :stalled timing relative to stalled and progress events");
});
</script>
</body>