third_party/WebKit/LayoutTests/fast/canvas/yuv-video-on-accelerated-canvas.html

   1 <html>
   2 <head>
   3   <title>Ensure correct behavior of drawImage video elements on both software canvas and accelerated canvas. crbug.com/424591</title>
   4   <!--
   5     This test is made to check a video bug rather than a canvas bug. When we use both sw
   6     canvas and hw canvas, the video bug appears.
   7     The video impl has its own cache mechanism to cache SkBitmap after converting
   8     video frame to SkBitmap.
   9     When hw canvas draws video, video caches SkBitmap backed on GrTexture. When sw
  10     canvas draws video, video caches SkBitmap backed on system memory.
  11     The problem appears when we draws the video on both hw canvas and sw canvas.
  12     When hw canvas draws, the video caches GrTexture based SkBitmap. and then when
  13     sw canvas draws, the video draws GrTexture based SkBitmap on sw canvas.
  14     Otherwise, if sw canvas draws prior, the video draws system memory SkBitmap on
  15     hw canvas.
  16     'loop' attribute makes video be played hundreds times per second, which reveals
  17     crbug.com/455235
  18   -->
  19   <style trpe="text/css">
  20   video {
  21     display: none;
  22   }
  23   </style>
  24 </head>
  25 <body>
  26   <canvas id="hw-canvas" width=300 height=300></canvas>
  27   <canvas id="sw-canvas" width=150 height=150></canvas>
  28   <video id="video" loop>
  29     <source src="resources/canvas_video.mp4"  type='video/mp4' />
  30     <source src="resources/canvas_video.webm" type='video/webm' />
  31     <source src="resources/canvas_video.ogv"  type='video/ogg' />
  32   </video>
  33   <script>
  34   if (window.testRunner) {
  35     testRunner.dumpAsTextWithPixelResults();
  36     testRunner.waitUntilDone();
  37   }
  38   if (window.internals)
  39     window.internals.settings.setMinimumAccelerated2dCanvasSize(257*256);
  40
  41   var hw_canvas = document.getElementById("hw-canvas");
  42   var hw_ctx = hw_canvas.getContext("2d");
  43   // Although enabling accelerated-2d-canvas, canvas with the dimension
  44   // less than 257*256 is not accelerated.
  45   var sw_canvas = document.getElementById("sw-canvas");
  46   var sw_ctx = sw_canvas.getContext("2d");
  47
  48   var video = document.getElementById("video");
  49   video.addEventListener("playing", drawImageToCanvas, true);
  50   video.play();
  51
  52   function drawVideo(ctx, canvas) {
  53     ctx.globalAlpha = 1;
  54     ctx.fillStyle = "blue";
  55     ctx.fillRect(0, 0, canvas.width, canvas.width);
  56     ctx.drawImage(video, 0, 0);
  57     ctx.globalAlpha = 0.5;
  58     ctx.drawImage(video, 0, 60);
  59   }
  60
  61   function drawImageToCanvas() {
  62     video.removeEventListener("playing", drawImageToCanvas, true);
  63     for (i = 0; i < 10; i++) {
  64       drawVideo(sw_ctx, sw_canvas);
  65       drawVideo(hw_ctx, hw_canvas);
  66     }
  67     if (window.testRunner)
  68       testRunner.notifyDone();
  69   }
  70   </script>
  71 </body>
  72 </html>