IJSObject and GeneratedJSObject

[SerratedSharp]

Hello,

IJSObject has this comment:
DO NOT USE - This is not intended to be implemented manually, but generated using the [GeneratedJSObject].

However when I search source I don't see anything called GeneratedJSObject.

1. I'm wondering why RenderingLoopAnimator is the only type I see across Uno repos that directly implements IJSObject. I'm guessing that is a special case, and based on the "don't use this" IJSObject comment that there's a different more common way that Uno uses when it wants a type to have corresponding JS/C# types. I assume [GeneratedJSObject] or some more recently renamed attribute is the more commonly used way to do this?

2. I see WebAssemblyRuntime.InvokeJS checks a _trace.IsEnabled field? Where do I access that to set to true, and where is the trace written? I'm guessing JS browser console?

Edit: After working through a few issues, this is the code I have currently. The calls from C# to javascript are working. I was having trouble getting the ManagedEcho method to generate from the C# object for managed calls from JS to C#, which I'd expect to generate from JSObjectMetadataProvider.ReflectionMetadata.BuildPrototype as a result of me calling JSObjectHandle.Create(this). The Find and Hide methods did generate.

I ran this code to verify the ManagedEcho method met the criteria that the metadata generator uses, and it was listed in this output:

var methods = typeof(JQueryBox)
  .GetMethods(BindingFlags.Instance | BindingFlags.Public)
  .Where(method => !method.GetParameters().Any(p => p.ParameterType != typeof(string))) // we support only string parameters for now
  .ToList();
Console.WriteLine(string.Join(", ", methods.Select(m => m.Name)));

Code changes were definitely being reflected when I built the WASM package, but the JS proxy/prototype generated from JSObjectMetadataProvider.ReflectionMetadata.BuildPrototype didn't seem to reflect changes. I tried different things, completely closing the browser, Ctrl+F5 hard refresh, explicitly rebuilding the project, deleting all prior WASM packages. After those things didn't work, I kind of gave up and started adding other methods and eventually ManagedEcho appeared on the JS object. I see that there is some caching going on where it does ._getByReflection.AsMemoized instead of regenerating the proxy.

3. Where does this cache live and how is it invalidated to force it to refresh? I'm wondering if there's something I don't understand about the lifetime of the WASM package and how it holds static state that might explain why I had such a hard time getting the prototype to regenerate.

When I finally got the methods to generate, attempting to call them gave "Uno is not defined" error on the JS->C# call for Uno.Foundation.Interop.ManagedObject.dispatch(this.__managedHandle, "ManagedEcho");

I copied ManagedObject.ts from Uno.UI (I'm only useing .Boostrap), commented out private static assembly: UI.Interop.IMonoAssemblyHandle; and added the definition for Module from emscripten. Then the managed calls succeeded.

4. This seems like it should be defined as part of Wasm.Bootstrap since it's leveraged from JSObjectMetadataProvider and isn't really UI specific?

JQueryBox.cs

using System;
using System.Collections.Generic;
using System.Reflection;
using System.Runtime.CompilerServices;
using Uno.Extensions;
using Uno.Foundation;
using Uno.Foundation.Interop;
using static System.Console;

namespace WasmGenerator
{

internal class JQueryBox : IJSObject
{       

	private JQueryBox()
	{
		Handle = JSObjectHandle.Create(this);
	}
	
	public JSObjectHandle Handle { get; }


	public void ManagedEcho()
	{
		Console.WriteLine("Blah blah blah");
	}

	// static because not called on an existing JQuery object instance
	public static JQueryBox Select(string selector)
	{
		var box = new JQueryBox();
		
		long currentJsHandle = _jsHandle(box.Handle);
		// Call $(selector) and add the return to JS JQueryBox.jqObj
		WebAssemblyRuntime.InvokeJS($@"
		(function() {{
			var current = WasmGenerator.JQueryBox.getInstance(0,{currentJsHandle});
			current.jqObj = $('{selector}') ;
			return 'OK';
		}})();"
		);

		return box;
	}
	
	// non-static instance method called on this current instance
	public void Hide() => WebAssemblyRuntime.InvokeJSWithInterop($"{this}.jqObj.hide();");

	public JQueryBox Find(string selector)
	{
		long currentJsHandle = _jsHandle(Handle);
		var newBox = new JQueryBox();
		
		var newJsHandle = _jsHandle(newBox.Handle);
		// Call Find on the current instance, and add the new instance returned from find()
		WebAssemblyRuntime.InvokeJS($@"
			(function() {{
				var current = WasmGenerator.{GetType().Name}.getInstance(0,{currentJsHandle});
				var newObj = WasmGenerator.{GetType().Name}.getInstance(0,{newJsHandle});
				newObj.jqObj = current.jqObj.find('{selector}');
				return 'OK';
			}})();"
		);

		return newBox;
	}

	// Get jsHandle ID via reflection
	static long _jsHandle(JSObjectHandle jsHandle)
	{
		return GetPrivate<long>(jsHandle);
	}

	static IntPtr _managedHandle(JSObjectHandle jsHandle)
	{
		return GetPrivate<IntPtr>(jsHandle);
	}

	// Reflection to access private fields needed for getting JS handle ID when making instance interopt calls
	static T GetPrivate<T>(object obj, [CallerMemberName] string callerMemberName = null)
	{
		var field = obj.GetType().GetField(callerMemberName, BindingFlags.NonPublic | BindingFlags.GetField | BindingFlags.Instance);
		var value = (T)field.GetValue(obj);
		return value;
	}
}

}

[jeromelaban]

Those APIs are likely to be replaced in the medium term, depending on how the Wasm specification evolves. In general, though, interoperating this way is generally costly and we're going to be replacing parts of this with another mechanism found in Uno (TSInteropMarshaller).

[jeromelaban]

Thanks :)

Interesting idea. We're not settled on what will end up in Uno (or a separate package for that matter), but we'll see how far we need to go, particularly when performance is considered.

[SerratedSharp]

I would appreciate some insight on the ._getByReflection.AsMemoized cache. I try doing a clean/rebuild, using incognito mode, closing and opening the browser, Ctrl+F5 to hard refresh, ensuring a new wasm package_* path is generated and referenced. But often instance method changes in the C# type aren't being reflected in the generated JS object. For example, a method I've added with only string parameters isn't showing up in the JS object.

[jeromelaban]

I would suggest not trying to use those APIs, as they're not documented and we're likely to change those as well. If you want to make your own implementation, use evaluations with WebAssemblyRuntime.InvokeJS.

[SerratedSharp]

You're saying I shouldn't use JSObjectHandle.Create(this); ? To clarify, I'm not calling getByReflection directly, just relying on that as part of .Create which generates the JS methods with C# callbacks.

I know how to use InvokeJS for making C#->JS calls, but I'm not clear how I would use that for JS->C# calls.

Where is the API documentation? Everything on the Bootstrap readme.md seems to cover setup/compilations. InvokeJS isn't mentioned there. Everything I've been doing for the last few weeks has been based on looking at the other Uno project source code and seeing how they leverage the Bootsrap APIs.

[jeromelaban]

The bare minimum APIs are in this file, the rest is specific to Uno.UI. If you want to call back to C#, use something similar to this.