| <!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> |
| |
| function trackAdded() |
| { |
| consoleWrite("EVENT(" + event.type + ")"); |
| consoleWrite("<i>**check that metadata track state has not changed<" + "/i>"); |
| testExpected("track1.readyState", HTMLTrackElement.LOADED); |
| testExpected("track1.track.mode", "hidden"); |
| consoleWrite("<i>**and that the caption track state has not changed<" + "/i>"); |
| testExpected("track2.readyState", HTMLTrackElement.LOADED); |
| testExpected("track2.track.mode", "showing"); |
| consoleWrite("<i>**and that the subtitle track state is correct<" + "/i>"); |
| testExpected("event.target", video.textTracks); |
| testExpected("event instanceof window.TrackEvent", true); |
| testExpected("event.track", video.textTracks[video.textTracks.length - 1]); |
| testExpected("track3.mode", "showing"); |
| |
| consoleWrite(""); |
| endTest(); |
| } |
| |
| function captionsTrackLoaded() |
| { |
| consoleWrite("EVENT(load) -- <track kind='captions' >"); |
| consoleWrite("<i>**check that metadata track state has not changed<" + "/i>"); |
| testExpected("track1.readyState", HTMLTrackElement.LOADED); |
| testExpected("track1.track.mode", "hidden"); |
| consoleWrite("<i>**and that the caption track state is correct<" + "/i>"); |
| testExpected("track2.readyState", HTMLTrackElement.LOADED); |
| testExpected("track2.track.mode", "showing"); |
| consoleWrite(""); |
| |
| video.textTracks.addEventListener("addtrack", trackAdded); |
| consoleWrite("<i>**add a subtitle track with video.addTextTrack()<" + "/i>"); |
| run("track3 = video.addTextTrack('subtitles', 'Subtitle Track', 'en')"); |
| run("track3.mode = 'showing'"); |
| |
| consoleWrite(""); |
| } |
| |
| function metadataTrackLoaded() |
| { |
| consoleWrite("EVENT(load) -- <track kind='metadata' >"); |
| consoleWrite("<i>**check metadata track state<" + "/i>"); |
| testExpected("track1.readyState", HTMLTrackElement.LOADED); |
| testExpected("track1.track.mode", "hidden"); |
| testExpected("track1.track.cues.length", 12); |
| testExpected("track1.track.cues[11].startTime", 22); |
| |
| consoleWrite("<br><i>**add a caption track, configured to load automatically<" + "/i>"); |
| run("track2 = document.createElement('track')"); |
| run("track2.setAttribute('kind', 'captions')"); |
| run("track2.setAttribute('default', 'default')"); |
| run("track2.setAttribute('onload', 'captionsTrackLoaded()')"); |
| run("track2.setAttribute('src', 'captions-webvtt/tc004-webvtt-file.vtt')"); |
| run("video.appendChild(track2)"); |
| |
| consoleWrite(""); |
| } |
| |
| function canplaythrough() |
| { |
| consoleWrite("EVENT(canplaythrough) -- <video>"); |
| consoleWrite("<i>**check initial metadata track state<" + "/i>"); |
| testExpected("track1.readyState", HTMLTrackElement.NONE); |
| testExpected("track1.track.mode", "disabled"); |
| testExpected("track1.track.cues", null); |
| run("track1.track.mode = 'hidden'"); |
| consoleWrite(""); |
| } |
| |
| function start() |
| { |
| consoleWrite("<br>EVENT(load) -- <body>"); |
| findMediaElement(); |
| |
| track1 = document.querySelectorAll('track')[0]; |
| testExpected("track1.readyState", HTMLTrackElement.NONE); |
| testExpected("track1.track.mode", "disabled"); |
| |
| video.src = findMediaFile("video", "../content/test"); |
| consoleWrite(""); |
| } |
| </script> |
| </head> |
| |
| <body onload="start()"> |
| <p>Tests that a track appended after the initial track configuration does not change other tracks.</p> |
| <video oncanplaythrough="canplaythrough()" > |
| <track kind="metadata" src="captions-webvtt/metadata.vtt" onload="metadataTrackLoaded()"> |
| </video> |
| </body> |
| </html> |