third_party/WebKit/LayoutTests/fast/canvas/canvas-blending-transforms.html

   1 <!DOCTYPE HTML>
   2 <html>
   3 <body>
   4     <script src="../../resources/js-test.js"></script>
   5     <script type="text/javascript" src="canvas-blending-helpers.js"></script>
   6     <script type="text/javascript">
   7
   8         description("Series of tests to ensure correct results on applying different blend modes when drawing in a transformed context.");
   9
  10         var context;
  11         function actualColor(x, y) {
  12             return context.getImageData(x, y, 1, 1).data;
  13         }
  14
  15         function checkBlendModeResult(i, context, sigma) {
  16             var expectedColor = blendColors([129 / 255, 1, 129 / 255, 1], [1, 129 / 255, 129 / 255, 1], i);
  17             var ac = "actualColor(0, 1)";
  18             shouldBeCloseTo(ac + "[0]", expectedColor[0], sigma);
  19             shouldBeCloseTo(ac + "[1]", expectedColor[1], sigma);
  20             shouldBeCloseTo(ac + "[2]", expectedColor[2], sigma);
  21             shouldBeCloseTo(ac + "[3]", expectedColor[3], sigma);
  22
  23             ac = "actualColor(9, 9)";
  24             shouldBeCloseTo(ac + "[0]", 0, sigma);
  25             shouldBeCloseTo(ac + "[1]", 0, sigma);
  26             shouldBeCloseTo(ac + "[2]", 0, sigma);
  27             shouldBeCloseTo(ac + "[3]", 0, sigma);
  28         }
  29
  30         function runTest() {
  31             var canvas = document.createElement("canvas");
  32             var sigma = 5;
  33             canvas.width = 10;
  34             canvas.height = 10;
  35             context = canvas.getContext("2d");
  36
  37             for (var i = 0; i < blendModes.length; ++i) {
  38                 debug("Testing blend mode " + blendModes[i]);
  39
  40                 context.clearRect(0, 0, 10, 10);
  41                 context.save();
  42                 applyTransformsToContext(context);
  43                 drawBackdropColorInContext(context);
  44                 context.globalCompositeOperation = blendModes[i];
  45                 drawSourceColorInContext(context);
  46                 checkBlendModeResult(i, context, sigma);
  47                 context.restore();
  48                 debug('');
  49             }
  50         }
  51
  52         runTest();
  53     </script>
  54 </body>
  55 </html>