third_party/WebKit/LayoutTests/fast/canvas/canvas-large-fills.html

   1 <!DOCTYPE html>
   2
   3 <script src="../../resources/js-test.js"></script>
   4
   5 <pre id="console"></pre>
   6 <canvas id="c" class="output" width="100" height="50"><p class="fallback">FAIL (fallback content)</p></canvas>
   7
   8 <script>
   9 var canvas = document.getElementById("c");
  10 var ctx = canvas.getContext("2d");
  11
  12 function clearContextToGreen() {
  13     ctx.globalCompositeOperation="source-over";
  14     ctx.fillStyle = "rgb(0, 255, 0)";
  15     ctx.fillRect(0, 0, canvas.width, canvas.height);
  16 }
  17
  18 var testData = [
  19     {compositeMode: 'source-over', expected: [0, 0, 255]},
  20     {compositeMode: 'source-in', expected: [0, 0, 255]},
  21     {compositeMode: 'source-out', expected: [0, 0, 0]},
  22     {compositeMode: 'source-atop', expected: [0, 0, 255]},
  23     {compositeMode: 'destination-over', expected: [0, 255, 0]},
  24     {compositeMode: 'destination-in', expected: [0, 255, 0]},
  25     {compositeMode: 'destination-out', expected: [0, 0, 0]},
  26     {compositeMode: 'destination-atop', expected: [0, 255, 0]},
  27     {compositeMode: 'lighter', expected: [0, 255, 255]},
  28     {compositeMode: 'copy', expected: [0, 0, 255]},
  29     {compositeMode: 'xor', expected: [0, 0, 0]},
  30 ];
  31
  32 function toHexString(number) {
  33     var hexString = number.toString(16).toUpperCase();
  34     if (number <= 9)
  35         hexString = '0' + hexString;
  36     return hexString;
  37 }
  38
  39 function doTest(dataItem, fillSize) {
  40     clearContextToGreen();
  41     ctx.fillStyle = "rgb(0, 0, 255)";
  42     ctx.globalCompositeOperation = dataItem.compositeMode;
  43     ctx.fillRect(0, 0, fillSize, fillSize);
  44
  45     var data = ctx.getImageData(0, 0, canvas.width, canvas.height);
  46     var pixelOK = true;
  47     var pixelString = '#';
  48     var expectedString = '#';
  49
  50     for (var x = 0; x < 3; x++) {
  51         pixelString = pixelString + toHexString(data.data[x]);
  52         expectedString = expectedString + toHexString(dataItem.expected[x]);
  53         if (data.data[x] != dataItem.expected[x])
  54             pixelOK = false;
  55     }
  56
  57     var testName = "Fill Size " + fillSize + ', ' + dataItem.compositeMode;
  58     if (pixelOK)
  59         testPassed(testName + ': ' + pixelString);
  60     else
  61         testFailed(testName + ': EXPECTED ' + expectedString + ', GOT ' + pixelString);
  62 }
  63
  64 debug("Tests that using the different composite modes to fill large rects doesn't crash and works as expected.");
  65 [10000, 50000, 100000].forEach(function(fillSize) {
  66     testData.forEach(function(dataItem) {
  67         doTest(dataItem, fillSize)
  68     })});
  69
  70 </script>
  71 </html>