track-cues-cuechange.html (1528B)
1 <!DOCTYPE html> 2 <title>TextTrack's cues are indexed and updated in order during video playback</title> 3 <meta name="timeout" content="long"> 4 <script src="/common/media.js"></script> 5 <script src="/resources/testharness.js"></script> 6 <script src="/resources/testharnessreport.js"></script> 7 <video> 8 <track src="resources/cues-chrono-order.vtt" kind="captions" default> 9 <script> 10 // Use the cuechange event on TextTrack. 11 async_test(function(t) { 12 var video = document.querySelector("video"); 13 var testTrack = document.querySelector("track"); 14 15 video.src = getVideoURI("/media/test"); 16 video.oncanplaythrough = t.step_func(attemptTests); 17 18 function attemptTests() { 19 assert_equals(testTrack.track.cues.length, 3); 20 testTrack.oncuechange = t.step_func(cueChangedFromTrackElement); 21 video.play(); 22 } 23 24 var currentCueIndex; 25 var cueChangeCount = 0; 26 function cueChangedFromTrackElement() { 27 currentCueIndex = Math.floor(cueChangeCount / 2); 28 currentCue = event.target.track.cues[currentCueIndex]; 29 if (cueChangeCount % 2 == 0) { 30 // Cue entered. 31 assert_equals(currentCue, testTrack.track.activeCues[0]); 32 assert_equals(currentCue.id, (currentCueIndex + 1).toString()); 33 } 34 35 ++cueChangeCount; 36 if (cueChangeCount == testTrack.track.cues.length * 2) 37 t.done(); 38 } 39 }); 40 </script> 41 </video>