<!DOCTYPE html>
<title>Verify that media controls are always visible when hovered.</title>
<script src="../resources/testharness.js"></script>
<script src="../resources/testharnessreport.js"></script>
<script src="media-controls.js"></script>
<video controls loop></video>
<script>
async_test(function(t) {
var video = document.querySelector("video");
video.oncanplaythrough = t.step_func(function() {
assert_true(video.paused);
// Click the play button.
var playCoords = elementCoordinates(enabledPlayButton(video));
eventSender.mouseMoveTo(playCoords[0], playCoords[1]);
eventSender.mouseDown();
eventSender.mouseUp();
assert_false(video.paused);
// Move over the timeline, since we don't prevent hiding when only over
// the overlay play button.
var timelineCoords = mediaControlsButtonCoordinates(video, "timeline");
eventSender.mouseMoveTo(timelineCoords[0], timelineCoords[1]);
runAfterHideMediaControlsTimerFired(t.step_func_done(function() {
var controls = mediaControlsButton(video, "panel");
assert_false(controls.classList.contains("transparent"));
}), video);
});
video.src = "content/test.ogv";
});
</script>