third_party/WebKit/LayoutTests/compositing/draws-content/canvas-simple-background.html

   1 <!DOCTYPE html>
   2 <html>
   3   <head>
   4     <style type="text/css">
   5       .container {
   6         width: 60px;
   7         height: 60px;
   8       }
   9       #canvas-simple {
  10         /* No box decorations or background image. */
  11         /* Solid color background only. */
  12         background-color: green;
  13       }
  14     </style>
  15     <script>
  16         function drawCanvas(canvasID) {
  17             var canvas = document.getElementById(canvasID);
  18             var context = canvas.getContext("2d");
  19
  20             // Fill NW quadrant with opaque blue.
  21             context.fillStyle = "#0000FF";
  22             context.fillRect(0, 0, canvas.width / 2, canvas.height / 2);
  23         };
  24
  25         function doTest() {
  26             // Simple background can be direct-composited with content-layer.
  27             // The container GraphicsLayer does not paint anything.
  28             drawCanvas('canvas-simple');
  29         };
  30         window.addEventListener('load', doTest, false);
  31     </script>
  32   </head>
  33
  34   <body>
  35     <div class="container">
  36       <canvas id="canvas-simple" width="50" height="50"></canvas>
  37     </div>
  38   </body>
  39 </html>