<!DOCTYPE html>
<title>Test that focus moves to "body" when controls fade out with a button focused.</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");
video.addEventListener("canplay", t.step_func(() => {
assert_equals(document.activeElement, document.body);
var playButton = mediaControlsButton(video, "overlay-play-button");
playButton.focus();
playButton.click();
assert_equals(document.activeElement, video);
}), { once: true });
video.addEventListener("playing", t.step_func(() => {
runAfterHideMediaControlsTimerFired(t.step_func_done(function() {
var controls = mediaControlsButton(video, "panel");
assert_true(controls.classList.contains("transparent"));
assert_equals(document.activeElement, document.body);
}), video);
}), { once: true });
video.src = "content/test.ogv";
});
</script>