blob: 0895eb2c2620323a6c9b4990bc050e32df1c15e0 [file] [log] [blame]
<!DOCTYPE html>
<html>
<head>
<style type="text/css" media="screen">
canvas {
margin: 20px;
width: 200px;
height: 200px;
padding: 0 0;
}
.border {
border: 1px solid black;
}
</style>
<script>
function initWebGL()
{
var canvas = document.getElementById('canvas');
var gl = canvas.getContext("experimental-webgl", {'antialias': false});
if (!gl) {
alert("No WebGL context found");
return null;
}
return gl;
}
var gl = null;
function init()
{
gl = initWebGL();
gl.viewport(0, 0, 200, 200);
gl.clearColor(1, 0, 0, 1); // red
gl.clear(gl.COLOR_BUFFER_BIT);
if (window.testRunner) {
testRunner.displayAndTrackRepaints();
testRunner.dumpAsText(true);
drawGreen();
} else
window.setTimeout(drawGreen, 50);
}
function drawGreen()
{
gl.clearColor(0, 1, 0, 1); // green
gl.clear(gl.COLOR_BUFFER_BIT);
if (window.testRunner) {
testRunner.displayAndTrackRepaints();
testRunner.displayAndTrackRepaints();
} else
window.setInterval(function() {
document.getElementById('canvas').classList.toggle('border');
}, 50);
}
</script>
</head>
<body onload="init()">
<canvas id="canvas" width="200" height="200"></canvas>
</body>
</html>