diff --git a/src/index.js b/src/index.js index a31f83bd..8360fea8 100755 --- a/src/index.js +++ b/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) diff --git a/src/index.spec.js b/src/index.spec.js index 4acf94ba..fb91b3ad 100644 --- a/src/index.spec.js +++ b/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() + + 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', () => {