test_seamless_looping_cancel_looping_future_frames.html (2301B)
1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <title>Seamless looping test cancel looping - no future frame</title> 5 <script src="/tests/SimpleTest/SimpleTest.js"></script> 6 <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> 7 <script type="text/javascript" src="manifest.js"></script> 8 </head> 9 <script type="application/javascript"> 10 11 /** 12 * This test aims to check whether the future frames, which are the frames 13 * beyond EOS and will be played in the next round of looping, would be discared 14 * correctly if we cancel looping in the first looping round. 15 */ 16 add_task(async function testSeamlessLoopingVideoCancelLoopingDiscardFutureFrames() { 17 info(`create video and play it`); 18 let video = document.createElement('video'); 19 video.loop = true; 20 video.src = "gizmo.mp4"; 21 document.body.appendChild(video); 22 // speed up the test. 23 video.playbackRate = 2; 24 await video.play(); 25 26 info(`wait until the video reaches to near end`); 27 let checkPoint1, checkPoint2; 28 await new Promise(r => { 29 video.ontimeupdate = _ => { 30 // When media almost reaches to the end, the audio track should already 31 // reach to the end before and started storing some future frames for next 32 // round of looping. 33 if (video.currentTime > video.duration - 1.5) { 34 info(`cancel looping`); 35 video.loop = false; 36 video.ontimeupdate = null; 37 checkPoint1 = new Date(); 38 r(); 39 } 40 } 41 }); 42 43 // Because we've canceled looping, playback should reach to the end soon 44 // (less than 0.5 seconds, but we use 1 second as a threshold to avoid 45 // intermittent failure) But if we didn't discard future frames correctly, 46 // that would cause that the video plays more audio frames and requires more 47 // time to reach the end. Note, in the error case I encountered, the playback 48 // didn't discard future frames and kept decoding since then, which causes 49 // playing extra a whole audio track again. 50 info(`wait until video reaches to the end within correct remaining time`); 51 await once(video, "ended"); 52 checkPoint2 = new Date(); 53 const diffInSeconds = Math.abs(checkPoint1 - checkPoint2) / 1000; 54 ok(diffInSeconds < 2, 55 `finished playing within ${diffInSeconds} without incorrectly playing any future frame`); 56 }); 57 58 </script> 59 <body> 60 </body> 61 </html>