blob: dd7a8a4194565098c6ac152525077eecad6719bf [file] [log] [blame]
<!DOCTYPE html> <!-- webkit-test-runner [ useFlexibleViewport=true ] -->
<script>
if (window.internals) {
internals.settings.setConstantPropertiesEnabled(true);
internals.settings.setViewportFitEnabled(true);
}
</script>
<head>
<meta name="viewport" content="initial-scale=1, viewport-fit=cover">
<style>
#a {
position: absolute;
left: env(safe-area-inset-right);
top: env(safe-area-inset-top);
width: 100px;
height: 100px;
background-color: green;
}
#b {
position: absolute;
left: env(safe-area-inset-bottom);
top: env(safe-area-inset-left);
width: 100px;
height: 100px;
background-color: blue;
}
</style>
<script>
function getUIScript()
{
return `
(function() {
uiController.setSafeAreaInsets(50, 25, 75, 100);
uiController.doAfterVisibleContentRectUpdate(function () {
uiController.uiScriptComplete();
});
})();`
}
if (window.testRunner) {
testRunner.waitUntilDone();
window.onload = function () {
testRunner.runUIScript(getUIScript(), function(result) {
testRunner.notifyDone();
});
}
}
</script>
</head>
<body>
<div id="a"></div>
<div id="b"></div>
<p>The boxes should be at 25, 50 and 75, 100.</p>
</body>