| <html> |
| <head> |
| <title>Test rendering of volume slider of video tag</title> |
| <script src=media-file.js></script> |
| <script src=media-controls.js></script> |
| <script src=video-test.js></script> |
| <script> |
| var video; |
| var panel; |
| var threshold = 2; |
| |
| var muteButtonCoordinates; |
| var volumeSliderCoordinates; |
| |
| var volumeSliderElement; |
| var muteButtonElement; |
| |
| function init() |
| { |
| internals.suspendAnimations(); // Volumebar can be animated and we would need a timeout to have it shown. |
| video = document.getElementsByTagName("video")[0]; |
| video.src = findMediaFile("video", "content/test"); |
| } |
| |
| function test() |
| { |
| if (window.eventSender) { |
| try { |
| muteButtonCoordinates = mediaControlsButtonCoordinates(video, "mute-button"); |
| volumeSliderCoordinates = mediaControlsButtonCoordinates(video, "volume-slider-container"); |
| } catch (exception) { |
| testRunner.notifyDone(); |
| return; |
| } |
| } |
| |
| panel = mediaControlsElement(internals.shadowRoot(video).firstChild, "-webkit-media-controls-panel"); |
| volumeSliderElement = mediaControlsElement(internals.shadowRoot(video).firstChild, "-webkit-media-controls-volume-slider-container"); |
| muteButtonElement = mediaControlsElement(internals.shadowRoot(video).firstChild, "-webkit-media-controls-mute-button"); |
| |
| // Ensure paint without controls. |
| video.controls = false; |
| document.body.offsetTop; |
| |
| // Ensure (re)paint with controls displayed. |
| video.controls = true; |
| document.body.offsetTop; |
| |
| // Move the mouse back over the mute button. |
| eventSender.mouseMoveTo(muteButtonCoordinates[0], muteButtonCoordinates[1]); |
| |
| // Test that the left offset of both controls is equal. |
| consoleWrite(""); |
| consoleWrite("** The volume slider should have almost the same left offset as the mute button **"); |
| testExpected("volumeSliderElement.offsetLeft >= muteButtonElement.offsetLeft - threshold", true); |
| testExpected("volumeSliderElement.offsetLeft <= muteButtonElement.offsetLeft + threshold", true); |
| |
| consoleWrite(""); |
| consoleWrite("** The volume slider should be on top of the mute button **"); |
| testExpected("volumeSliderElement.offsetTop < muteButtonElement.offsetTop", true); |
| |
| testRunner.notifyDone(); |
| } |
| </script> |
| </head> |
| <body onload="init()"> |
| Tests that the video controls are properly rendered when the display none is set and unset.<br> |
| |
| <video oncanplaythrough="test()" controls preload="true"></video> |
| </body> |
| </html> |
