| Index: LayoutTests/media/track/regions-webvtt/text-track-region-display.html | 
| diff --git a/LayoutTests/media/track/regions-webvtt/text-track-region-display.html b/LayoutTests/media/track/regions-webvtt/text-track-region-display.html | 
| new file mode 100644 | 
| index 0000000000000000000000000000000000000000..148fcee0aab67d81681ccb3216bfd94ad74bcbbb | 
| --- /dev/null | 
| +++ b/LayoutTests/media/track/regions-webvtt/text-track-region-display.html | 
| @@ -0,0 +1,108 @@ | 
| +<!DOCTYPE html> | 
| +<html> | 
| +    <head> | 
| +        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> | 
| + | 
| +        <script src=../../media-controls.js></script> | 
| +        <script src=../../media-file.js></script> | 
| +        <script src=../../video-test.js></script> | 
| +        <script> | 
| +        var testTrack; | 
| +        var region; | 
| +        var container; | 
| +        var totalVisibleLines; | 
| + | 
| +        var seekTimes = [0.2, 0.5, 1.0, 2.3, 3.0]; | 
| +        var crtSeekTime = 0; | 
| + | 
| +        function countVisibleLines(cueElement) | 
| +        { | 
| +            var cueRect = cueElement.getBoundingClientRect(); | 
| +            var regionRect = region.getBoundingClientRect(); | 
| + | 
| +            var linesMatch = cueElement.textContent.match(/\n/g); | 
| +            var linesCount = 1 + (linesMatch == null ? 0 : linesMatch.length); | 
| +            var lineHeight = cueRect.height / linesCount; | 
| + | 
| +            var visibleLines = 0; | 
| +            for (i = 0; i < linesCount; ++i) { | 
| +              var lineTop = cueRect.top + i * lineHeight; | 
| +              var lineBottom = cueRect.top + (i+1) * lineHeight; | 
| + | 
| +              if (lineTop >= regionRect.top && lineBottom <= regionRect.bottom) | 
| +                visibleLines++; | 
| +            } | 
| + | 
| +            return visibleLines; | 
| +        } | 
| + | 
| +        function testRegionsDisplay() | 
| +        { | 
| +            testTrack = video.textTracks[0]; | 
| + | 
| +            consoleWrite("** The text track has only one region **"); | 
| +            testExpected("testTrack.regions.length", 1); | 
| + | 
| +            try { | 
| +              region = textTrackDisplayElement(video, 'region'); | 
| +              container = textTrackDisplayElement(video, 'region-container'); | 
| +            } catch(e) { | 
| +              consoleWrite(e); | 
| +            } | 
| + | 
| +            consoleWrite("<br>** Inspecting cues displayed within region**"); | 
| + | 
| +            waitForEvent("seeked", inspectRegionTree); | 
| +            seekVideo(); | 
| +        } | 
| + | 
| +        function seekVideo() | 
| +        { | 
| +            consoleWrite(""); | 
| +            run("video.currentTime = " + seekTimes[crtSeekTime++]); | 
| +        } | 
| + | 
| +        function inspectRegionTree() | 
| +        { | 
| +            consoleWrite("Total cues in region: " + container.children.length); | 
| +            totalVisibleLines = 0; | 
| + | 
| +            for (var i = 0; i < container.children.length; ++i) { | 
| +                var cue = container.children[i]; | 
| +                var cueVisibleLines = countVisibleLines(cue); | 
| +                consoleWrite("Cue content is: " + cue.textContent); | 
| +                consoleWrite("Cue lines visible from this cue: " + cueVisibleLines); | 
| + | 
| +                totalVisibleLines += cueVisibleLines; | 
| +            } | 
| + | 
| +            testExpected("totalVisibleLines <= testTrack.regions[0].height", true); | 
| + | 
| +            if (crtSeekTime == seekTimes.length) | 
| +                endTest(); | 
| +            else | 
| +                seekVideo(); | 
| +        } | 
| + | 
| +        function startTest() | 
| +        { | 
| +            if (!window.TextTrackRegion) { | 
| +                failTest(); | 
| +                return; | 
| +            } | 
| + | 
| +            findMediaElement(); | 
| + | 
| +            video.src = findMediaFile('video', '../../content/test'); | 
| +            waitForEvent('canplaythrough', testRegionsDisplay); | 
| +        } | 
| + | 
| +        </script> | 
| +    </head> | 
| +    <body> | 
| +        <p>Tests default rendering for TextTrackCues that belong to a TextTrackRegion.</p> | 
| +        <video controls> | 
| +            <track src="../captions-webvtt/captions-regions.vtt" kind="captions" default onload="startTest()"> | 
| +        </video> | 
| +    </body> | 
| +</html> | 
|  |