third_party/WebKit/LayoutTests/fast/canvas/canvas-incremental-repaint-3.html

   1 <!DOCTYPE html>
   2 <html lang="en">
   3 <head>
   4   <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
   5   <title>Canvas Incremental Repaint</title>
   6   <style type="text/css" media="screen">
   7     canvas {
   8       width: 300px;
   9       height: 300px;
  10       border: 20px solid green;
  11       padding: 10px;
  12       background-color: green;
  13     }
  14   </style>
  15   <script src="../../resources/run-after-layout-and-paint.js"></script>
  16   <script type="text/javascript" charset="utf-8">
  17
  18     if (window.testRunner) {
  19       testRunner.dumpAsTextWithPixelResults();
  20       testRunner.waitUntilDone();
  21     }
  22
  23     var canvas;
  24     var ctx;
  25
  26     function beginTest()
  27     {
  28       canvas = document.getElementById('canvas1');
  29       ctx = canvas.getContext('2d');
  30       canvas.width = 300;
  31       canvas.height = 300;
  32       ctx.fillStyle = 'red';
  33       ctx.fillRect(0, 0, 300, 300);
  34       runAfterLayoutAndPaint(repaintTest)
  35     }
  36
  37     function repaintTest()
  38     {
  39       ctx.fillStyle = 'green';
  40       ctx.fillRect(0, 0, 300, 300);
  41       if (window.testRunner) {
  42           testRunner.notifyDone();
  43       }
  44     }
  45   </script>
  46 </head>
  47 <body onload="beginTest()">
  48   <p>Expect a solid green square below this text.</p>
  49   <canvas id="canvas1"></canvas>
  50 </body>
  51 </html>