| <!DOCTYPE HTML> |
| <html> |
| <body> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <script type="text/javascript" src="canvas-blending-helpers.js"></script> |
| <script> |
| test(function(t) { |
| function checkShadowColor(i, context, sigma) { |
| var expectedShadowColor = blendColors([192 / 255, 192 / 255, 192 / 255, 1], [1, 129 / 255, 129 / 255, 1], i); |
| var ac = context.getImageData(11, 11, 1, 1).data; |
| assert_approx_equals(ac[0], expectedShadowColor[0], sigma); |
| assert_approx_equals(ac[1], expectedShadowColor[1], sigma); |
| assert_approx_equals(ac[2], expectedShadowColor[2], sigma); |
| assert_approx_equals(ac[3], expectedShadowColor[3], sigma); |
| } |
| |
| var canvas = document.createElement('canvas'); |
| var sigma = 5; |
| canvas.width = 12; |
| canvas.height = 12; |
| context = canvas.getContext('2d'); |
| |
| for (var i = 0; i < blendModes.length; ++i) { |
| context.clearRect(0, 0, 12, 12); |
| context.save(); |
| drawBackdropColorWithShadowInContext(context); |
| context.globalCompositeOperation = blendModes[i]; |
| drawSourceColorRectOverShadow(context); |
| checkBlendModeResult(i, context, 5); |
| checkShadowColor(i, context, sigma); |
| context.restore(); |
| } |
| }, 'Series of tests to ensure correct results on applying different blend modes when drawing a rectangle with shadow.'); |
| </script> |