webgl-layer-update.html | Explore in Territory

<!DOCTYPE html>
<html>
<script src="../../resources/run-after-layout-and-paint.js"></script>
<script>
    function init()
    {
        runAfterLayoutAndPaint(function() {
            document.getElementsByTagName('canvas')[0].style.top = "60px";
        }, true);
    }
</script>
<body onload="init()">
<span id="description" style="color: white">
This test is only useful as a pixel test. You should see red canvas of size 100x100.
</span>
<br>
<style>
canvas {
    outline: 1px solid blue;
}
body {
    background-color: darkblue;
}
</style>
<script>

if (window.testRunner) {
    document.getElementById("description").style.position = "absolute";
    document.getElementById("description").style.top = "-5000px";
}

var can = document.createElement('canvas');
can.width = can.height = 100;
can.style.position = "absolute";
can.style.left = "40px";
can.style.top = "40px";
document.body.appendChild(can);
var ctx = can.getContext("webgl");
ctx.clearColor(1, 0, 0, 1);
ctx.clear(ctx.COLOR_BUFFER_BIT);
</script>
</body>
</html>

chromium/third_party/blink/web_tests/fast/webgl/webgl-layer-update.html