🐛 fix(FileInput): failed to click and select files (#2015)

src/Masa.Blazor.JS/src/interop.ts

@@ -98,9 +98,11 @@ export function getParentClientWidthOrWindowInnerWidth(element: HTMLElement) {
   return element.parentElement ? element.parentElement.clientWidth : window.innerWidth;
 }
 
-export function triggerEvent(elOrString, eventType, stopPropagation) {
+export function triggerEvent(elOrString, eventName: string, eventType: string, stopPropagation: boolean) {
   var dom = getDom(elOrString);
-  var evt = new Event(eventType);
+  var evt = document.createEvent(eventName);
+  evt.initEvent(eventType);
+
   if (stopPropagation) {
     evt.stopPropagation();
   }

src/Masa.Blazor/Components/FileInput/MFileInput.razor.cs

@@ -198,7 +198,7 @@ public override async Task HandleOnPrependClickAsync(MouseEventArgs args)
         if (InputFile?.Element is null) return;
 
         await base.HandleOnPrependClickAsync(args);
-        await Js.DispatchEventAsync(InputFile.Element.Value, "click", true);
+        await Js.DispatchEventAsync(InputFile.Element.Value, "MouseEvent", "click", true);
     }
 
     public override Task HandleOnInputAsync(ChangeEventArgs args) => Task.CompletedTask;
@@ -246,19 +246,14 @@ public async Task HandleOnFileChange(InputFileChangeEventArgs args)
 
     public override async Task HandleOnClickAsync(ExMouseEventArgs args)
     {
-        if (IsFocused || IsDisabled)
-        {
-            return;
-        }
-
         if (OnClick.HasDelegate)
         {
             await OnClick.InvokeAsync();
         }
 
         if (InputFile?.Element is null) return;
 
-        await Js.DispatchEventAsync(InputFile.Element.Value, "click", true);
+        await Js.DispatchEventAsync(InputFile.Element.Value, "MouseEvent", "click", true);
     }
 
     public override async Task HandleOnClearClickAsync(MouseEventArgs args)

src/Masa.Blazor/Components/Input/MInput.razor

@@ -34,7 +34,7 @@
         }
         else if (!string.IsNullOrWhiteSpace(PrependIcon))
         {
-            content = GenIcon(InputIconType.PrependOuter, PrependIcon, OnPrependClick.HasDelegate ? HandleOnPrependClickAsync : null);
+            content = GenIcon(InputIconType.PrependOuter, PrependIcon, HasPrependClick ? HandleOnPrependClickAsync : null);
         }
 
         if (content != null)

src/Masa.Blazor/Components/Input/MInput.razor.cs

@@ -144,8 +144,6 @@ public virtual List<string> MessagesToDisplay
 
     public virtual bool HasPrependClick => OnPrependClick.HasDelegate;
 
-    public virtual bool HasAppendClick => OnAppendClick.HasDelegate;
-
     public virtual async Task HandleOnPrependClickAsync(MouseEventArgs args)
     {
         if (OnPrependClick.HasDelegate)

src/Masa.Blazor/Components/TextField/MTextField.razor.cs

@@ -530,11 +530,6 @@ public override async Task HandleOnClickAsync(ExMouseEventArgs args)
             return;
         }
 
-        if (OnClick.HasDelegate)
-        {
-            await OnClick.InvokeAsync(args);
-        }
-
         await InputElement.FocusAsync();
     }
 

src/Masa.Blazor/Extensions/JsRuntimeExtensions.cs

@@ -154,10 +154,19 @@ public static ValueTask<BoundingClientRect> GetBoundingClientRectAsync(this IJSR
             attach);
     }
 
-    public static ValueTask DispatchEventAsync(this IJSRuntime jsRuntime, ElementReference el, string type,
+    /// <summary>
+    /// Dispatch an event on the element
+    /// </summary>
+    /// <param name="jsRuntime"></param>
+    /// <param name="el"></param>
+    /// <param name="eventName">The name of the event, e.g. MouseEvent, KeyboardEvent, etc.</param>
+    /// <param name="eventType">The type of the event, e.g. click, keydown, etc.</param>
+    /// <param name="stopPropagation">Whether to stop propagation</param>
+    /// <returns></returns>
+    public static ValueTask DispatchEventAsync(this IJSRuntime jsRuntime, ElementReference el, string eventName, string eventType,
         bool stopPropagation)
     {
-        return jsRuntime.InvokeVoidAsync(JsInteropConstants.TriggerEvent, el, type, stopPropagation);
+        return jsRuntime.InvokeVoidAsync(JsInteropConstants.TriggerEvent, el, eventName, eventType, stopPropagation);
     }
 
     public static ValueTask SetPropertyAsync(this IJSRuntime jsRuntime, ElementReference el, string key, object value)