fix: handle svg images without natural width and/or height on firefox
I've attempted to correct issue #3 and to mimick the handling of SVGs with a missing height or width attributes as it happens on Chrome, with mixed results.
Problem - Missing height AND width
If an SVG is provided on Firefox with no height and no width assigned, it's size will be height: 0 width: 0, resulting in blank images being generated.
Solution
The SVG image will be appended to the DOM with a max-width of 150px in order to measure its size and allowing the images to be generated correctly afterwards.
I based this arbitrary max-width value on
- A comment by
Emilio Cobos Álvarezon https://bugzilla.mozilla.org/show_bug.cgi?id=1607081 - The behavior of your service on Chrome, when uploading an SVG icon without height and width attributes. e.g. Adding the demo icon results in an 150x150 SVG, same holds true for other SVGs I've used without height/width attributes.
Drawbacks
- I was unable to find more details to support this img element rule
max-width:150pxon the user agent stylesheet of Chrome. - There are some discrepancies here and there for bigger SVGs, for example this grid SVG has a size of 143x150 on chrome while on Firefox my current solution translates it to 150x157
Problem - Missing height OR width
If an SVG is provided with ONLY height OR width, it's size will be 0 x Height or Width x 0, resulting again in blank images being generated.
Solution
The SVG image will be appended to the DOM with, in the case of missing height, the height attribute will be equal to the images natural width and vice versa for missing width. - (Natural implies the value assigned on the SVG element)
I based this on the behavior of your service when uploading an SVG icon without height OR width attributes on Chrome.
Here are the SVGs I used during the process so far angular 0x128 angular 128x0 angular 128x128 angular favicon 48x48 favicon 100x100 % favicon grid test-svgrepo
I do not expect this pull request to be merged at this point and of course, if no contributions are to be accepted or Firefox browser is something you do not wish to support, I understand. In that case feel free to close this request.
I am open to any criticism or insight and thanks again for this tool