<head>
<script>
var runPixelTests = true;
var init = function() {
    // Bail out early if the full screen API is not enabled or is missing:
    if (Element.prototype.webkitRequestFullScreen == undefined) {
        logResult(false, "Element.prototype.webkitRequestFullScreen == undefined");
        endTest();
    } else {
        var callback;
        var fullscreenChanged = function(event)
        {
            if (callback)
                callback(event)
        };
        waitForEvent(document, 'webkitfullscreenchange', fullscreenChanged);

        var one = document.getElementById('one');
        var two = document.getElementById('two');
        var three = document.getElementById('three');

        var threeEnteredFullScreen = function(event) {
            callback = threeExitedFullScreen;
            testExpected("document.webkitCurrentFullScreenElement", three);
            one.removeChild(two);
        };

        var threeExitedFullScreen = function(event) {
            callback = null;
            testExpected("document.webkitCurrentFullScreenElement", null);
            endTest();
        };

        callback = threeEnteredFullScreen;
        runWithKeyDown(function(){three.webkitRequestFullScreen()});        
    }
};
var startTest = function() { document.getElementById('three').webkitRequestFullScreen(); };
</script>
<script src="full-screen-test.js"></script>
<style>
#one {
    border: 4px solid darkgreen;
    background-color: green;
    width: 600px;
    height: 400px;
    padding: 4px;
}

#two {
    border: 4px solid darkred;
    background-color: red;
    padding: 4px;
    height: 384px;
}

#three {
    border: 4px solid darkblue;
    background-color: blue;
    padding: 4px;
    height: 368px;
}
</style>
</head>
<body onload="init()">
    
This tests that, if the ancestor of the current full-screen element is removed, full screen mode will exit, and the document will render normally.  At the completion of the test, a green box should be visible. Click <button onclick="startTest()">go full screen</button> to run the test.

<div id="one">
    <div id="two">
        <div id="three"></div>
    </div>
</div>

</script>
