Реагировать на Dropzone FileReader - невозможно прочитать как файл: {}

Question

Я использую следующий код для извлечения данных из удаленного / выбранного файла.

onDrop = (files) => {
  files.forEach(file => {
    const reader = new FileReader();
    reader.onload = () => {
      const fileAsBinaryString = reader.result
      console.log(fileAsBinaryString);
    }
    reader.onabort = () => console.log('file reading was aborted');
    reader.onerror = () => console.log('file reading has failed');

    try {
      reader.readAsDataURL(file);
    } catch(err) {
      console.log(err)
      console.log(file);
    }

    this.setState({
      fileName: file.name
    })
  });
}

render() {
  return (
    <div className="app">
      <ReactDropzone onDrop={this.onDrop} className="dropzone">
        <IconContext.Provider value={{ size: "5em" }}>
          <IoMdCloudUpload/>
        </IconContext.Provider>
        <h1>{this.state.fileName}</h1>
      </ReactDropzone>
    </div>
  );
}

Когда я запускаю сервер и перетаскиваю что-то внутри рабочей зоны, хотя console.log (файл) дает мне непустой объект File, я получаю

Error: cannot read as File: {}

В

reader.readAsDataURL(file);

Есть идеи, почему это может произойти и как мне это исправить?