canvas-fillRect-gradient-shadow.html

<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<body>
<script>

var rgbApprox = 70, alphaApprox = 0, alphaMax = 0;
function testPixelShadow(pixel, reference) {
  for(i = 0; i < 3; i++){
    if(pixel[3] != 0) pixel[i] = pixel[i] * 255 / pixel[3];
    assert_approx_equals(pixel[i], reference[i], rgbApprox);
 }
  if(alphaMax != 0)
    assert_true(pixel[3] < alphaMax);
  else
    assert_approx_equals(pixel[3], reference[3], alphaApprox);
}

var canvas = document.createElement('canvas');
document.body.appendChild(canvas);
canvas.setAttribute('width', '400');
canvas.setAttribute('height', '650');
var ctx = canvas.getContext('2d');

var gradient = ctx.createLinearGradient(0, 0, 100, 100);
gradient.addColorStop(0, 'rgba(0, 0, 255, 1.0)');
gradient.addColorStop(1, 'rgba(0, 0, 255, 1.0)');

ctx.shadowOffsetX = 200;
ctx.fillStyle = gradient;

ctx.shadowColor = 'rgba(255, 0, 0, 1.0)';
ctx.fillRect(50, 50, 100, 100);

ctx.shadowColor = 'rgba(255, 0, 0, 0.3)';
ctx.fillRect(50, 200, 100, 100);

ctx.shadowColor = 'rgba(255, 0, 0, 1.0)';
ctx.shadowBlur = 5;
ctx.fillRect(50, 350, 100, 100);

ctx.shadowColor = 'rgba(255, 0, 0, 0.3)';
ctx.fillRect(50, 500, 100, 100);

// rgbApprox = 1
testSolidShadow =
    [
        ['testSolidShadow 1', ctx.getImageData(250, 50, 1, 1).data, [255, 0, 0, 255]],
        ['testSolidShadow 2', ctx.getImageData(250, 149, 1, 1).data, [255, 0, 0, 255]],
        ['testSolidShadow 3', ctx.getImageData(349, 50, 1, 1).data, [255, 0, 0, 255]],
        ['testSolidShadow 4', ctx.getImageData(349, 149, 1, 1).data, [255, 0, 0, 255]],
    ];

// rgbApprox = 3, alphaApprox = 5
testSolidAlphaShadow =
    [
        ['testSolidAlphaShadow 1', ctx.getImageData(250, 200, 1, 1).data, [255, 0, 0, 76]],
        ['testSolidAlphaShadow 2', ctx.getImageData(250, 299, 1, 1).data, [255, 0, 0, 76]],
        ['testSolidAlphaShadow 3', ctx.getImageData(349, 200, 1, 1).data, [255, 0, 0, 76]],
        ['testSolidAlphaShadow 4', ctx.getImageData(349, 299, 1, 1).data, [255, 0, 0, 76]],
    ];

// alpha < 25
testBlurryShadow =
    [
        ['testBlurryShadow 1', ctx.getImageData(248, 347, 1, 1).data, [255, 0, 0, 0]],
        ['testBlurryShadow 2', ctx.getImageData(248, 452, 1, 1).data, [255, 0, 0, 0]],
        ['testBlurryShadow 3', ctx.getImageData(351, 347, 1, 1).data, [255, 0, 0, 0]],
        ['testBlurryShadow 4', ctx.getImageData(351, 452, 1, 1).data, [255, 0, 0, 0]],
    ];

// alpha < 10
testBlurryAlphaShadow =
    [
        ['testBlurryAlphaShadow 1', ctx.getImageData(248, 497, 1, 1).data, [255, 0, 0, 0]],
        ['testBlurryAlphaShadow 2', ctx.getImageData(248, 602, 1, 1).data, [255, 0, 0, 0]],
        ['testBlurryAlphaShadow 3', ctx.getImageData(351, 497, 1, 1).data, [255, 0, 0, 0]],
        ['testBlurryAlphaShadow 4', ctx.getImageData(351, 602, 1, 1).data, [255, 0, 0, 0]],
    ];

rgbApprox = 1;
generate_tests(testPixelShadow, testSolidShadow);

rgbApprox = 3;
alphaApprox = 5;
generate_tests(testPixelShadow, testSolidAlphaShadow);

rgbApprox = 10;
alphaMax = 25;
generate_tests(testPixelShadow, testBlurryShadow);

alphaMax = 10;
generate_tests(testPixelShadow, testBlurryAlphaShadow);

</script>
</body>
chromium/third_party/blink/web_tests/fast/canvas/canvas-fillRect-gradient-shadow.html
