summaryrefslogtreecommitdiffstats
path: root/third_party/WebKit/LayoutTests/compositing/draws-content/canvas-simple-background.html
blob: 7c4aa19b45dbb50fb3e584c930ad670a960c8dd7 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<!DOCTYPE html>
<html>
  <head>
    <style type="text/css">
      .container {
        width: 60px;
        height: 60px;
      }
      #canvas-simple {
        /* No box decorations or background image. */
        /* Solid color background only. */
        background-color: green;
      }
    </style>
    <script>
        function drawCanvas(canvasID) {
            var canvas = document.getElementById(canvasID);
            var context = canvas.getContext("2d");

            // Fill NW quadrant with opaque blue.
            context.fillStyle = "#0000FF";
            context.fillRect(0, 0, canvas.width / 2, canvas.height / 2);
        };

        function doTest() {
            // Simple background can be direct-composited with content-layer.
            // The container GraphicsLayer does not paint anything.
            drawCanvas('canvas-simple');
        };
        window.addEventListener('load', doTest, false);
    </script>
  </head>

  <body>
    <div class="container">
      <canvas id="canvas-simple" width="50" height="50"></canvas>
    </div>
  </body>
</html>