Safari 17+: Image file got automatically converted to HEIC extension

Issue: The image file mime type got converted to HEIC by Safari

To reproduce:

  • Create an HTML file with <input type="file" accept="image/*,image/heic" />
  • Try to upload a photo with .jpeg or .png
  • Print out the file object
  • The file name would be changed to some temporary name with .heic extension

Expected:

  • The conversion should not happen after adding the image/heic to the accept mime type.
  • The accept mine type with image/heic should be allowed and cannot be removed for other modern browsers which do not support .heic. Otherwise, the system browse dialog would disable .heic type.

Other findings:

  • If image/heic is removed from the accept mime type, the file object would be printed out as its original extension.
  • It only happens with Safari 17+.

Original file object:

File: {
    lastModified: 1702417372000,
    name: "leo2.jpeg",
    size: 170584,
    type: "image/jepg",
    webkitRelativePath: ""
}

Converted file object:

File: {
    lastModified: 1702417636000,
    name: "tempImageHjyd3l.heic",
    size: 170429,
    type: "image/heic",
    webkitRelativePath: ""
}

x2

Apple, please allow to upload original photo and video files to avoid quality loss.

Futhermore, please don't alter lastModified field.

Having the same issue causing problem in a project I work on. Hoping this is a bug and not the way they are expecting it to work!

same for me, the only solution now is :

For safari, remove "image/heic" in accept attribute

But it will make Chrome not working.

So we need to detect whether it's safari and then remove "image/heic". For other browsers, "image/heic" is required even we set "image/*" in accept already.

This should be a safari bug, safari should not convert png/jpg to heic when users select an image.

The new version of WordPress (6.7) that was released this week added support for HEIC, which I think is going to magnify this bug significantly. I discovered that when I upload a PNG in the WordPress Block Editor, Safari is converting it to HEIC, and then WordPress is converting that to JPEG. And I did verify that the problem is because WordPress added accept="image/heic" to that particular file input. There are other places in WordPress where that's not present, and you can still upload PNGs in those locations.

There is no logical reason for Safari to convert a PNG to HEIC on upload — especially with no option to not do that. Just because the form says it supports a format, doesn't mean the user wants their file changed to that format.

Safari 17+: Image file got automatically converted to HEIC extension
 
 
Q