REGRESSION(r147602): Search text field doesn't render selection when it has some...
[WebKit-https.git] / ManualTests / animated-canvas-as-background.html
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <style>
5 #container {
6     width: 300px;
7     height: 300px;
8     background-image: -webkit-canvas(sourceCanvas);
9     background-size: 100%;
10     display: inline-block;
11 }
12 </style>
13 </head>
14 <body>
15     <p>This test passes if two green squares are displayed below.</p>
16     <div>
17         <div style="display: inline-block">
18             <div id="container"></div>
19         </div>
20         <div id="canvas-container" style="display: inline-block"></div>
21     </div>
22     <script>
23         var ctx = document.getCSSCanvasContext('2d', 'sourceCanvas', 300, 300);
24         var canvas = ctx.canvas;
25
26         function asyncDraw2() {
27             ctx.fillStyle = "green";
28             ctx.fillRect(0, 0, 300, 300);
29         }
30
31         function asyncDraw1() {
32             ctx.fillStyle = "red";
33             ctx.fillRect(0, 0, 300, 300);
34             window.webkitRequestAnimationFrame(asyncDraw2);
35         }
36
37         window.webkitRequestAnimationFrame(asyncDraw1);
38
39         document.querySelector('#canvas-container').appendChild(canvas);
40     </script>
41 </body>
42 </html>