| <!DOCTYPE html> |
| <html lang="en-US"> |
| <title>Media Controls: loading panel accessibility tests</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></video> |
| <script> |
| async_test(t => { |
| var video = document.querySelector('video'); |
| var loading_panel = loadingPanelElement(video); |
| |
| video.addEventListener("loadstart", t.step_func_done(_ => { |
| // As we are loading, we will see the loading panel. |
| assert_true(isControlVisible(loading_panel)); |
| assert_equals(loading_panel.getAttribute('aria-label'), 'buffering'); |
| })); |
| |
| video.addEventListener("loadedmetadata", t.step_func(function() { |
| // If the panel is hidden, we won't hear the aria-label. |
| assert_false(isControlVisible(loading_panel)); |
| assert_equals(loading_panel.getAttribute('aria-label'), 'buffering'); |
| |
| // Play video |
| video.play(); |
| })); |
| |
| video.addEventListener("playing", t.step_func(function() { |
| // Check that on playback we don't see the panel. |
| assert_false(isControlVisible(loading_panel)); |
| |
| // Seek ahead to cause more buffering |
| video.currentTime = video.duration - 0.5; |
| })); |
| |
| video.addEventListener("seeked", t.step_func(function() { |
| // We should be buffering |
| assert_true(isControlVisible(loading_panel)); |
| assert_equals(loading_panel.getAttribute('aria-label'), 'buffering'); |
| })); |
| |
| |
| var mediaFile = "../../../content/test.oga"; |
| var type = mimeTypeForExtension(mediaFile.split(".").pop()); |
| video.src = "http://127.0.0.1:8000/media/video-throttled-load.cgi?name=" + mediaFile + "&throttle=5000&nph=1&type=" + type; |
| }); |
| </script> |
| </html> |