toggle-class-with-state-source-buffer.html

<!DOCTYPE html>
<html>
<title>Test that player buffering is reflected in CSS classes</title>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="../../../media-resources/media-controls.js"></script>
<script src="../../../media-resources/media-file.js"></script>
<video controls width=400 preload=metadata></video>
<script>
async_test(t => {
  const video = document.querySelector('video');
  checkControlsDoesNotHaveClass(video, "state-buffering");

  // Verify that media controls have the class "state-buffering" when
  // video playback stops due to lack of data.
  //
  // Note: A first "waiting" event can be dispatched before the video starts
  // playing. At that time, media controls have the class
  // "state-loading-metadata-playing" instead of "state-buffering". For
  // that reason, this test only listens for the "waiting" event after
  // observing a "playing" event.
  video.onplaying = t.step_func(() => {
    video.onwaiting = t.step_func_done(() => {
      checkControlsHasClass(video, "state-buffering");
    });
  });

  const mediaFile = "../../../media/" + "content/test.ogv";
  const mimeType = mimeTypeForFile(mediaFile);
  video.src = "http://127.0.0.1:8000/resources/load-and-stall.php?name="
    + mediaFile + "&mimeType=" + mimeType + "&stallAt=100000&stallFor=8";
  video.play();
});
</script>
</html>
chromium/third_party/blink/web_tests/http/tests/media/controls/toggle-class-with-state-source-buffer.html
