Skip to content

Enable getting IJSObjectReference to a JS function in Blazor interop #61453

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Apr 15, 2025
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 4 additions & 0 deletions src/Components/test/E2ETest/Tests/InteropTest.cs
Original file line number Diff line number Diff line change
Expand Up @@ -107,6 +107,8 @@ public void CanInvokeInteropMethods()
["invokeNewWithClassConstructorAsync.dataProperty"] = "abraka",
["invokeNewWithClassConstructorAsync.function"] = "6",
["invokeNewWithNonConstructorAsync"] = "Success",
// Function reference tests
["changeFunctionViaObjectReferenceAsync"] = "42"
};

var expectedSyncValues = new Dictionary<string, string>
Expand Down Expand Up @@ -171,6 +173,8 @@ public void CanInvokeInteropMethods()
["invokeNewWithClassConstructor.dataProperty"] = "abraka",
["invokeNewWithClassConstructor.function"] = "6",
["invokeNewWithNonConstructor"] = "Success",
// Function reference tests
["changeFunctionViaObjectReference"] = "42"
};

// Include the sync assertions only when running under WebAssembly
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -92,6 +92,7 @@
<div style="margin-top: 2em">
<button @onclick="CreateInstanceByConstructorFunction">Call constructor function InvokeNewAsync</button>
<button @onclick="CreateInstanceByClassConstructor">Call class constructor with InvokeNewAsync</button>
<button @onclick="ChangeInstanceMethodWithFunctionReference">Change instance method with function reference</button>
<span>@InstanceMessage</span>
</div>

Expand Down Expand Up @@ -146,13 +147,13 @@

private async Task CreateInstanceByConstructorFunction()
{
var dogRef = await JSRuntime.InvokeNewAsync("Dog", ["Igor"]);
var dogRef = await JSRuntime.InvokeNewAsync("Dog", "A dog");
InstanceMessage = await dogRef.InvokeAsync<string>("bark");
}

private async Task CreateInstanceByClassConstructor()
{
var catRef = await JSRuntime.InvokeNewAsync("Cat", ["Whiskers"]);
var catRef = await JSRuntime.InvokeNewAsync("Cat", "A cat");
InstanceMessage = await catRef.InvokeAsync<string>("meow");
}

Expand All @@ -166,6 +167,15 @@
await JSRuntime.SetValueAsync<int>("testObject.getOnlyProperty", 123);
}

private async Task ChangeInstanceMethodWithFunctionReference()
{
var dogRef = await JSRuntime.InvokeNewAsync("Dog", "A dog");
var dogFuncRef = await dogRef.GetValueAsync<IJSObjectReference>("bark");
var catRef = await JSRuntime.InvokeNewAsync("Cat", "A cat");
await catRef.SetValueAsync("meow", dogFuncRef);
InstanceMessage = await catRef.InvokeAsync<string>("meow");
}

class TestObjectModel
{
public int Num { get; set; }
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -301,6 +301,13 @@
InvokeNewTests();
}

await FunctionReferenceAsyncTests();

if (shouldSupportSyncInterop)
{
FunctionReferenceTests();
}

Invocations = invocations;
DoneWithInterop = true;
}
Expand Down Expand Up @@ -601,6 +608,24 @@
}
}

private async Task FunctionReferenceAsyncTests()
{
var funcRef = await JSRuntime.GetValueAsync<IJSObjectReference>("jsInteropTests.nonConstructorFunction");
var testClassRef = await JSRuntime.InvokeNewAsync("jsInteropTests.TestClass", "abraka");
await testClassRef.SetValueAsync("getTextLength", funcRef);
ReturnValues["changeFunctionViaObjectReferenceAsync"] = (await testClassRef.InvokeAsync<int>("getTextLength")).ToString();
}

private void FunctionReferenceTests()
{
var inProcRuntime = ((IJSInProcessRuntime)JSRuntime);

var funcRef = inProcRuntime.GetValue<IJSObjectReference>("jsInteropTests.nonConstructorFunction");
var testClassRef = inProcRuntime.InvokeNew("jsInteropTests.TestClass", "abraka");
testClassRef.SetValue("getTextLength", funcRef);
ReturnValues["changeFunctionViaObjectReference"] = testClassRef.Invoke<int>("getTextLength").ToString();
}

public class PassDotNetObjectByRefArgs
{
public string StringValue { get; set; }
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -155,7 +155,7 @@ export module DotNet {
* @throws Error if the given value is not an Object.
*/
export function createJSObjectReference(jsObject: any): any {
if (jsObject && typeof jsObject === "object") {
if (jsObject && (typeof jsObject === "object" || jsObject instanceof Function)) {
cachedJSObjectsById[nextJsObjectId] = new JSObject(jsObject);

const result = {
Expand Down
Loading