<!DOCTYPE html>
<title>Media Controls: overflow menu toggle class for animation.</title>
<script src='../../resources/testharness.js'></script>
<script src='../../resources/testharnessreport.js'></script>
<script src='../media-controls.js'></script>
<video controls width=400></video>
<script>
async_test(t => {
const video = document.querySelector('video');
enableTestMode(video);
video.src = '../content/test.ogv';
video.addTextTrack('captions', 'foo');
video.addTextTrack('captions', 'bar');
video.onloadeddata = t.step_func(() => {
const menu = overflowMenu(video);
const captionsList = textTrackMenu(video);
// Open overflow => close overflow
expectAllMenuClosed();
singleTapOnControl(overflowButton(video), t.step_func(() => {
expectOpenMenu();
singleTapOutsideControl(menu, t.step_func(() => {
expectAllMenuClosed();
// End of scenario
// Open overflow => open captions list => close captions list
clickCaptionButton(video, t.step_func(() => {
expectOpenMenu();
singleTapOutsideControl(captionsList, t.step_func(() => {
expectAllMenuClosed();
// End of scenario
// Open overflow => open captions list => select track
clickTextTrackAtIndex(video, 0, t.step_func(() => {
expectAllMenuClosed();
// End of scenario
// Open overflow => open captions list => click back to overflow => close overflow
clickCaptionButton(video, t.step_func(() => {
expectOpenMenu();
const trackListHeader = textTrackListHeader(video);
singleTapOnControl(trackListHeader, t.step_func(() => {
expectOpenMenu();
singleTapOutsideControl(menu, t.step_func_done(() => {
expectAllMenuClosed();
// End of scenario
}));
}));
}));
}));
}));
}));
}));
}));
function expectClosedMenu() {
assert_true(menu.classList.contains('closed'));
}
function expectOpenMenu() {
assert_false(menu.classList.contains('closed'));
}
function expectAllMenuClosed() {
assert_equals(getComputedStyle(menu).display, 'none');
assert_equals(getComputedStyle(captionsList).display, 'none');
expectClosedMenu();
}
});
});
</script>