| <!DOCTYPE html> |
| <title>Test rendering of volume slider of video tag.</title> |
| <script src="../resources/testharness.js"></script> |
| <script src="../resources/testharnessreport.js"></script> |
| <script src="media-controls.js"></script> |
| <video controls></video> |
| <script> |
| async_test(function(t) { |
| var panel; |
| var muteButtonCoordinates; |
| var video = document.querySelector("video"); |
| |
| video.onplay = t.step_func(function() { |
| panel = mediaControlsButton(video, "panel"); |
| muteButtonCoordinates = mediaControlsButtonCoordinates(video, "mute-button"); |
| |
| // Move mouse somewhere over the panel. |
| eventSender.mouseMoveTo(muteButtonCoordinates[0], muteButtonCoordinates[1]); |
| |
| // Test that controls are shown when controls attribute is present. |
| assert_not_equals(panel.style["display"], "none"); |
| |
| // Move mouse outside the video. |
| eventSender.mouseMoveTo(video.offsetLeft, video.offsetTop + 2 * video.offsetHeight); |
| setTimeout(continueTest, controlsFadeOutDurationMs); |
| }); |
| |
| function continueTest() { |
| if (panel.style["display"] != "none") { |
| setTimeout(continueTest, controlsFadeOutDurationMs); |
| return; |
| } |
| |
| // Remove controls attribute. |
| video.removeAttribute("controls"); |
| |
| // Move mouse back over the panel. |
| eventSender.mouseMoveTo(muteButtonCoordinates[0], muteButtonCoordinates[1]); |
| |
| // Video controls should not be shown. |
| assert_equals(panel.style["display"], "none"); |
| t.done(); |
| } |
| |
| video.src = "content/test.ogv"; |
| video.play(); |
| }); |
| </script> |
