Custom event args: support receiving IJSObjectReference (#31591)

SteveSandersonMS · web-flow · commit 65051aa02321 · 2021-04-09T00:30:14.000+01:00
* Add failing E2E case

* Implement fix

* Add E2E test

* Update src/Components/test/testassets/BasicTestApp/EventCustomArgsComponent.razor

* Update suppressions
diff --git a/src/Components/Server/src/Circuits/CircuitHost.cs b/src/Components/Server/src/Circuits/CircuitHost.cs
@@ -404,7 +404,8 @@ public async Task DispatchEvent(string eventDescriptorJson, string eventArgsJson
             WebEventData webEventData;
             try
             {
-                webEventData = WebEventData.Parse(Renderer, eventDescriptorJson, eventArgsJson);
+                var jsonSerializerOptions = JSRuntime.ReadJsonSerializerOptions();
+                webEventData = WebEventData.Parse(Renderer, jsonSerializerOptions, eventDescriptorJson, eventArgsJson);
             }
             catch (Exception ex)
             {
diff --git a/src/Components/Server/src/Circuits/RemoteJSRuntime.cs b/src/Components/Server/src/Circuits/RemoteJSRuntime.cs
@@ -30,6 +30,8 @@ public RemoteJSRuntime(IOptions<CircuitOptions> options, ILogger<RemoteJSRuntime
             JsonSerializerOptions.Converters.Add(new ElementReferenceJsonConverter(ElementReferenceContext));
         }
 
+        public JsonSerializerOptions ReadJsonSerializerOptions() => JsonSerializerOptions;
+
         internal void Initialize(CircuitClientProxy clientProxy)
         {
             _clientProxy = clientProxy ?? throw new ArgumentNullException(nameof(clientProxy));
diff --git a/src/Components/Shared/src/WebEventData.cs b/src/Components/Shared/src/WebEventData.cs
@@ -15,7 +15,7 @@ internal class WebEventData
     {
         // This class represents the second half of parsing incoming event data,
         // once the event ID (and possibly the type of the eventArgs) becomes known.
-        public static WebEventData Parse(Renderer renderer, string eventDescriptorJson, string eventArgsJson)
+        public static WebEventData Parse(Renderer renderer, JsonSerializerOptions jsonSerializerOptions, string eventDescriptorJson, string eventArgsJson)
         {
             WebEventDescriptor eventDescriptor;
             try
@@ -29,13 +29,14 @@ public static WebEventData Parse(Renderer renderer, string eventDescriptorJson,
 
             return Parse(
                 renderer,
+                jsonSerializerOptions,
                 eventDescriptor,
                 eventArgsJson);
         }
 
-        public static WebEventData Parse(Renderer renderer, WebEventDescriptor eventDescriptor, string eventArgsJson)
+        public static WebEventData Parse(Renderer renderer, JsonSerializerOptions jsonSerializerOptions, WebEventDescriptor eventDescriptor, string eventArgsJson)
         {
-            var parsedEventArgs = ParseEventArgsJson(renderer, eventDescriptor.EventHandlerId, eventDescriptor.EventName, eventArgsJson);
+            var parsedEventArgs = ParseEventArgsJson(renderer, jsonSerializerOptions, eventDescriptor.EventHandlerId, eventDescriptor.EventName, eventArgsJson);
             return new WebEventData(
                 eventDescriptor.BrowserRendererId,
                 eventDescriptor.EventHandlerId,
@@ -59,7 +60,7 @@ private WebEventData(int browserRendererId, ulong eventHandlerId, EventFieldInfo
 
         public EventArgs EventArgs { get; }
 
-        private static EventArgs ParseEventArgsJson(Renderer renderer, ulong eventHandlerId, string eventName, string eventArgsJson)
+        private static EventArgs ParseEventArgsJson(Renderer renderer, JsonSerializerOptions jsonSerializerOptions, ulong eventHandlerId, string eventName, string eventArgsJson)
         {
             try
             {
@@ -70,7 +71,7 @@ private static EventArgs ParseEventArgsJson(Renderer renderer, ulong eventHandle
 
                 // For custom events, the args type is determined from the associated delegate
                 var eventArgsType = renderer.GetEventArgsType(eventHandlerId);
-                return (EventArgs)JsonSerializer.Deserialize(eventArgsJson, eventArgsType, JsonSerializerOptionsProvider.Options)!;
+                return (EventArgs)JsonSerializer.Deserialize(eventArgsJson, eventArgsType, jsonSerializerOptions)!;
             }
             catch (Exception e)
             {
diff --git a/src/Components/WebAssembly/WebAssembly/src/Infrastructure/JSInteropMethods.cs b/src/Components/WebAssembly/WebAssembly/src/Infrastructure/JSInteropMethods.cs
@@ -38,7 +38,8 @@ public static void NotifyLocationChanged(string uri, bool isInterceptedLink)
         public static Task DispatchEvent(WebEventDescriptor eventDescriptor, string eventArgsJson)
         {
             var renderer = RendererRegistry.Find(eventDescriptor.BrowserRendererId);
-            var webEvent = WebEventData.Parse(renderer, eventDescriptor, eventArgsJson);
+            var jsonSerializerOptions = DefaultWebAssemblyJSRuntime.Instance.ReadJsonSerializerOptions();
+            var webEvent = WebEventData.Parse(renderer, jsonSerializerOptions, eventDescriptor, eventArgsJson);
             return renderer.DispatchEventAsync(
                 webEvent.EventHandlerId,
                 webEvent.EventFieldInfo,
diff --git a/src/Components/WebAssembly/WebAssembly/src/Microsoft.AspNetCore.Components.WebAssembly.WarningSuppressions.xml b/src/Components/WebAssembly/WebAssembly/src/Microsoft.AspNetCore.Components.WebAssembly.WarningSuppressions.xml
@@ -35,7 +35,7 @@
       <argument>ILLink</argument>
       <argument>IL2072</argument>
       <property name="Scope">member</property>
-      <property name="Target">M:Microsoft.AspNetCore.Components.Web.WebEventData.ParseEventArgsJson(Microsoft.AspNetCore.Components.RenderTree.Renderer,System.UInt64,System.String,System.String)</property>
+      <property name="Target">M:Microsoft.AspNetCore.Components.Web.WebEventData.ParseEventArgsJson(Microsoft.AspNetCore.Components.RenderTree.Renderer,System.Text.Json.JsonSerializerOptions,System.UInt64,System.String,System.String)</property>
     </attribute>
     <attribute fullname="System.Diagnostics.CodeAnalysis.UnconditionalSuppressMessageAttribute">
       <argument>ILLink</argument>
diff --git a/src/Components/WebAssembly/WebAssembly/src/Services/DefaultWebAssemblyJSRuntime.cs b/src/Components/WebAssembly/WebAssembly/src/Services/DefaultWebAssemblyJSRuntime.cs
@@ -3,6 +3,7 @@
 
 using System.Diagnostics.CodeAnalysis;
 using System.Globalization;
+using System.Text.Json;
 using Microsoft.JSInterop.Infrastructure;
 using Microsoft.JSInterop.WebAssembly;
 
@@ -23,6 +24,8 @@ private DefaultWebAssemblyJSRuntime()
             JsonSerializerOptions.Converters.Add(new ElementReferenceJsonConverter(ElementReferenceContext));
         }
 
+        public JsonSerializerOptions ReadJsonSerializerOptions() => JsonSerializerOptions;
+
         // The following methods are invoke via Mono's JS interop mechanism (invoke_method)
         public static string? InvokeDotNet(string assemblyName, string methodIdentifier, string dotNetObjectId, string argsJson)
         {
diff --git a/src/Components/WebView/WebView/src/IpcReceiver.cs b/src/Components/WebView/WebView/src/IpcReceiver.cs
@@ -88,7 +88,8 @@ private void EndInvokeJS(PageContext pageContext, long asyncHandle, bool succeed
         private Task DispatchBrowserEventAsync(PageContext pageContext, string eventDescriptor, string eventArgs)
         {
             var renderer = pageContext.Renderer;
-            var webEventData = WebEventData.Parse(renderer, eventDescriptor, eventArgs);
+            var jsonSerializerOptions = pageContext.JSRuntime.ReadJsonSerializerOptions();
+            var webEventData = WebEventData.Parse(renderer, jsonSerializerOptions, eventDescriptor, eventArgs);
             return renderer.DispatchEventAsync(
                 webEventData.EventHandlerId,
                 webEventData.EventFieldInfo,
diff --git a/src/Components/WebView/WebView/src/Services/WebViewJSRuntime.cs b/src/Components/WebView/WebView/src/Services/WebViewJSRuntime.cs
@@ -23,6 +23,8 @@ public void AttachToWebView(IpcSender ipcSender)
             _ipcSender = ipcSender;
         }
 
+        public JsonSerializerOptions ReadJsonSerializerOptions() => JsonSerializerOptions;
+
         protected override void BeginInvokeJS(long taskId, string identifier, string argsJson, JSCallResultType resultType, long targetInstanceId)
         {
             _ipcSender.BeginInvokeJS(taskId, identifier, argsJson, resultType, targetInstanceId);
diff --git a/src/Components/test/E2ETest/Tests/EventCustomArgsTest.cs b/src/Components/test/E2ETest/Tests/EventCustomArgsTest.cs
@@ -162,6 +162,14 @@ public void CanAliasBrowserEvent_WithoutAnyNativeListenerForBrowserEvent()
             Browser.True(() => GetLogLines().Contains("Received custom mouseover event"));
         }
 
+        [Fact]
+        public void CanRegisterCustomEventAndSupplyIJSObjectReference()
+        {
+            Browser.Exists(By.Id("register-sendjsobject")).Click();
+            Browser.FindElement(By.Id("trigger-sendjsobject-event-directly")).Click();
+            Browser.Equal("Event with IJSObjectReference received: Hello!", () => GetLogLines().Single());
+        }
+
         void SendKeysSequentially(IWebElement target, string text)
         {
             foreach (var c in text)
diff --git a/src/Components/test/testassets/BasicTestApp/EventCustomArgsComponent.razor b/src/Components/test/testassets/BasicTestApp/EventCustomArgsComponent.razor
@@ -9,7 +9,8 @@
      @ontestevent="@HandleTestEvent"
      @onkeydown.testvariant="@HandleCustomKeyDown"
      @onkeydown.yetanother="@HandleYetAnotherKeyboardEvent"
-     @oncustommouseover="@(e => { LogMessage("Received custom mouseover event"); })">
+     @oncustommouseover="@(e => { LogMessage("Received custom mouseover event"); })"
+     @onsendjsobject="HandleEventWithIJSObjectReference">
     Event target
     <div id="test-event-target-child" style="background: #afa; padding: 1em;">
         Child
@@ -55,6 +56,17 @@
     Register custom mouseover event (which has no corresponding native listener)
 </button>
 
+<button id="register-sendjsobject"
+        onclick="Blazor.registerCustomEventType('sendjsobject', { createEventArgs: event => event.detail })">
+    Register custom event that sends IJSObjectReference
+</button>
+
+<button id="trigger-sendjsobject-event-directly"
+        onclick="document.getElementById('test-event-target-child').dispatchEvent(new CustomEvent('sendjsobject', { bubbles: true, detail: { jsObject: DotNet.createJSObjectReference({ getMyValue: () => 'Hello!' }) } }))">
+    Trigger sendjsobject event directly
+</button>
+
+
 <p>
     <label>
         <input type="checkbox" id="custom-keydown-prevent-default" @bind="customKeyDownPreventDefault" />
@@ -99,4 +111,10 @@
     {
         LogMessage($"Yet another aliased event received: {eventArgs.YouPressed}");
     }
+
+    async Task HandleEventWithIJSObjectReference(EventWithIJSObjectReferenceEventArgs eventArgs)
+    {
+        var innerValue = await eventArgs.JsObject.InvokeAsync<string>("getMyValue", null);
+        LogMessage($"Event with IJSObjectReference received: {innerValue}");
+    }
 }
diff --git a/src/Components/test/testassets/BasicTestApp/EventCustomArgsTypes.cs b/src/Components/test/testassets/BasicTestApp/EventCustomArgsTypes.cs
@@ -1,12 +1,14 @@
 using System;
 using Microsoft.AspNetCore.Components;
+using Microsoft.JSInterop;
 
 namespace BasicTestApp.CustomEventTypesNamespace
 {
     [EventHandler("ontestevent", typeof(TestEventArgs), true, true)]
     [EventHandler("onkeydown.testvariant", typeof(TestKeyDownEventArgs), true, true)]
     [EventHandler("onkeydown.yetanother", typeof(YetAnotherCustomKeyboardEventArgs), true, true)]
     [EventHandler("oncustommouseover", typeof(EventArgs), true, true)]
+    [EventHandler("onsendjsobject", typeof(EventWithIJSObjectReferenceEventArgs), true, true)]
     public static class EventHandlers
     {
     }
@@ -25,4 +27,9 @@ class YetAnotherCustomKeyboardEventArgs : EventArgs
     {
         public string YouPressed { get; set; }
     }
+
+    class EventWithIJSObjectReferenceEventArgs : EventArgs
+    {
+        public IJSObjectReference JsObject { get; set; }
+    }
 }

Original file line number	Diff line number	Diff line change
`@@ -404,7 +404,8 @@ public async Task DispatchEvent(string eventDescriptorJson, string eventArgsJson`
`404`	`404`	`WebEventData webEventData;`
`405`	`405`	`try`
`406`	`406`	`{`
`407`		`- webEventData = WebEventData.Parse(Renderer, eventDescriptorJson, eventArgsJson);`
	`407`	`+ var jsonSerializerOptions = JSRuntime.ReadJsonSerializerOptions();`
	`408`	`+ webEventData = WebEventData.Parse(Renderer, jsonSerializerOptions, eventDescriptorJson, eventArgsJson);`
`408`	`409`	`}`
`409`	`410`	`catch (Exception ex)`
`410`	`411`	`{`
Original file line number	Diff line number	Diff line change
`@@ -30,6 +30,8 @@ public RemoteJSRuntime(IOptions<CircuitOptions> options, ILogger<RemoteJSRuntime`
`30`	`30`	`JsonSerializerOptions.Converters.Add(new ElementReferenceJsonConverter(ElementReferenceContext));`
`31`	`31`	`}`
`32`	`32`
	`33`	`+ public JsonSerializerOptions ReadJsonSerializerOptions() => JsonSerializerOptions;`
	`34`	`+`
`33`	`35`	`internal void Initialize(CircuitClientProxy clientProxy)`
`34`	`36`	`{`
`35`	`37`	`_clientProxy = clientProxy ?? throw new ArgumentNullException(nameof(clientProxy));`
Original file line number	Diff line number	Diff line change
`@@ -15,7 +15,7 @@ internal class WebEventData`
`15`	`15`	`{`
`16`	`16`	`// This class represents the second half of parsing incoming event data,`
`17`	`17`	`// once the event ID (and possibly the type of the eventArgs) becomes known.`
`18`		`- public static WebEventData Parse(Renderer renderer, string eventDescriptorJson, string eventArgsJson)`
	`18`	`+ public static WebEventData Parse(Renderer renderer, JsonSerializerOptions jsonSerializerOptions, string eventDescriptorJson, string eventArgsJson)`
`19`	`19`	`{`
`20`	`20`	`WebEventDescriptor eventDescriptor;`
`21`	`21`	`try`
`@@ -29,13 +29,14 @@ public static WebEventData Parse(Renderer renderer, string eventDescriptorJson,`
`29`	`29`
`30`	`30`	`return Parse(`
`31`	`31`	`renderer,`
	`32`	`+ jsonSerializerOptions,`
`32`	`33`	`eventDescriptor,`
`33`	`34`	`eventArgsJson);`
`34`	`35`	`}`
`35`	`36`
`36`		`- public static WebEventData Parse(Renderer renderer, WebEventDescriptor eventDescriptor, string eventArgsJson)`
	`37`	`+ public static WebEventData Parse(Renderer renderer, JsonSerializerOptions jsonSerializerOptions, WebEventDescriptor eventDescriptor, string eventArgsJson)`
`37`	`38`	`{`
`38`		`- var parsedEventArgs = ParseEventArgsJson(renderer, eventDescriptor.EventHandlerId, eventDescriptor.EventName, eventArgsJson);`
	`39`	`+ var parsedEventArgs = ParseEventArgsJson(renderer, jsonSerializerOptions, eventDescriptor.EventHandlerId, eventDescriptor.EventName, eventArgsJson);`
`39`	`40`	`return new WebEventData(`
`40`	`41`	`eventDescriptor.BrowserRendererId,`
`41`	`42`	`eventDescriptor.EventHandlerId,`
`@@ -59,7 +60,7 @@ private WebEventData(int browserRendererId, ulong eventHandlerId, EventFieldInfo`
`59`	`60`
`60`	`61`	`public EventArgs EventArgs { get; }`
`61`	`62`
`62`		`- private static EventArgs ParseEventArgsJson(Renderer renderer, ulong eventHandlerId, string eventName, string eventArgsJson)`
	`63`	`+ private static EventArgs ParseEventArgsJson(Renderer renderer, JsonSerializerOptions jsonSerializerOptions, ulong eventHandlerId, string eventName, string eventArgsJson)`
`63`	`64`	`{`
`64`	`65`	`try`
`65`	`66`	`{`
`@@ -70,7 +71,7 @@ private static EventArgs ParseEventArgsJson(Renderer renderer, ulong eventHandle`
`70`	`71`
`71`	`72`	`// For custom events, the args type is determined from the associated delegate`
`72`	`73`	`var eventArgsType = renderer.GetEventArgsType(eventHandlerId);`
`73`		`- return (EventArgs)JsonSerializer.Deserialize(eventArgsJson, eventArgsType, JsonSerializerOptionsProvider.Options)!;`
	`74`	`+ return (EventArgs)JsonSerializer.Deserialize(eventArgsJson, eventArgsType, jsonSerializerOptions)!;`
`74`	`75`	`}`
`75`	`76`	`catch (Exception e)`
`76`	`77`	`{`
Original file line number	Diff line number	Diff line change
`@@ -3,6 +3,7 @@`
`3`	`3`
`4`	`4`	`using System.Diagnostics.CodeAnalysis;`
`5`	`5`	`using System.Globalization;`
	`6`	`+using System.Text.Json;`
`6`	`7`	`using Microsoft.JSInterop.Infrastructure;`
`7`	`8`	`using Microsoft.JSInterop.WebAssembly;`
`8`	`9`
`@@ -23,6 +24,8 @@ private DefaultWebAssemblyJSRuntime()`
`23`	`24`	`JsonSerializerOptions.Converters.Add(new ElementReferenceJsonConverter(ElementReferenceContext));`
`24`	`25`	`}`
`25`	`26`
	`27`	`+ public JsonSerializerOptions ReadJsonSerializerOptions() => JsonSerializerOptions;`
	`28`	`+`
`26`	`29`	`// The following methods are invoke via Mono's JS interop mechanism (invoke_method)`
`27`	`30`	`public static string? InvokeDotNet(string assemblyName, string methodIdentifier, string dotNetObjectId, string argsJson)`
`28`	`31`	`{`
Original file line number	Diff line number	Diff line change
`@@ -23,6 +23,8 @@ public void AttachToWebView(IpcSender ipcSender)`
`23`	`23`	`_ipcSender = ipcSender;`
`24`	`24`	`}`
`25`	`25`
	`26`	`+ public JsonSerializerOptions ReadJsonSerializerOptions() => JsonSerializerOptions;`
	`27`	`+`
`26`	`28`	`protected override void BeginInvokeJS(long taskId, string identifier, string argsJson, JSCallResultType resultType, long targetInstanceId)`
`27`	`29`	`{`
`28`	`30`	`_ipcSender.BeginInvokeJS(taskId, identifier, argsJson, resultType, targetInstanceId);`
Original file line number	Diff line number	Diff line change
`@@ -162,6 +162,14 @@ public void CanAliasBrowserEvent_WithoutAnyNativeListenerForBrowserEvent()`
`162`	`162`	`Browser.True(() => GetLogLines().Contains("Received custom mouseover event"));`
`163`	`163`	`}`
`164`	`164`
	`165`	`+ [Fact]`
	`166`	`+ public void CanRegisterCustomEventAndSupplyIJSObjectReference()`
	`167`	`+ {`
	`168`	`+ Browser.Exists(By.Id("register-sendjsobject")).Click();`
	`169`	`+ Browser.FindElement(By.Id("trigger-sendjsobject-event-directly")).Click();`
	`170`	`+ Browser.Equal("Event with IJSObjectReference received: Hello!", () => GetLogLines().Single());`
	`171`	`+ }`
	`172`	`+`
`165`	`173`	`void SendKeysSequentially(IWebElement target, string text)`
`166`	`174`	`{`
`167`	`175`	`foreach (var c in text)`
Original file line number	Diff line number	Diff line change
`@@ -1,12 +1,14 @@`
`1`	`1`	`using System;`
`2`	`2`	`using Microsoft.AspNetCore.Components;`
	`3`	`+using Microsoft.JSInterop;`
`3`	`4`
`4`	`5`	`namespace BasicTestApp.CustomEventTypesNamespace`
`5`	`6`	`{`
`6`	`7`	`[EventHandler("ontestevent", typeof(TestEventArgs), true, true)]`
`7`	`8`	`[EventHandler("onkeydown.testvariant", typeof(TestKeyDownEventArgs), true, true)]`
`8`	`9`	`[EventHandler("onkeydown.yetanother", typeof(YetAnotherCustomKeyboardEventArgs), true, true)]`
`9`	`10`	`[EventHandler("oncustommouseover", typeof(EventArgs), true, true)]`
	`11`	`+ [EventHandler("onsendjsobject", typeof(EventWithIJSObjectReferenceEventArgs), true, true)]`
`10`	`12`	`public static class EventHandlers`
`11`	`13`	`{`
`12`	`14`	`}`
`@@ -25,4 +27,9 @@ class YetAnotherCustomKeyboardEventArgs : EventArgs`
`25`	`27`	`{`
`26`	`28`	`public string YouPressed { get; set; }`
`27`	`29`	`}`
	`30`	`+`
	`31`	`+ class EventWithIJSObjectReferenceEventArgs : EventArgs`
	`32`	`+ {`
	`33`	`+ public IJSObjectReference JsObject { get; set; }`
	`34`	`+ }`
`28`	`35`	`}`