1283234 - Canvas drawImage inline svg doesn't work on Firefox

Status: RESOLVED DUPLICATE of bug 700533

(Core :: Graphics: Canvas2D, defect)

Description

[Eric White]

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

Steps to reproduce:

When doing drawImage with an image that's source is an inline svg the svg fails to draw on the canvas.

http://codepen.io/Ewhite613/pen/YWZoGy

More dynamic approach(I used to test different svgs): http://jsfiddle.net/Na6X5/944/


Actual results:

No errors occur just a blank canvas (if looking at jsfiddle. Missing svg if on codepen).


Expected results:

If you run http://jsfiddle.net/Na6X5/944/ on Chrome (51.0) the image is drawn to the Canvas as expected.

Comment 1

[Eric White]

http://stackoverflow.com/questions/38106906/canvas-drawimage-inline-svg-doesnt-work-on-firefox/38107431#38107431

It appears "The SVG image data must have width and height attributes that are not percentages." Which does work but shouldn't the Canvas be able to work without this?

Comment 2

[Eric White]

Working with this I also found document.getElementById('mySVG').clientWidth produces 0 on FireFox when running on http://fiddle.jshell.net/Na6X5/944/show/

Comment 4

[Robert Longson [:longsonr]]

comment 2 is bug 874811