| 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>
|
|
|