Search code examples
htmlsafari

Safari cannot upload file w/ unknown mime type (?) (shows "tempImage")

Here's a very weird bug that occurs in Safari 15.3 and 15.4 (macOS) but not in any other browser.

If I have the following element:

<input type="file" accept=".json,.cbor">

I can select any .cbor file.

Working

However, if I do:

<input type="file" accept=".json,.jpg,.cbor">

Safari shows a 'tempImageXXXXX.jpg' name and does not select the actual file.

Broken

This only happens for .cbor files in our test, but I assume it might have something to do with unknown mime types? .wav, .json, .jpeg, .mp4, etc. all have no issues. Also no other browser has any issues with this. Re-ordering the extensions in the element neither.

To replicate: just rename a txt file to .cbor and paste the code above into jsfiddle.

Solution

  • try using this:

    <input type="file" accept="application/json,image/jpg,.cbor" />

    if that did not work fine, try changing .cbor with text/plain