| <!DOCTYPE html> |
| <html> |
| <head> |
| <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> |
| |
| <script src=../media-file.js></script> |
| <script src=../video-test.js></script> |
| <script> |
| |
| var numberOfTrackTests = 2; |
| |
| function trackLoaded() |
| { |
| numberOfTracksLoaded++; |
| if (numberOfTracksLoaded == numberOfTrackTests) { |
| testTrack(0); |
| testTrackError(1); |
| } |
| } |
| |
| function testTrack(i) |
| { |
| findMediaElement(); |
| testExpected("video.textTracks[" + i + "].cues.length", "3"); |
| |
| var fragment = document.createDocumentFragment(); |
| var cspan = document.createElement("span"); |
| cspan.className = "black"; |
| cspan.appendChild(document.createTextNode("Bear is Coming!!!!!")); |
| fragment.appendChild(cspan); |
| |
| testExpected(fragment.isEqualNode(video.textTracks[i].cues[0].getCueAsHTML()), true); |
| |
| fragment = document.createDocumentFragment(); |
| cspan = document.createElement("span"); |
| cspan.className = "green"; |
| cspan.appendChild(document.createTextNode("I said Bear is coming!!!!")); |
| fragment.appendChild(cspan); |
| |
| testExpected(fragment.isEqualNode(video.textTracks[i].cues[1].getCueAsHTML()), true); |
| |
| fragment = document.createDocumentFragment(); |
| fragment.appendChild(document.createTextNode("I said ")); |
| cspan = document.createElement("span"); |
| cspan.className = "red uppercase"; |
| cspan.appendChild(document.createTextNode("Bear is coming now")); |
| fragment.appendChild(cspan); |
| fragment.appendChild(document.createTextNode("!!!!")); |
| |
| testExpected(fragment.isEqualNode(video.textTracks[i].cues[2].getCueAsHTML()), true); |
| |
| allTestsEnded(); |
| } |
| |
| function testTrackError(i) |
| { |
| findMediaElement(); |
| testExpected("video.textTracks[" + i + "].cues.length", "3"); |
| |
| var fragment = document.createDocumentFragment(); |
| var cspan = document.createElement("span"); |
| cspan.appendChild(document.createTextNode("Bear is Coming!!!!!")); |
| fragment.appendChild(cspan); |
| fragment.appendChild(document.createTextNode("\nThe space signified an annotation start.")); |
| |
| testExpected(fragment.isEqualNode(video.textTracks[i].cues[0].getCueAsHTML()), true); |
| |
| fragment = document.createDocumentFragment(); |
| cspan = document.createElement("span"); |
| cspan.className = "red&large"; |
| cspan.appendChild(document.createTextNode("I said Bear is coming!!!!")); |
| fragment.appendChild(cspan); |
| fragment.appendChild(document.createTextNode("\nProbably should only allow characters that CSS allows in class names.")); |
| |
| testExpected(fragment.isEqualNode(video.textTracks[i].cues[1].getCueAsHTML()), true); |
| |
| fragment = document.createDocumentFragment(); |
| fragment.appendChild(document.createTextNode("I said ")); |
| cspan = document.createElement("span"); |
| cspan.className = "9red upper+case"; |
| cspan.appendChild(document.createTextNode("Bear is coming now")); |
| fragment.appendChild(cspan); |
| fragment.appendChild(document.createTextNode("!!!!\nProbably should only allow characters that CSS allows in class names.")); |
| |
| testExpected(fragment.isEqualNode(video.textTracks[i].cues[2].getCueAsHTML()), true); |
| |
| allTestsEnded(); |
| } |
| </script> |
| </head> |
| <body onload="enableAllTextTracks()"> |
| <p>Tests cues with class markup <c>.</p> |
| <video> |
| <track src="captions-webvtt/tc025-class.vtt" onload="trackLoaded()"> |
| <track src="captions-webvtt/tc025-class-bad.vtt" onload="trackLoaded()"> |
| </video> |
| </body> |
| </html> |