| <!DOCTYPE html> |
| <title>Test that TextTrack's cues are rendered correctly when the snap to lines flag is not set.</title> |
| <script src="../media-controls.js"></script> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <video> |
| <track src="captions-webvtt/captions-snap-to-lines-not-set.vtt" kind="captions" default> |
| </video> |
| <script> |
| async_test(function(t) { |
| var video = document.querySelector("video"); |
| var testTrack = document.querySelector("track"); |
| video.src = "../content/test.ogv"; |
| |
| // In Chromium it is the enclosure element, which provides the controls height, otherwise the panel; |
| // both are the second child in the shadow DOM. |
| var controlsPanelElement = internals.shadowRoot(video).firstChild.firstChild; |
| |
| var cueDisplayContainer; |
| video.oncanplaythrough = t.step_func(function() { |
| cueDisplayContainer = textTrackContainerElement(video); |
| runNextTestCase(); |
| }); |
| |
| var seekTimeIndex = 0; |
| var testCaseSeekTime = [ |
| 0.10, |
| 0.60, |
| 1.10, |
| 1.60, |
| 2.10, |
| 2.60, |
| 3.10, |
| 4.10 |
| ]; |
| var cueRenderingPosition = [ |
| // Number of active cues 1. |
| [[0, 100, "center"]], |
| [[0, 50, "center"]], |
| [[0, 0, "start"]], |
| [[0, 0, "end"]], |
| [[0, 100, "right"]], |
| [[0, 100, "left"]], |
| [[0, 50, "center"]], |
| [ //Number of active cues 7. |
| [0, 50, "center"], |
| [0, 0, "start"], |
| [0, 0, "end"], |
| [0, 100, "center"], |
| [0, 25, "end"], |
| [44, 33, "start"], |
| [23, 55, "start"] |
| ] |
| ]; |
| function runNextTestCase() { |
| if (seekTimeIndex == testCaseSeekTime.length) { |
| t.done(); |
| return; |
| } |
| |
| video.currentTime = testCaseSeekTime[seekTimeIndex]; |
| video.onseeked = t.step_func(seeked); |
| } |
| |
| function seeked() { |
| var cuePosition = cueRenderingPosition[seekTimeIndex]; |
| for (var i = 0; i < testTrack.track.activeCues.length; ++i) { |
| cueDisplayElement = textTrackCueElementByIndex(video, i); |
| |
| assert_equals(cueDisplayElement.innerText, testTrack.track.activeCues[i].text); |
| assert_equals(testTrack.track.activeCues[i].align, cuePosition[i][2]); |
| |
| assert_equals(Math.round(cueDisplayElement.offsetLeft / cueDisplayContainer.offsetWidth * 100), cuePosition[i][0]); |
| assert_equals(Math.round(cueDisplayElement.offsetTop / cueDisplayContainer.offsetHeight * 100), cuePosition[i][1]); |
| } |
| |
| seekTimeIndex++; |
| runNextTestCase(); |
| } |
| }); |
| </script> |
