blob: 29770ce3e34a879c050f0f57e70a53c93ba22f37 [file] [log] [blame]
<!doctype html>
<html>
<head>
<style>
#box {
position: absolute;
top: 100px;
left: 100px;
width: 100px;
height: 100px;
background-color: silver;
}
.dot {
position: absolute;
top: 0;
left: 0;
height: 4px;
width: 4px;
background-color: silver;
}
#box.animating {
animation: move 1s linear;
}
@keyframes move {
from { transform: translate3d(100px, 2000px, 0); }
to { transform: translate3d(100px, 2100px, 0); }
}
</style>
<script src="../resources/compositing-test-utils.js"></script>
<script>
if (window.testRunner) {
testRunner.dumpAsText();
testRunner.waitUntilDone();
}
function dumpLayerTree()
{
if (!window.internals)
return;
var out = document.getElementById('out');
out.innerText = layerTreeWithoutTransforms(internals.LAYER_TREE_INCLUDES_BACKING_STORE_ATTACHED);
}
function dumpLayersSoon()
{
setTimeout(function() {
dumpLayerTree();
if (window.testRunner)
testRunner.notifyDone();
}, 0);
}
function runTest()
{
makeDots(5, 5, 60);
let box = document.getElementById('box');
box.addEventListener('animationstart', dumpLayersSoon, false);
box.classList.add('animating');
}
window.addEventListener('load', runTest, false);
</script>
</head>
<body>
<p>An in-view element animating off-screen should not have backing store.</p>
<pre id="out"></pre>
<div id="box">
Some text here to force backing store.
</div>
</body>
</html>