MIME type detection working for files, but not files within a dragged folder (Firefox)

Do you want to request a feature or report a bug?

• I found a bug
• I want to propose a feature

What is the current behavior? When dragging a folder to the dropzone, the MIME types for audio files inside the folder are unset.

When I click the dropzone and choose the audio files through the file browser, the MIME types are correctly set.

I realise there are bugs about MIME type support for different browser/OS platforms. However, MIME type detection of audio files appears to work when a file/files is/are selected, but not folders.

If the current behavior is a bug, please provide the steps to reproduce. I tried using the codesandbox.io editor but found no way to share the code once I’d written it, so instead here is the simple example:

import React, {useCallback} from "react";
import { useDropzone } from "react-dropzone";

export default function App(props) {
  const onDrop = useCallback(acceptedFiles => {
    acceptedFiles.forEach(file => {
      console.log(file.type);
    });
  }, [])
  const { getRootProps, getInputProps, isDragActive } = useDropzone({ onDrop })

  return (
    <div {...getRootProps()}>
      <input {...getInputProps()} />
      {
        isDragActive ?
          <p>Drop the files here ...</p> :
          <p>Drag 'n' drop some files here, or click to select files</p>
      }
    </div>
  )
}

Here’s an empty audio file inside a folder:

current-art.zip

1. Visit the page.
2. Click the dropzone text and choose the audio file.
3. In the console, you should get the text audio/mpeg (it’s an MP3 file).

Now…

1. Drag the current-art folder to the dropzone.
2. In the console, you should get the text image/jpeg for the sibling image, but then <empty string> for the same music file.

What is the expected behavior? MIME type detection should work the same for dragging a folder as choosing a file. In the second example above, the same MIME type should be output.

Please mention other relevant information such as the browser version, Operating System and react-dropzone version. Firefox 73.0.1 Ubuntu 16.04.1 react-dropzone 10.2.1

[gurka]

Looks like there already is a Firefox bug ticket for this https://bugzilla.mozilla.org/show_bug.cgi?id=1424689

[haywirez]

Also the case for Chrome 😕