1008866 - CANVAS certain globalCompositeOperation types don't work for createRadialGradient

Status: UNCONFIRMED

(Core :: Graphics: Canvas2D, defect)

Description

[Virgil Spruit]

Attachment: globalCompositeOperation.jpg

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/34.0.1847.131 Safari/537.36

Steps to reproduce:

1. Apply a createRadialGradient fillStyle.
    var grad1 = ctx.createLinearGradient(15,15, 70,70);
    grad1.addColorStop(0,    'yellow');
    grad1.addColorStop(0.25, 'red');
    grad1.addColorStop(0.75, 'blue');
    grad1.addColorStop(1,    'limegreen');

    // draw rectangle
    ctx.lineWidth = 10;
    ctx.fillStyle = grad1;
    ctx.fillRect(15,15,70,70);

2. Apply a globalCompositeOperation type to render the mask. For instance 
    ctx.globalCompositeOperation = 'destination-in';

Please compare this url in Chrome and in Firefox
http://flashcanvas.net/examples/uupaa-js-spinoff.googlecode.com/svn/trunk/uuCanvas.js/demo/6_1_canvas_composite_gradients.html

In particular destination-in has no effect at all.


Actual results:

Doesn't render the proper mask in.




Expected results:

Render the destination-in to a mask of the gradient.