| <!DOCTYPE html> |
| <title>Tests that video controls are shown when entering/exiting fullscreen |
| whilst hovering over the controls. Opposite of |
| video-enter-exit-fullscreen-without-hovering-doesnt-show-controls.html</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 video = document.querySelector("video"); |
| enableTestMode(video); |
| |
| video.oncanplaythrough = t.step_func(function() { |
| video.oncanplaythrough = null; |
| |
| var panel = mediaControlsButton(video, "panel"); |
| |
| // Move mouse to the play button and start playing the video. |
| clickAtCoordinates(...elementCoordinates(enabledPlayButton(video))); |
| |
| assert_equals(getComputedStyle(panel).opacity, "1", |
| "Inline controls should initially show since controls " + |
| "attribute is present"); |
| |
| // Get fullscreen button coordinates whilst it is visible. |
| var inlineFullscreenButtonCoordinates = |
| mediaControlsButtonCoordinates(video, "fullscreen-button"); |
| |
| // Move mouse away so it no longer hovers over controls/video. |
| eventSender.mouseMoveTo(0, 0); |
| |
| runAfterHideMediaControlsTimerFired(t.step_func(function() { |
| assert_equals(getComputedStyle(panel).opacity, "0", |
| "Inline controls should be hidden by timer"); |
| |
| // Move mouse to the fullscreen button and enter fullscreen. Leave the |
| // mouse hovering over the controls. |
| clickAtCoordinates(...inlineFullscreenButtonCoordinates); |
| }), video); |
| |
| video.onwebkitfullscreenchange = t.step_func(function() { |
| video.onwebkitfullscreenchange = null; |
| |
| assert_equals(document.webkitFullscreenElement, video, |
| "Should have entered fullscreen"); |
| |
| assert_equals(getComputedStyle(panel).opacity, "1", |
| "Fullscreen controls should show after entering " + |
| "fullscreen since mouse is hovering over controls"); |
| |
| // Get fullscreen button coordinates whilst it is visible. |
| var fullscreenFullscreenButtonCoordinates = |
| mediaControlsButtonCoordinates(video, "fullscreen-button"); |
| |
| // Move mouse away so it no longer hovers over controls/video. |
| eventSender.mouseMoveTo(0, 0); |
| |
| runAfterHideMediaControlsTimerFired(t.step_func(function() { |
| assert_equals(getComputedStyle(panel).opacity, "0", |
| "Fullscreen controls should be hidden by timer"); |
| |
| // Move mouse to the fullscreen button and exit fullscreen. Leave the |
| // mouse hovering over the controls. |
| clickAtCoordinates(...fullscreenFullscreenButtonCoordinates); |
| }), video); |
| |
| video.onwebkitfullscreenchange = t.step_func(function() { |
| assert_equals(document.webkitFullscreenElement, null, |
| "Should have exited fullscreen"); |
| |
| waitForHoverEffectUpdate(t.step_func(function() { |
| assert_equals(getComputedStyle(panel).opacity, "1", |
| "Inline controls should show again after exiting " + |
| "fullscreen since mouse is hovering over controls"); |
| })); |
| |
| t.done(); |
| }); |
| }); |
| }); |
| |
| video.src = "../content/test-25fps.ogv"; |
| }); |
| </script> |