| <!DOCTYPE html> |
| <html> |
| <body onload="load()"> |
| <p>Tests decoding and rendering a video element that has a changing resolution.</p> |
| <video width=320></video> |
| <video width=320></video> |
| <script> |
| if (window.testRunner) { |
| testRunner.waitUntilDone(); |
| } |
| |
| function load() { |
| var canplayCount = 0; |
| function oncanplay() { |
| if (++canplayCount < 2) { |
| return; |
| } |
| // Make sure we render the first frame. |
| requestAnimationFrame(function() { |
| video.play(); |
| }); |
| }; |
| |
| // Get the first video to stay on frame zero for comparison purposes. |
| var video = document.getElementsByTagName("video")[0]; |
| video.src = "../media/resources/frame_size_change.webm"; |
| video.addEventListener('canplay', oncanplay); |
| |
| // Get the second video to play through the clip with changing dimensions. |
| video = document.getElementsByTagName("video")[1]; |
| video.src = "../media/resources/frame_size_change.webm"; |
| video.addEventListener('canplay', oncanplay); |
| |
| video.addEventListener('playing', function() { |
| // Make sure the video plays for a bit. |
| video.addEventListener('timeupdate', function() { |
| if (video.currentTime > 1.0) { |
| video.pause(); |
| } |
| }); |
| }); |
| |
| video.addEventListener('pause', function() { |
| // Now seek back to a point where resolution should be different. |
| video.addEventListener('seeked', function() { |
| if (window.testRunner) { |
| testRunner.notifyDone(); |
| } |
| }); |
| |
| video.currentTime = 0.5; |
| }); |
| } |
| </script> |
| </body> |
| </html> |
