FileUploader: Fix dialog trigger not working on multiple clicks (T1290774) (#30051)

Co-authored-by: Ruslan Farkhutdinov <[email protected]>

Author: r-farkhutdinov

packages/devextreme/js/__internal/ui/m_file_uploader.ts

@@ -62,6 +62,7 @@ const DRAG_EVENT_DELTA = 1;
 const DIALOG_TRIGGER_EVENT_NAMESPACE = 'dxFileUploaderDialogTrigger';
 
 const keyUpEventName = 'keyup';
+const nativeClickEvent = 'click';
 
 const ENTER_KEY = 'enter';
 const SPACE_KEY = 'space';
@@ -871,7 +872,7 @@ class FileUploader extends Editor<Properties> {
 
     const $target = $(target);
 
-    eventsEngine.on($target, addNamespace(clickEventName, DIALOG_TRIGGER_EVENT_NAMESPACE), () => {
+    eventsEngine.on($target, addNamespace(nativeClickEvent, DIALOG_TRIGGER_EVENT_NAMESPACE), () => {
       this._selectFileDialogClickHandler();
     });
     eventsEngine.on($target, addNamespace(keyUpEventName, DIALOG_TRIGGER_EVENT_NAMESPACE), (e: KeyboardEvent) => {
@@ -1033,8 +1034,8 @@ class FileUploader extends Editor<Properties> {
 
   _shouldRaiseDragOver(e, dropZoneElement) {
     return this._activeDropZone === null
-            && this.isMouseOverElement(e, dropZoneElement, false)
-            && e.originalEvent.dataTransfer.types.find((item) => item === 'Files');
+      && this.isMouseOverElement(e, dropZoneElement, false)
+      && e.originalEvent.dataTransfer.types.find((item) => item === 'Files');
   }
 
   _dragOverHandler(isCustomTarget, e) {

packages/devextreme/testing/tests/DevExpress.ui.widgets.editors/fileUploader.tests.js

@@ -4365,8 +4365,8 @@ QUnit.module('readOnly option', moduleConfig, () => {
 });
 
 QUnit.module('integration of dx button components via dialogTrigger', moduleConfig, () => {
-    ['enter', 'space'].forEach(keyName => {
-        ['dxButton', 'dxButtonGroup', 'dxDropDownButton'].forEach(component => {
+    ['dxButton', 'dxButtonGroup', 'dxDropDownButton'].forEach(component => {
+        ['enter', 'space'].forEach(keyName => {
             QUnit.test(`dialog should be shown after press ${keyName} key on ${component} (T1178836, T1256752)`, function(assert) {
                 if(devices.real().deviceType !== 'desktop') {
                     assert.ok(true, 'keyboard is not supported for not generic devices');
@@ -4390,5 +4390,25 @@ QUnit.module('integration of dx button components via dialogTrigger', moduleConf
                 assert.strictEqual(fileUploaderInputClickSpy.calledOnce, true, 'click on input fired once');
             });
         });
+
+        QUnit.test(`dialog should be shown after multiple clicks on ${component} (T1290774)`, function(assert) {
+            const $dialogTrigger = $('<div>')[component]().appendTo('#qunit-fixture');
+
+            $('#fileuploader').dxFileUploader({ dialogTrigger: $dialogTrigger });
+
+            const $fileUploaderInput = $(`.${FILEUPLOADER_INPUT_CLASS}`);
+            const fileUploaderInputClickSpy = sinon.spy();
+
+            $fileUploaderInput.on('click', fileUploaderInputClickSpy);
+
+            $dialogTrigger.trigger('click');
+            assert.strictEqual(fileUploaderInputClickSpy.callCount, 1, 'first click triggers input click');
+
+            $dialogTrigger.trigger('click');
+            assert.strictEqual(fileUploaderInputClickSpy.callCount, 2, 'second click triggers input click');
+
+            $dialogTrigger.trigger('click');
+            assert.strictEqual(fileUploaderInputClickSpy.callCount, 3, 'third click triggers input click');
+        });
     });
 });