blob: 63363f77048ffbecc102b7fd9744422991212895 [file] [log] [blame]
<!DOCTYPE html>
<title>Test that cue text is mutable.</title>
<script src="../media-file.js"></script>
<script src="../media-controls.js"></script>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<video>
<track src="captions-webvtt/captions-gaps.vtt" kind="captions" default >
</video>
<script>
async_test(function(t) {
var video = document.querySelector("video");
var testTrack = document.querySelector("track");
video.oncanplaythrough = t.step_func(testMutability);
testTrack.onload = t.step_func(testMutability);
var eventCount = 0;
function testMutability() {
eventCount++;
if (eventCount != 2)
return;
// Test initial cue info.
assert_equals(testTrack.track.activeCues.length, 0);
assert_equals(testTrack.track.cues[0].startTime, 1.0);
assert_equals(testTrack.track.cues[1].startTime, 3.0);
assert_equals(testTrack.track.cues[0].text, "Lorem ipsum dolor sit amet,");
var fragment = document.createDocumentFragment();
fragment.appendChild(document.createTextNode("Lorem ipsum dolor sit amet,"));
assert_true(fragment.isEqualNode(testTrack.track.cues[0].getCueAsHTML()));
// Change the start time of cue #1, it should become visible.
testTrack.track.cues[0].startTime = 0;
assert_equals(testTrack.track.cues[0].startTime, 0);
assert_equals(textTrackDisplayElement(video).innerText, "Lorem ipsum dolor sit amet,");
// Change the cue text, getCueAsHTML() should return a new, correct fragment.
testTrack.track.cues[0].text = "Lorem <b>ipsum</b> <u>dolor</u> <i.sit>sit</i> amet,";
assert_equals(testTrack.track.cues[0].text, "Lorem <b>ipsum</b> <u>dolor</u> <i.sit>sit</i> amet,");
fragment = document.createDocumentFragment();
fragment.appendChild(document.createTextNode("Lorem "));
var bold = document.createElement("b");
bold.appendChild(document.createTextNode("ipsum"));
fragment.appendChild(bold);
fragment.appendChild(document.createTextNode(" "));
var underline = document.createElement("u");
underline.appendChild(document.createTextNode("dolor"));
fragment.appendChild(underline);
fragment.appendChild(document.createTextNode(" "));
var italics = document.createElement("i");
italics.className = "sit";
italics.appendChild(document.createTextNode("sit"));
fragment.appendChild(italics);
fragment.appendChild(document.createTextNode(" amet,"));
assert_true(fragment.isEqualNode(testTrack.track.cues[0].getCueAsHTML()));
t.done();
}
video.src = findMediaFile("video", "../content/counting");
});
</script>