<!DOCTYPE html>
<html>
<head>
    <title>fullscreen-user-agent-style</title>
    <script src="full-screen-test.js"></script>
    <script>
        window.addEventListener('load', async event => {
            window.span = document.querySelector('span');

            testExpected("document.defaultView.getComputedStyle(span, null).getPropertyValue('bottom')", "auto");
            testExpected("document.defaultView.getComputedStyle(span, null).getPropertyValue('right')", "auto");

            runWithKeyDown(() => { run("span.webkitRequestFullscreen()") });
            await waitFor(span, 'webkitfullscreenchange');

            testExpected("document.defaultView.getComputedStyle(span, null).getPropertyValue('bottom')", "0px");
            testExpected("document.defaultView.getComputedStyle(span, null).getPropertyValue('right')", "0px");

            runWithKeyDown(() => { run("document.webkitExitFullscreen()") });
            await waitFor(span, 'webkitfullscreenchange');

            testExpected("document.defaultView.getComputedStyle(span, null).getPropertyValue('bottom')", "auto");
            testExpected("document.defaultView.getComputedStyle(span, null).getPropertyValue('right')", "auto");

            endTest();
        });
    </script>
</head>
<body>
    <span></span>
</body>
</html>