blob: f809e7295496225292dfc9bae2ca9ec8e71326c4 [file] [log] [blame]
<style>
div {
background-color: pink;
-webkit-align-self: stretch;
-webkit-flex: 1;
position: relative;
}
.vertical {
-webkit-writing-mode: vertical-lr;
}
.inner {
display: inline-block;
height: 500px;
}
</style>
<script src="full-screen-test.js"></script>
<body>
<div><div class=vertical>
<div class="inner">This div becomes a stretched flex item in fullscreen mode, and should
become normal-sized again once leaving it.</div>
<div class="inner">Number 2</div>
<div class="inner">Number 3</div>
<div class="inner">Number 4</div>
</div></div>
<script>
// 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 div = document.getElementsByTagName('div')[0];
var oldHeight = div.offsetHeight;
var divEnteredFullScreen = function(event) {
callback = divExitedFullScreen;
document.webkitExitFullscreen();
};
var divExitedFullScreen = function(event) {
callback = null;
testExpected(div.offsetHeight, oldHeight);
div.innerHTML = ""; // simplify the text dump
endTest();
};
callback = divEnteredFullScreen;
runWithKeyDown(function(){div.webkitRequestFullScreen()});
}
</script>
<button onclick="div.webkitRequestFullScreen()">Enter Fullscreen</button>