Index: LayoutTests/media/video-controls-drop-order.html |
diff --git a/LayoutTests/media/video-controls-drop-order.html b/LayoutTests/media/video-controls-drop-order.html |
new file mode 100644 |
index 0000000000000000000000000000000000000000..153664142b4bf0609b9501a5915809b6b598c1ce |
--- /dev/null |
+++ b/LayoutTests/media/video-controls-drop-order.html |
@@ -0,0 +1,83 @@ |
+<!DOCTYPE html> |
+<html> |
+<head> |
+ <title>Test controls drop order</title> |
+ <script src=media-file.js></script> |
+ <script src=media-controls.js></script> |
+ <script src=video-test.js></script> |
+ <script> |
+ var numLoaded = 0; |
+ var videos = []; |
+ var controlNames = [ |
+ "play-button", |
+ "timeline", |
+ "mute-button", |
+ "volume-slider", |
+ "fullscreen-button", |
+ "toggle-closed-captions-button", |
+ "time-remaining-display", |
+ "current-time-display", |
+ ]; |
+ |
+ function init() |
+ { |
+ var src = findMediaFile("video", "content/test"); |
+ videoDiv = document.getElementById("videoDiv"); |
+ for(var width = 50; width < 550; width += 50) { |
+ var video = document.createElement("video"); |
+ videos.push(video); |
+ videoDiv.appendChild(video); |
+ video.addTextTrack('captions', 'English', 'en') |
+ .addCue(new VTTCue(0.0, 10.0, 'Some random caption text')); |
+ video.width = width; |
+ video.controls = true; |
+ |
+ // wait for video to load |
+ video.addEventListener("canplay",videoLoaded); |
+ video.src = src; |
+ } |
+ } |
+ |
+ function videoLoaded() |
+ { |
+ // One more video is ready. |
+ numLoaded++; |
+ if (numLoaded == videos.length) { |
+ // All videos are ready. |
+ test(); |
+ } |
+ } |
+ |
+ function displayButtonState(video) |
+ { |
+ var width = video.width; |
+ |
+ for (var controlName of controlNames) { |
+ try { |
+ var control = mediaControlsButton(video, controlName); |
+ var state = (control.style['display'] != 'none') ? "seen" : "gone"; |
+ //var state = (getComputedStyle(control).display != 'none') ? "seen" : "gone"; |
+ consoleWrite(width + " " + state + " " + controlName); |
+ } catch (exception) { |
+ // control is missing |
+ consoleWrite("failed for " + width + " " + controlName + " " + exception); |
+ } |
+ } |
+ } |
+ |
+ function test() |
+ { |
+ for(var videoControl of videos) { |
+ displayButtonState(videoControl); |
+ } |
+ testRunner.notifyDone(); |
+ } |
+ </script> |
+</head> |
+<body onload="init()"> |
+ Tests that the drop order for controls doesn't change.<br> |
+ Output should be [video width in px] [seen or gone] [control name], with |
+ one line per control at each width. |
+ <div id="videoDiv"></div> |
+</body> |
+</html> |