whatwg
Set "is currently stalled" before firing events
Fixes https://github.com/whatwg/html/issues/11958.
- [ ] At least two implementers are interested (and none opposed):
- …
- …
- [ ] Tests are written and can be reviewed and commented upon at:
- …
- [ ] Implementation bugs are filed:
- Chromium: …
- Gecko: …
- WebKit: …
- Deno (only for timers, structured clone, base64 utils, channel messaging, module resolution, web workers, and web storage): …
- Node.js (only for timers, structured clone, base64 utils, channel messaging, and module resolution): …
- [ ] Corresponding HTML AAM & ARIA in HTML issues & PRs:
- [ ] MDN issue is filed: …
- [ ] The top of this comment includes a clear commit message to use.
(See WHATWG Working Mode: Changes for more details.)
/media.html ( diff )
A test for this would be:
<!DOCTYPE html>
<title>Media Loading State: the :buffering and :stalled pseudo-classes</title>
<link rel="help" href="https://drafts.csswg.org/selectors/#media-loading-state">
<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
// https://github.com/whatwg/html/pull/11959. This test asserts that when
// the stalled event is fired, :stalled already matches.
async_test((t) => {
assert_implements(CSS.supports("selector(:stalled)"), ":stalled is not supported");
const video = document.querySelector("video");
// Send the first 100 kB and then stall "forever" (1 hour).
video.src = `/media/movie_300.webm?pipe=trickle(100000:d3600)&random=${Math.random()}`;
video.addEventListener("stalled", t.step_func_done(() => {
assert_true(video.matches(":stalled"), ":stalled matches in stalled event handler");
}));
}, "Test :stalled timing relative to stalled event");
// Note: it would be good to also test that :stalled doesn't match when the
// progress event is fired, but that would require resuming the loading
// again on demand and pipe=trickle doesn't support this.
</script>
</body>
Safari fails this test. Unfortunately this test runs into the issues I described in https://github.com/web-platform-tests/interop/issues/1003#issuecomment-3563761861, that I haven't found anything that robustly fires the stalled event in all browsers.
I've written a test using a custom Python handler in https://github.com/web-platform-tests/wpt/pull/56562 now, it first sends 10 seconds of data and then waits, causing the stalled event to fired. Once fired, the test sends another request to continue sending the rest of the resource.