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

pqina / filepond-plugin-image-preview

🖼 Show a preview for images dropped on FilePond

https://pqina.nl/filepond

MIT License

46 stars 26 forks source link

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

Open bincTW opened 3 years ago

bincTW commented 3 years ago

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

rikschennink commented 3 years ago

Justed tested, loads SVG without issue:

Does your SVG have a width and height?

bincTW commented 3 years ago

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.

rikschennink commented 3 years ago

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

rikschennink commented 3 years ago

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