<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) {
var context;
function actualColor(x, y) {
return context.getImageData(x, y, 1, 1).data;
}
function checkBlendModeResult(i, context, sigma) {
var expectedColor = blendColors([129 / 255, 1, 129 / 255, 1], [1, 129 / 255, 129 / 255, 1], i);
var ac = actualColor(0, 0);
assert_approx_equals(ac[0], 0, sigma);
assert_approx_equals(ac[1], 0, sigma);
assert_approx_equals(ac[2], 0, sigma);
assert_approx_equals(ac[3], 0, sigma);
ac = actualColor(5, 5);
assert_approx_equals(ac[0], expectedColor[0], sigma);
assert_approx_equals(ac[1], expectedColor[1], sigma);
assert_approx_equals(ac[2], expectedColor[2], sigma);
assert_approx_equals(ac[3], expectedColor[3], sigma);
}
function runTest() {
var canvas = document.createElement("canvas");
var sigma = 5;
canvas.width = 10;
canvas.height = 10;
context = canvas.getContext("2d");
for (var i = 0; i < blendModes.length; ++i) {
context.clearRect(0, 0, 10, 10);
context.save();
context.beginPath();
context.moveTo(3, 3);
context.lineTo(3, 7);
context.lineTo(7, 7);
context.lineTo(7, 3);
context.lineTo(3, 3);
context.clip();
drawBackdropColorInContext(context);
context.globalCompositeOperation = blendModes[i];
drawSourceColorInContext(context);
checkBlendModeResult(i, context, sigma);
context.restore();
}
}
runTest();
}, 'Series of tests to ensure correct results on applying different blend modes when drawing with clipped regions.');
</script>
</script>
</body>
</html>