<!DOCTYPE HTML> <!-- READ BEFORE UPDATING: If this test is updated make sure to increment the "revision" value of the associated test in content/test/gpu/page_sets/pixel_tests.py. This will ensure that the baseline images are regenerated on the next run. --> <html> <head> <title>Canvas 2D Test: Red Box over Black Background</title> <style type="text/css"> .nomargin { margin: 0px auto; } </style> <script> var g_swapsBeforeAck = 15; function main() { draw(); waitForFinish(); } function draw() { var canvas = document.getElementById("c"); var c2d = canvas.getContext("2d"); c2d.clearRect(0, 0, canvas.width, canvas.height); c2d.fillStyle = "rgba(255, 0, 0, 0.5)"; c2d.fillRect(50, 50, 100, 100); } function waitForFinish() { if (g_swapsBeforeAck == 0) { domAutomationController.setAutomationId(1); domAutomationController.send("SUCCESS"); } else { g_swapsBeforeAck--; document.getElementById('container').style.zIndex = g_swapsBeforeAck + 1; window.webkitRequestAnimationFrame(waitForFinish); } } </script> </head> <body onload="main()"> <div style="position:relative; width:200px; height:200px; background-color:black"> </div> <div id="container" style="position:absolute; top:0px; left:0px"> <canvas id="c" width="200" height="200" class="nomargin"></canvas> </div> </body> </html>