blob: 9b0b93b11dc74c18d7a2c205224cd048314328c2 [file] [log] [blame]
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
video::-webkit-media-text-track-display {
padding: 15px;
}
</style>
<script src=../media-file.js></script>
<script src=../media-controls.js></script>
<script src=../video-test.js></script>
<script>
var cueContainerBottomPoint;
var cueDisplayBottomPoint;
var retries = 0;
var maxRetries = 256;
function startTest()
{
if (!window.internals) {
consoleWrite("<br><b>** This test only works in DRT! **<" + "/b>");
return;
}
// The textTrackDisplayElement call will fail and throw an exception if the text track display element
// has not yet been added to the text track container element. We wait until it has been added.
try {
var cueDisplayElement = textTrackDisplayElement(video, 'display', 0);
} catch (exception) {
retries++;
if (retries > maxRetries) {
consoleWrite("The test failed because the text track display element was not found.");
endTest();
}
else
setTimeout(startTest, 100);
return;
}
var cueContainerElement = textTrackDisplayElement(video);
cueDisplayBottomPoint = cueDisplayElement.offsetTop + cueDisplayElement.offsetHeight;
cueContainerBottomPoint = cueContainerElement.offsetTop + cueContainerElement.offsetHeight;
consoleWrite("<br>** Cue should be displayed entirely within the container. **");
testExpected("cueDisplayBottomPoint <= cueContainerBottomPoint", true);
endTest();
}
function loaded()
{
consoleWrite("Rendering text track cue line with padding set.<br>");
findMediaElement();
testTrack = document.querySelector('track');
video.src = findMediaFile('video', '../content/test');
waitForEvent('seeked', startTest);
waitForEvent('canplaythrough', function() {
video.currentTime = .25;
});
}
setCaptionDisplayMode('Automatic');
</script>
</head>
<body onload="loaded()">
<video controls>
<track src="captions-webvtt/captions-fast.vtt" kind="captions" default>
</video>
</body>
</html>