Bug 206914 – CanvasRenderingContext2DBase::drawImage() should use the destRect values to draw the SVG image.

• Status: NEW
• Component: SVG

[zalan]

see fast/hidpi/image-srcset-relative-svg-canvas-2x.html and rdar://problem/58580461

[Radar WebKit Bug Importer]

<rdar://problem/59035239>

[Said Abou-Hallawa]

Created attachment 389291 [details]
test case

Open the attached test case in Safari, in Chrome and in FireFox. The three browsers have different layout and rendering of the test case.

This test case has an SVG image embedded inside an <img> element. The SVG does not have intrinsic size. But the css size of the <img> element is (100x50). The <img> element is then drawn to the canvas to (200x100) rectangle. This is how the three browsers behave:

1. Safari: the <img> element intrinsic size (100x50) is used for doing the SVG layout when it's drawing as an embedded element inside the <img> element and when it is drawn to the canvas through the drawImage() API.

2. Chrome: the <img> element intrinsic size (100x50) is used for doing the SVG layout when drawing it in as an embedded element inside the <img> element. But the destRect (200x100) of the canvas drawImage() API is used to do the SVG layout when it is drawn to the canvas through the drawImage() API.

3. FireFox: I am not sure how the intrinsic size of the SVG is set to (200x100). And it seems FireFox does not support drawing an SVG image to canvas.

I looked for a specification on how this should work but I could not find anything.

[Said Abou-Hallawa]

Created attachment 389292 [details]
test case

[Said Abou-Hallawa]

Related GitHub issue: https://github.com/w3c/svgwg/issues/784