working webgl and GRGl context initialisation.

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

@@ -8,14 +8,11 @@ using Avalonia.Web;
 internal class Program
 {
 
-    [DllImport("libSkiaSharp", CallingConvention = CallingConvention.Cdecl)]
-    static extern JSObject example_initialize();
+    
     private static void Main(string[] args)
     {
         Console.WriteLine("Hello, Browser!");
 
-        example_initialize();
-
         Console.WriteLine();
         
 

src/Web/Avalonia.Web.Sample/interop.js

@@ -5,7 +5,7 @@ var LibraryExample = {
         }
     },
     example_initialize: function () {
-        window["avalonia-helper-GL"] = GL
+        globalThis.AvaloniaGL = GL
     }
 }
 

src/Web/Avalonia.Web/AvaloniaRuntime.cs

@@ -9,10 +9,13 @@ public partial class AvaloniaRuntime
 {
     public record GLInfo(int ContextId, uint FboId, int Stencils, int Samples, int Depth);
 
+    [DllImport("libSkiaSharp", CallingConvention = CallingConvention.Cdecl)]
+    static extern JSObject example_initialize();
+
     [JSExport]
     internal static void StartAvaloniaView(JSObject canvas)
     {
-        Init();
+        example_initialize();
         // setup, get gl context...
         var info = InitGL(canvas, "testCanvas");
 

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

@@ -1,6 +1,4 @@
-declare let GL: any;
-declare let GLctx: WebGLRenderingContext;
-declare let Module: EmscriptenModule;
+declare let Module: EmscriptenModule;
 
 type SKGLViewInfo = {
     context: WebGLRenderingContext | WebGL2RenderingContext | undefined;
@@ -64,9 +62,13 @@ export class Canvas {
                 return;
             }
 
+            var GL = (globalThis as any).AvaloniaGL;
+
             // make current
             GL.makeContextCurrent(ctx);
 
+            var GLctx = GL.currentContext.GLctx as WebGLRenderingContext;
+
             // read values
             const fbo = GLctx.getParameter(GLctx.FRAMEBUFFER_BINDING);
             this.glInfo = {
@@ -103,8 +105,7 @@ export class Canvas {
             renderViaOffscreenBackBuffer: 1,
         };
 
-
-        var context = htmlCanvas.getContext("webgl2", contextAttributes);
+        var GL = (globalThis as any).AvaloniaGL;
 
         let ctx: WebGLRenderingContext = GL.createContext(htmlCanvas, contextAttributes);
         if (!ctx && contextAttributes.majorVersion > 1) {
@@ -116,4 +117,4 @@ export class Canvas {
 
         return ctx;
     }
-}
+}

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

@@ -30,7 +30,9 @@ var Canvas = class {
         console.error(`Failed to create WebGL context: err ${ctx}`);
         return;
       }
+      var GL = globalThis.AvaloniaGL;
       GL.makeContextCurrent(ctx);
+      var GLctx = GL.currentContext.GLctx;
       const fbo = GLctx.getParameter(GLctx.FRAMEBUFFER_BINDING);
       this.glInfo = {
         context: ctx,
@@ -82,7 +84,7 @@ var Canvas = class {
       explicitSwapControl: 0,
       renderViaOffscreenBackBuffer: 1
     };
-    var context = htmlCanvas.getContext("webgl2", contextAttributes);
+    var GL = globalThis.AvaloniaGL;
     let ctx = GL.createContext(htmlCanvas, contextAttributes);
     if (!ctx && contextAttributes.majorVersion > 1) {
       console.warn("Falling back to WebGL 1.0");