<!DOCTYPE html>
<title>Tests that TextTrack's cues are indexed and updated in order during video playback. Test uses the cuechange event.</title>
<script src="../media-file.js"></script>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<video>
    <track src="captions-webvtt/cues-chrono-order.vtt" kind="captions" default>
</video>
<script>
async_test(function(t) {
    var video = document.querySelector("video");
    var testTrack = document.querySelector("track");

    video.src = findMediaFile("video", "../content/test");
    video.oncanplaythrough = t.step_func(attemptTests);

    function attemptTests() {
        assert_equals(testTrack.track.cues.length, 3);
        testTrack.oncuechange = t.step_func(cueChangedFromTrackElement);
        video.play();
    }

    var currentCueIndex;
    var cueChangeCount = 0;
    function cueChangedFromTrackElement() {
        currentCueIndex = Math.floor(cueChangeCount / 2);
        currentCue = event.target.track.cues[currentCueIndex];
        if (cueChangeCount % 2 == 0) {
            // Cue entered.
            assert_equals(currentCue, testTrack.track.activeCues[0]);
            assert_equals(currentCue.id, (currentCueIndex + 1).toString());
        }

        ++cueChangeCount;
        if (cueChangeCount == testTrack.track.cues.length * 2)
            t.done();
    }
});
</script>