third_party/WebKit/LayoutTests/http/tests/canvas/canvas-slow-font-loading.html

   1 <!DOCTYPE html>
   2 <head>
   3 <title>Canvas test: slow font loading</title>
   4 <style>
   5 @font-face {
   6   font-family: Ahem;
   7   src: url("../webfont/slow-ahem-loading.cgi");
   8 }
   9 </style>
  10 </head>
  11 <body>
  12
  13 <canvas id="c" width="100" height="50"><p>FAIL (fallback content)</p></canvas>
  14
  15 <script>
  16 var canvas = document.getElementById('c');
  17 var ctx = canvas.getContext('2d');
  18
  19 // Ahem font loading is slow so it will not be ready
  20 // in time for drawing the text. As a consequence, the
  21 // fallback font should be used and the result should
  22 // be 2 green 'X' on a red background.
  23 ctx.font = '67px Ahem, Arial';
  24 ctx.fillStyle = '#f00';
  25 ctx.fillRect(0, 0, 100, 50);
  26 ctx.fillStyle = '#0f0';
  27 ctx.fillText('XX', 0, 50);
  28 </script>
  29