diff --git a/src/Components/test/E2ETest/Tests/InteropTest.cs b/src/Components/test/E2ETest/Tests/InteropTest.cs
index 07d54f0fa3d8..9293fdda9b9c 100644
--- a/src/Components/test/E2ETest/Tests/InteropTest.cs
+++ b/src/Components/test/E2ETest/Tests/InteropTest.cs
@@ -78,6 +78,7 @@ public void CanInvokeInteropMethods()
["testDtoAsync"] = "Same",
["returnPrimitiveAsync"] = "123",
["returnArrayAsync"] = "first,second",
+ ["elementReference"] = "Success",
["jsObjectReference.identity"] = "Invoked from JSObjectReference",
["jsObjectReference.nested.add"] = "5",
["addViaJSObjectReference"] = "5",
diff --git a/src/Components/test/testassets/BasicTestApp/InteropComponent.razor b/src/Components/test/testassets/BasicTestApp/InteropComponent.razor
index 3cafad7b577b..aa57fdc10db9 100644
--- a/src/Components/test/testassets/BasicTestApp/InteropComponent.razor
+++ b/src/Components/test/testassets/BasicTestApp/InteropComponent.razor
@@ -51,6 +51,9 @@
@nameof(JSObjectReferenceInvokeNonFunctionException)
@JSObjectReferenceInvokeNonFunctionException?.Message
+
+Element reference.
+
@if (DoneWithInterop)
{
Done with interop.
@@ -70,6 +73,8 @@
public bool DoneWithInterop { get; set; }
+ public ElementReference element;
+
public async Task InvokeInteropAsync()
{
var shouldSupportSyncInterop = RuntimeInformation.IsOSPlatform(OSPlatform.Create("BROWSER"));
@@ -167,6 +172,15 @@
ReturnValues["invokeAsyncThrowsSerializingCircularStructure"] = $"Failure: {ex.Message}";
}
+ try
+ {
+ var elementReference = await JSRuntime.InvokeAsync("returnElementReference", element);
+ ReturnValues["elementReference"] = "Success";
+ }
+ catch (Exception ex)
+ {
+ ReturnValues["elementReference"] = $"Failure: {ex.Message}";
+ }
var jsObjectReference = await JSRuntime.InvokeAsync("returnJSObjectReference");
ReturnValues["jsObjectReference.identity"] = await jsObjectReference.InvokeAsync("identity", "Invoked from JSObjectReference");
diff --git a/src/Components/test/testassets/BasicTestApp/wwwroot/js/jsinteroptests.js b/src/Components/test/testassets/BasicTestApp/wwwroot/js/jsinteroptests.js
index 3faee4235ecb..de82a2beb758 100644
--- a/src/Components/test/testassets/BasicTestApp/wwwroot/js/jsinteroptests.js
+++ b/src/Components/test/testassets/BasicTestApp/wwwroot/js/jsinteroptests.js
@@ -254,6 +254,7 @@ window.jsInteropTests = {
receiveDotNetObjectByRefAsync: receiveDotNetObjectByRefAsync,
receiveDotNetStreamReference: receiveDotNetStreamReference,
receiveDotNetStreamWrapperReference: receiveDotNetStreamWrapperReference,
+ returnElementReference: returnElementReference,
TestClass: TestClass,
nonConstructorFunction: () => { return 42; },
testObject: testObject,
@@ -373,6 +374,10 @@ function returnJSObjectReference() {
};
}
+function returnElementReference(element) {
+ return element;
+}
+
function addViaJSObjectReference(jsObjectReference, a, b) {
return jsObjectReference.nested.add(a, b);
}
diff --git a/src/JSInterop/Microsoft.JSInterop.JS/src/src/Microsoft.JSInterop.ts b/src/JSInterop/Microsoft.JSInterop.JS/src/src/Microsoft.JSInterop.ts
index 8c0a3d9c6999..f6ad200105a1 100644
--- a/src/JSInterop/Microsoft.JSInterop.JS/src/src/Microsoft.JSInterop.ts
+++ b/src/JSInterop/Microsoft.JSInterop.JS/src/src/Microsoft.JSInterop.ts
@@ -9,6 +9,7 @@ export module DotNet {
const jsObjectIdKey = "__jsObjectId";
const dotNetObjectRefKey = "__dotNetObject";
+ const dotNetElementRefKey = "__internalId";
const byteArrayRefKey = "__byte[]";
const dotNetStreamRefKey = "__dotNetStream";
const jsStreamReferenceLengthKey = "__jsStreamReferenceLength";
@@ -807,7 +808,20 @@ export module DotNet {
return result;
}
+ function getCaptureIdFromElement(element: Element): string | null {
+ for (let i = 0; i < element.attributes.length; i++) {
+ const attr = element.attributes[i];
+ if (attr.name.startsWith('_bl_')) {
+ return attr.name.substring(4);
+ }
+ }
+ return null;
+}
+
function argReplacer(key: string, value: any) {
+ if (value instanceof Element) {
+ return { [dotNetElementRefKey]: getCaptureIdFromElement(value) };
+ }
if (value instanceof DotNetObject) {
return value.serializeAsArg();
} else if (value instanceof Uint8Array) {