filepond-plugin-image-preview icon indicating copy to clipboard operation
filepond-plugin-image-preview copied to clipboard

Published 20 hours ago • verified publisher icon pqina

SVG Preview not working in Firefox if SVG does not have a width and height

Open bincTW opened this issue 4 years ago • 4 comments

Steps to reproduce: Open https://pqina.nl/filepond/#examples Drag any SVG File into Multiple File Upload Demo

Result: Safari 13.0.1 (MacOS 10.14.6) / Works as expected: shows preview and uploads file Chrome 89.0.x (MacOS 10.14.6) / Works as expected: shows preview and uploads file (Compared to Safari, the preview is blurred) Firefox 87.0 (MacOS 10.14.6) / Preview is not displayed / The file cannot be uploaded in the demo

bincTW avatar Apr 10 '21 19:04 bincTW

Justed tested, loads SVG without issue:

Screenshot 2021-04-12 at 08 55 34

Does your SVG have a width and height?

rikschennink avatar Apr 12 '21 06:04 rikschennink

That seems to be the problem. In some SVGs there are no parameters set for width/height. For these SVGs preview/editing doesn't work in Firefox - but it does in Chrome and Safari.

bincTW avatar Apr 12 '21 08:04 bincTW

Yes, it currently doesn't show a preview due to browsers not reading image size correctly, a fix is planned.

rikschennink avatar Apr 12 '21 13:04 rikschennink

Looked at this some more, Firefox doesn't draw anything to canvas when the SVG doesn't have a width/height so nothing I can do really, open to suggestions.

See test case here: https://codepen.io/rikschennink/pen/d3eba563d12d29114896b8b87be19eb5?editors=1010

rikschennink avatar Apr 22 '21 07:04 rikschennink