move initialisation to managed side.

src/Web/Avalonia.Web.Sample/Program.cs

@@ -1,14 +1,18 @@
 using System;
+using System.Reflection.Metadata;
 using System.Runtime.InteropServices;
 using System.Runtime.InteropServices.JavaScript;
 using System.Threading.Tasks;
+using System.Xml.Linq;
 using Avalonia.Web;
 //using SkiaSharp;
 
-internal class Program
+internal partial class Program
 {
 
-    
+    [JSImport("globalThis.document.getElementById")]
+    internal static partial JSObject GetElementById(string id);
+
     private static void Main(string[] args)
     {
         Console.WriteLine("Hello, Browser!");
@@ -20,7 +24,13 @@ internal class Program
             Console.WriteLine(arg);
         }
 
-        AvaloniaRuntime.Init(); 
+        var div = GetElementById("out");
+        Console.WriteLine("got div");
+
+        var canvas = AvaloniaRuntime.CreateCanvas(div);
+
+        Console.WriteLine("Created canvas");
+        
     }
 }
 

src/Web/Avalonia.Web.Sample/main.js

@@ -2,7 +2,6 @@
 // The .NET Foundation licenses this file to you under the MIT license.
 
 import { dotnet } from './dotnet.js'
-import { createAvaloniaRuntime } from './avalonia.js'
 
 const is_browser = typeof window != "undefined";
 if (!is_browser) throw new Error(`Expected to be running in a browser`);
@@ -12,13 +11,6 @@ const dotnetRuntime = await dotnet
     .withApplicationArgumentsFromQuery()
     .create();
 
-const avaloniaRuntime = await createAvaloniaRuntime(dotnetRuntime);
-
-const outDiv = document.getElementById("out");
-avaloniaRuntime.createAvaloniaView(outDiv);
-
 const config = dotnetRuntime.getConfig();
-const exports = await dotnetRuntime.getAssemblyExports(config.mainAssemblyName);
-await exports.MyClass.TestDynamicModule();
 
-await dotnetRuntime.runMainAndExit(config.mainAssemblyName, ["dotnet", "is", "great!"]);
+await dotnetRuntime.runMainAndExit(config.mainAssemblyName, ["dotnet", "is", "great!"]);

src/Web/Avalonia.Web/AvaloniaRuntime.cs

@@ -29,6 +29,9 @@ public partial class AvaloniaRuntime
         Console.WriteLine($"{glInfo.ContextId}, {glInfo.FboId}");
     }
 
+    [JSImport("Canvas.createCanvas", "avalonia.js")]
+    public static partial JSObject CreateCanvas(JSObject container);
+
     [JSImport("Canvas.Foo", "avalonia.ts")]
     internal static partial void Foo(JSObject canvas);
 

src/Web/Avalonia.Web/webapp/modules/avalonia/canvas.ts

@@ -23,6 +23,14 @@ export class Canvas {
     newWidth?: number;
     newHeight?: number;
 
+    public static createCanvas(element: HTMLDivElement): HTMLCanvasElement {
+        var canvas = document.createElement("canvas");
+
+        element.appendChild(canvas);
+
+        return canvas;
+    }
+
     public static initGL(element: HTMLCanvasElement, elementId: string): SKGLViewInfo | null {
         console.log("inside initGL");
         var view = Canvas.init(true, element, elementId);

src/Web/Avalonia.Web/webapp/modules/avalonia/runtime.ts

@@ -15,9 +15,5 @@ export class AvaloniaRuntime {
     createAvaloniaView(element: HTMLDivElement): void {
         const canvas = document.createElement("canvas");
         element.appendChild(canvas);
-
-
-
-        this.dotnetAssembly.Avalonia.Web.AvaloniaRuntime.StartAvaloniaView(canvas);
     }
-}
+}

src/Web/Avalonia.Web/wwwroot/avalonia.js

@@ -43,6 +43,11 @@ var Canvas = class {
       };
     }
   }
+  static createCanvas(element) {
+    var canvas = document.createElement("canvas");
+    element.appendChild(canvas);
+    return canvas;
+  }
   static initGL(element, elementId) {
     console.log("inside initGL");
     var view = Canvas.init(true, element, elementId);
@@ -107,7 +112,6 @@ var AvaloniaRuntime = class {
   createAvaloniaView(element) {
     const canvas = document.createElement("canvas");
     element.appendChild(canvas);
-    this.dotnetAssembly.Avalonia.Web.AvaloniaRuntime.StartAvaloniaView(canvas);
   }
 };