<!DOCTYPE html>
<html>
<title>Test that the overflow menu closes when the overlay play button area is tapped.</title>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script src="../media-controls.js"></script>
<script src="overlay-play-button.js"></script>
<body></body>
<script>
async_test(t => {
// This test is only valid when the overlay play button is enabled.
enableOverlayPlayButtonForTest(t);
const video = document.createElement('video');
video.controls = true;
video.width = 400;
video.src='../content/60_sec_video.webm';
document.body.appendChild(video);
var button = overflowButton(video);
var menu = overflowMenu(video);
// Need to add a text track for the overflow menu to appear.
video.addTextTrack("captions");
video.addEventListener('loadedmetadata', t.step_func(() => {
// The overflow menu should be closed by default.
assert_false(isControlVisible(menu));
// Open overflow menu.
singleTapOnControl(button, t.step_func(tapOnOverlay));
}));
function tapOnOverlay() {
// Overflow menu should be visible.
assert_true(isControlVisible(menu));
// Single tap in the top right hand corner of overlay.
const overlayCoordinates = coordinatesOutsideElement(mediaControlsOverlayPlayButton(video));
singleTapAtCoordinates(overlayCoordinates[0] + 1,
overlayCoordinates[1] + 1,
t.step_func_done(checkOverflowMenuDisappeared));
}
function checkOverflowMenuDisappeared() {
// The overflow menu should disappear.
assert_false(isControlVisible(menu));
}
});
</script>
</html>