Commit 7239a90b authored by abarth@chromium.org's avatar abarth@chromium.org

Add some incremental compositing tests

These tests that compositing updates work even when the render tree changes in
a minor way. These tests would have failed when introducing dirty bits for
CompositedLayerMapping in https://codereview.chromium.org/183763016.

R=chrishtr@chromium.org

Review URL: https://codereview.chromium.org/183833016

git-svn-id: svn://svn.chromium.org/blink/trunk@168358 bbb929c8-8fbe-4397-9dbb-9b2b20218538
parent 4647cfe3
<!DOCTYPE html>
<html>
<head>
<style>
.set {
position: absolute;
top: 8px;
}
.box {
height: 100px;
width: 100px;
background-color: lightblue;
}
.squashed {
height: 40px;
width: 40px;
background-color: lightgreen;
position: absolute;
left: 16px;
}
.hidden {
visibility: hidden;
}
.visible {
visibility: visible;
}
</style>
</head>
<body>
<div class="set">
<div class="box"></div>
<div class="squashed hidden" style="top: 4px"></div>
<div id="target1" class="squashed visible" style="top: 54px"></div>
</div>
<div class="set" style="top: 116px">
<div class="box"></div>
<div id="target2" class="squashed visible" style="top: 4px"></div>
<div class="squashed hidden" style="top: 54px"></div>
</div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<style>
.set {
position: absolute;
top: 8px;
}
.box {
height: 100px;
width: 100px;
background-color: lightblue;
}
.squashed {
height: 40px;
width: 40px;
background-color: lightgreen;
position: absolute;
left: 16px;
}
.hidden {
visibility: hidden;
}
.visible {
visibility: visible;
}
.composited {
-webkit-transform: translateZ(1px);
}
</style>
<script>
if (window.testRunner) {
testRunner.waitUntilDone();
internals.settings.setLayerSquashingEnabled(true);
}
requestAnimationFrame(function() {
requestAnimationFrame(function() {
document.getElementById('target1').classList.add('visible');
document.getElementById('target2').classList.add('visible');
setTimeout(function() {
if (window.testRunner)
testRunner.notifyDone();
});
});
});
</script>
</head>
<body>
<!-- This test checks that squashed RenderLayers are painted even if not all
of the RenderLayers squahed into a given GraphicsLayer are visible. -->
<div class="set">
<div class="composited box"></div>
<div class="squashed hidden" style="top: 4px"></div>
<div id="target1" class="squashed hidden" style="top: 54px"></div>
</div>
<div class="set" style="top: 116px">
<div class="composited box"></div>
<div id="target2" class="squashed hidden" style="top: 4px"></div>
<div class="squashed hidden" style="top: 54px"></div>
</div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<style>
.set {
position: absolute;
top: 8px;
}
.box {
height: 100px;
width: 100px;
background-color: blue;
}
.hidden {
visibility: hidden;
}
.container.hidden {
outline: 4px solid red;
}
.visible {
visibility: visible;
}
.should-be-hidden {
background-color: red !important;
}
.should-be-visible {
background-color: green !important;
}
.visible-indicator {
background-color: green;
}
.hidden-indicator {
background-color: red;
}
</style>
</head>
<body>
<div class="set">
<div class="hidden-indicator box"></div>
<div class="visible-indicator box"></div>
<div class="hidden-indicator box"></div>
</div>
<div class="set">
<div class="hidden container">
<div class="visible box should-be-visible"></div>
</div>
<div class="hidden container">
<div class="box should-be-hidden"></div>
</div>
<div class="hidden container">
<div id="target" class="visible box should-be-visible"></div>
</div>
</div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<style>
.set {
position: absolute;
top: 8px;
}
.box {
height: 100px;
width: 100px;
background-color: blue;
}
.hidden {
visibility: hidden;
}
.container.hidden {
outline: 4px solid red;
}
.visible {
visibility: visible;
}
.should-be-hidden {
background-color: red !important;
}
.should-be-visible {
background-color: green !important;
}
.composited {
-webkit-transform: translateZ(1px);
}
.visible-indicator {
background-color: green;
}
.hidden-indicator {
background-color: red;
}
</style>
<script>
if (window.testRunner)
testRunner.waitUntilDone();
requestAnimationFrame(function() {
requestAnimationFrame(function() {
document.getElementById('target').classList.add('visible');
setTimeout(function() {
if (window.testRunner)
testRunner.notifyDone();
});
});
});
</script>
</head>
<body>
<!-- Tests that making a child of a composited layer visible causes that child to actually paint -->
<div class="set">
<div class="hidden-indicator box"></div>
<div class="visible-indicator box"></div>
<div class="hidden-indicator box"></div>
</div>
<div class="set">
<div class="hidden container composited">
<div class="visible box should-be-visible"></div>
</div>
<div class="hidden container composited">
<div class="box should-be-hidden"></div>
</div>
<div class="hidden container composited">
<div id="target" class="box should-be-visible"></div>
</div>
</div>
</body>
</html>
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment