html2canvas
html2canvas copied to clipboard
WIP fix svg with no width height
Summary
Fixed handling of svg images with no width/height attributes. closes #1897
Details
Such images were not appearing in resulting canvas when using firefox. The details of the problem are explained in https://bugzilla.mozilla.org/show_bug.cgi?id=700533 and https://webcompat.com/issues/64352 but a rough summary is that firefox won't render svg with no width/height attribute via drawImage. This fix thus recreates the missing attributes from the viewport one when they are missing
Testing
A new test was added in images/svg called nowidth.html, copied form external.html but using a modified version of image.svg now called imageViewPortOnly.svg and having no width/height attributes. Running tests before the fix (keep only the first commit of this MR), you would see the generated screenshot for nowidth being empty. With the fix (second commit of this MR) it's working and identical to the original external case.
Problems remaining
This is still WIP as I had to add a 3rd commit with a bad hack (an extra sleep) as I was not able to debug the remaining issue of timing in the async code. Here is a copy of the commit message :
This adds a sleep in renderReplacedElement so that drawimage works properly when the fix to svg files is used.
Without that, it looks like drawImage fires too fast and the fix is not yet done (code is async here)
So far I did not find out where I messed up with async code. Any help would be welcome !
I don't understand the need for sleep()
See the "problems remaining" section. I also do not get why I needed it. I must say I'm not really good at async code so I must have missed something somewhere and the sleep is just bad hack to make things work