fix: restore isFileDialogActive to false after the FileDialog was clo…

…sed (#556)

src/index.js

@@ -236,16 +236,17 @@ class Dropzone extends React.Component {
   onFileDialogCancel() {
     // timeout will not recognize context of this method
     const { onFileDialogCancel } = this.props
-    const { fileInputEl } = this
-    let { isFileDialogActive } = this
-    // execute the timeout only if the onFileDialogCancel is defined and FileDialog
-    // is opened in the browser
-    if (onFileDialogCancel && isFileDialogActive) {
+    // execute the timeout only if the FileDialog is opened in the browser
+    if (this.isFileDialogActive) {
       setTimeout(() => {
         // Returns an object as FileList
-        const FileList = fileInputEl.files
-        if (!FileList.length) {
-          isFileDialogActive = false
+        const { files } = this.fileInputEl
+
+        if (!files.length) {
+          this.isFileDialogActive = false
+        }
+
+        if (typeof onFileDialogCancel === 'function') {
           onFileDialogCancel()
         }
       }, 300)

src/index.spec.js

@@ -981,6 +981,26 @@ describe('Dropzone', () => {
         }, 300)
       }, 0)
     })
+
+    it('should restore isFileDialogActive to false after the FileDialog was closed', done => {
+      const component = mount(<Dropzone />)
+
+      spy(component.instance(), 'open')
+      component.simulate('click')
+
+      setTimeout(() => {
+        expect(component.instance().isFileDialogActive).toEqual(true)
+
+        const evt = document.createEvent('HTMLEvents')
+        evt.initEvent('focus', false, true)
+        document.body.dispatchEvent(evt)
+
+        setTimeout(() => {
+          expect(component.instance().isFileDialogActive).toEqual(false)
+          done()
+        }, 300)
+      }, 0)
+    })
   })
 
   describe('nested Dropzone component behavior', () => {