chromium/src/third_party/blink/web_tests/fast/canvas/canvas-blending-clipping.html

<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>