| OLD | NEW |
| 1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
| 2 <title>Test that stalled, timeupdate and waiting events are sent when media load
stalls in the middle.</title> | 2 <title>Test that stalled, timeupdate and waiting events are sent when media load
stalls in the middle.</title> |
| 3 <video id="test_video"></video> | 3 <video id="test_video"></video> |
| 4 <div id="log_console"></div> | 4 <div id="log_console"></div> |
| 5 <script src=../../media-resources/media-file.js></script> | 5 <script src=../../media-resources/media-file.js></script> |
| 6 <script src="/w3c/resources/testharness.js"></script> | 6 <script src="/w3c/resources/testharness.js"></script> |
| 7 <script src="/w3c/resources/testharnessreport.js"></script> | 7 <script src="/w3c/resources/testharnessreport.js"></script> |
| 8 <script> | 8 <script> |
| 9 async_test(t => { | 9 async_test(t => { |
| 10 let video = document.getElementById('test_video'); | 10 let video = document.getElementById('test_video'); |
| 11 let log_console = document.getElementById('log_console'); | 11 let log_console = document.getElementById('log_console'); |
| 12 | 12 |
| 13 // For debugging. | 13 // For debugging. |
| 14 function logMessage(msg) { |
| 15 let span = document.createElement("span"); |
| 16 span.innerHTML = msg + '<br>'; |
| 17 log_console.appendChild(span); |
| 18 }; |
| 19 |
| 14 function logEvent(e) { | 20 function logEvent(e) { |
| 15 let span = document.createElement("span"); | 21 logMessage('event: ' + e.type); |
| 16 span.innerHTML = 'event: ' + e.type + '<br>'; | |
| 17 log_console.appendChild(span); | |
| 18 }; | 22 }; |
| 19 | 23 |
| 20 playback_ew = new EventWatcher(t, video, [ | 24 playback_ew = new EventWatcher(t, video, [ |
| 21 'canplay', | 25 'canplay', |
| 22 'canplaythrough', | 26 'canplaythrough', |
| 23 'durationchange', | 27 'durationchange', |
| 24 'loadedmetadata', | 28 'loadedmetadata', |
| 25 'loadeddata', | 29 'loadeddata', |
| 26 'play', | 30 'play', |
| 27 'playing', | 31 'playing', |
| (...skipping 11 matching lines...) Expand all Loading... |
| 39 // you to just verify that it fired once and move on. | 43 // you to just verify that it fired once and move on. |
| 40 function waitForRecurringEvent(name) { | 44 function waitForRecurringEvent(name) { |
| 41 let resolve_cb; | 45 let resolve_cb; |
| 42 let promise = new Promise(function(resolve, reject) { | 46 let promise = new Promise(function(resolve, reject) { |
| 43 resolve_cb = resolve; | 47 resolve_cb = resolve; |
| 44 }); | 48 }); |
| 45 video.addEventListener(name, t.step_func((evt) => resolve_cb(evt))); | 49 video.addEventListener(name, t.step_func((evt) => resolve_cb(evt))); |
| 46 return promise; | 50 return promise; |
| 47 } | 51 } |
| 48 | 52 |
| 53 // Monitor timeupdate w.r.t. readyState throughout test. Time should not |
| 54 // advance while readyState <= HAVE_CURRENT_DATA. |
| 55 let timeAtStartOfWaiting = null; |
| 56 video.addEventListener('timeupdate', t.step_func(function(e) { |
| 57 logMessage('event: timeupdate at time: ' + e.target.currentTime +' read
ystate:' + e.target.readyState); |
| 58 if (e.target.readyState <= HTMLMediaElement.HAVE_CURRENT_DATA) { |
| 59 if (timeAtStartOfWaiting == null) { |
| 60 // Note the time when waiting begins. |
| 61 timeAtStartOfWaiting = e.target.currentTime; |
| 62 } else { |
| 63 // Verify that current time is not advancing while waiting. |
| 64 assert_equals(e.target.currentTime, timeAtStartOfWaiting); |
| 65 } |
| 66 } else if (timeAtStartOfWaiting != null) { |
| 67 // Waiting has ended, so clear timeAtStartOfWaiting. |
| 68 timeAtStartOfWaiting = null; |
| 69 } |
| 70 })); |
| 71 |
| 49 // NOTE: Event sequence verification is achieved by chaining together | 72 // NOTE: Event sequence verification is achieved by chaining together |
| 50 // promises via then(). To verify separate parallel event sequences (e.g. | 73 // promises via then(). To verify separate parallel event sequences (e.g. |
| 51 // playback vs network), we setup separate chains of promises. Promise.all | 74 // playback vs network), we setup separate chains of promises. Promise.all |
| 52 // ensures that all separate sequences complete. | 75 // ensures that all separate sequences complete. |
| 53 | 76 |
| 54 // Verify playback progresses then runs out of data. | 77 // Verify playback progresses then runs out of data. |
| 55 Promise.all([ | 78 Promise.all([ |
| 56 // First wait for the resource to load. | 79 // First wait for the resource to load. |
| 57 playback_ew.wait_for('durationchange').then(logEvent) | 80 playback_ew.wait_for('durationchange').then(logEvent) |
| 58 .then(() => playback_ew.wait_for('loadedmetadata')).then(logEvent) | 81 .then(() => playback_ew.wait_for('loadedmetadata')).then(logEvent) |
| 59 .then(() => playback_ew.wait_for('loadeddata')).then(logEvent) | 82 .then(() => playback_ew.wait_for('loadeddata')).then(logEvent) |
| 60 .then(() => playback_ew.wait_for('canplay')).then(logEvent) | 83 .then(() => playback_ew.wait_for('canplay')).then(logEvent) |
| 61 .then(() => playback_ew.wait_for('canplaythrough')).then(logEvent) | 84 .then(() => playback_ew.wait_for('canplaythrough')).then(logEvent) |
| 62 .then(t.step_func(function() { | 85 .then(t.step_func(function() { |
| 63 assert_true(video.readyState > HTMLMediaElement.HAVE_CURRENT_DAT
A); | 86 assert_true(video.readyState > HTMLMediaElement.HAVE_CURRENT_DAT
A); |
| 64 })) | 87 })) |
| 65 // Now play the file and wait for playback to stall (fire waiting). | 88 // Now play the file and wait for playback to stall (fire waiting). |
| 66 .then(t.step_func(function() { | 89 .then(t.step_func(function() { |
| 67 video.play(); | 90 video.play(); |
| 68 // NOTE: setting the wait_for here because we will miss it if we
do | 91 // NOTE: setting the wait_for here because we will miss it if we
do |
| 69 // it after the play call resolves its promise. | 92 // it after the play call resolves its promise. |
| 70 return playback_ew.wait_for('play').then(logEvent); | 93 return playback_ew.wait_for('play').then(logEvent); |
| 71 })) | 94 })) |
| 72 .then(() => playback_ew.wait_for('playing')).then(logEvent) | 95 .then(() => playback_ew.wait_for('playing')).then(logEvent) |
| 73 // Now observe waiting event and verify readyState | 96 // Now observe waiting event and verify readyState |
| 74 .then(() => playback_ew.wait_for('waiting')).then(logEvent) | 97 .then(() => playback_ew.wait_for('waiting')).then(logEvent) |
| 75 .then(t.step_func(function(){ | 98 .then(t.step_func(function(){ |
| 76 assert_equals(HTMLMediaElement.HAVE_CURRENT_DATA, video.readySta
te); | 99 assert_equals(video.readyState, HTMLMediaElement.HAVE_CURRENT_DA
TA); |
| 77 })), | 100 })), |
| 78 | 101 |
| 79 // timeupdate should fire throughout playback. Make sure we see one. | 102 // timeupdate should fire throughout playback. Make sure we see one. |
| 80 waitForRecurringEvent('timeupdate').then(logEvent), | 103 waitForRecurringEvent('timeupdate').then(logEvent), |
| 81 | 104 |
| 82 // progress should fire throughout download. Make sure we see one. | 105 // progress should fire throughout download. Make sure we see one. |
| 83 // Later the download should stall. | 106 // Later the download should stall. |
| 84 waitForRecurringEvent('progress').then(logEvent) | 107 waitForRecurringEvent('progress').then(logEvent) |
| 85 .then(() => stalled_ew.wait_for('stalled')).then(logEvent) | 108 .then(() => stalled_ew.wait_for('stalled')).then(logEvent) |
| 86 | 109 |
| (...skipping 18 matching lines...) Expand all Loading... |
| 105 // Find a supported media file. | 128 // Find a supported media file. |
| 106 var mediaFile = findMediaFile("video", "content/test"); | 129 var mediaFile = findMediaFile("video", "content/test"); |
| 107 var mimeType = mimeTypeForFile(mediaFile); | 130 var mimeType = mimeTypeForFile(mediaFile); |
| 108 // URL will load part of the file, pause for 8 seconds, then load the rest. | 131 // URL will load part of the file, pause for 8 seconds, then load the rest. |
| 109 // The delay of 8 seconds is chosen to reduce flakiness in waiting for the | 132 // The delay of 8 seconds is chosen to reduce flakiness in waiting for the |
| 110 // stalled event, which should arrive after roughly 3 seconds of inactivity. | 133 // stalled event, which should arrive after roughly 3 seconds of inactivity. |
| 111 video.src = "http://127.0.0.1:8000/resources/load-and-stall.cgi?name=../../.
./media/" + mediaFile + "&mimeType=" + mimeType + "&stallAt=100000&stallFor=8"; | 134 video.src = "http://127.0.0.1:8000/resources/load-and-stall.cgi?name=../../.
./media/" + mediaFile + "&mimeType=" + mimeType + "&stallAt=100000&stallFor=8"; |
| 112 | 135 |
| 113 }, "Stalled download pauses playback. When download resumes playback continues.
Verify events and readyStates."); | 136 }, "Stalled download pauses playback. When download resumes playback continues.
Verify events and readyStates."); |
| 114 </script> | 137 </script> |
| OLD | NEW |