OLD | NEW |
1 <!DOCTYPE html> | 1 <!DOCTYPE html> |
2 <script src=../media-file.js></script> | 2 <title>Test that the cue root is not constrained by the controls/overlay.</title
> |
3 <!-- TODO(philipj): Convert test to testharness.js. crbug.com/588956 | 3 <script src="../media-file.js"></script> |
4 (Please avoid writing new tests using video-test.js) --> | 4 <script src="../media-controls.js"></script> |
5 <script src=../video-test.js></script> | 5 <script src="../../resources/testharness.js"></script> |
6 <script src=../media-controls.js></script> | 6 <script src="../../resources/testharnessreport.js"></script> |
7 <style> | 7 <style> |
8 /* Enforce a max width on the controls enclosure, so | 8 /* Enforce a max width on the controls enclosure, so |
9 * that it doesn't fill the entire player width. | 9 * that it doesn't fill the entire player width. |
10 */ | 10 */ |
11 video::-webkit-media-controls-enclosure { | 11 video::-webkit-media-controls-enclosure { |
12 max-width: 800px; | 12 max-width: 800px; |
13 } | 13 } |
14 </style> | |
15 <script> | |
16 var controlsContainer; | |
17 var cueRoot; | |
18 | 14 |
19 window.onload = function() { | |
20 consoleWrite("Test that the cue root is not constrained by the controls/over
lay."); | |
21 findMediaElement(); | |
22 video.src = findMediaFile('video', '../content/test'); | |
23 waitForEvent('seeked', function() { | |
24 // The width of the controls depends on UA style, so verify that our ass
umption holds. | |
25 controlsContainer = mediaControlsButton(video, "panel"); | |
26 testExpected("parseFloat(getComputedStyle(controlsContainer).width)", "8
00", "<="); | |
27 | |
28 cueRoot = textTrackDisplayElement(video); | |
29 testExpected("parseFloat(getComputedStyle(cueRoot).width)", "800", ">"); | |
30 endTest(); | |
31 }); | |
32 waitForEventOnce('canplaythrough', function() { | |
33 video.currentTime = 2; | |
34 }); | |
35 }; | |
36 </script> | |
37 <style> | |
38 video { | 15 video { |
39 width: 2000px; | 16 width: 2000px; |
40 height: 750px; | 17 height: 750px; |
41 } | 18 } |
42 </style> | 19 </style> |
43 <video controls> | 20 <video> |
44 <track src="captions-webvtt/long-word.vtt" default> | 21 <track src="captions-webvtt/long-word.vtt" default> |
45 </video> | 22 </video> |
| 23 <script> |
| 24 async_test(function(t) { |
| 25 var video = document.querySelector("video"); |
| 26 video.src = findMediaFile("video", "../content/test"); |
| 27 |
| 28 video.onseeked = t.step_func_done(function() { |
| 29 // The width of the controls depends on UA style, so verify that our ass
umption holds. |
| 30 var controlsContainer = mediaControlsButton(video, "panel"); |
| 31 assert_true(parseFloat(getComputedStyle(controlsContainer).width) <= 800
); |
| 32 |
| 33 var cueRoot = textTrackDisplayElement(video); |
| 34 assert_true(parseFloat(getComputedStyle(cueRoot).width) > 800); |
| 35 }); |
| 36 |
| 37 video.currentTime = 2; |
| 38 }); |
| 39 </script> |
OLD | NEW |