Featured Image Preview breaks when an SVG image is uploaded.

[deepakvijayan]

Steps to reproduce.

Add a new post - set a featured image. Use an SVG as the featured image.
The layout breaks inside InspectorControls

It seems to be because the image tag returns 0 as its naturalWidth/naturalHeight.

Reference for what seems to be the issue with SVG.
​https://bugzilla.mozilla.org/show_bug.cgi?id=1607081

Note: This can only be reproduced if, SVG image upload is enabled via functions.php. Since by default, WordPress doesn’t allow SVG upload.

[Ankit K Gupta]

I have been able to reproduce this issue after adding a function to the functions.php file. By default, WordPress does not allow the uploading of SVG images, and only administrators can enable SVG uploads by adding a function to the functions.php file.
Therefore, I am wondering if this is indeed an issue in the core of WordPress and it should be addressed and fixed within the core itself.

Steps to Reproduce -

1. Edit the theme's function.php and add below function to add SVG image as Featured Image

   <?php
   function allow_svg_upload_featured_image($mimes) {
       $mimes['svg'] = 'image/svg+xml';
       return $mimes;
   }
   add_filter('upload_mimes', 'allow_svg_upload_featured_image');
   

2. Log in to your WordPress admin dashboard.
3. Add a new post and upload SVG image as the featured image
4. Image will look broken as shown in screenshot.