blob: e4436284b1f6f81a5a3a0a1f221cb3fed8397ea5 [file] [log] [blame]
<!DOCTYPE html>
<style>
::-webkit-scrollbar {
width: 0px;
height: 0px;
}
body, html {
width: 100%;
height: 100%;
}
body {
margin: 0px;
}
#rootscroller {
width: 100%;
height: 100%;
overflow: auto;
will-change: transform;
background-image:linear-gradient(0deg, transparent 50%, #0a0 50%),
linear-gradient(90deg, #a00 50%, #0a0 50%);
background-size:75px 75px,75px 75px;
background-position:0 0, 0 25px;
}
#parent {
width: 100%;
height: 100%;
}
.spacer {
margin: 50px;
width: 20px;
height: 50%;
background-color: blue;
}
</style>
<!--The root scroller and its child are colorful. The test applies a filter to
root scroller's parent. It passes if the output is entirely sepia colored.-->
<div id="parent">
<div id="rootscroller">
<div class="spacer">
</div>
</div>
</div>
<script>
window.onload = function() {
var parent = document.querySelector('#parent');
var rootscroller = document.querySelector('#rootscroller');
document.rootScroller = rootscroller;
parent.style.filter = "sepia(100)";
}
</script>