@lightningjs/renderer 2.1.2 → 2.3.0

package/src/core/text-rendering/renderers/TextRenderer.ts

@@ -431,24 +431,24 @@ export abstract class TextRenderer<
     };
     // For each prop setter add a wrapper method that checks if the prop is
     // different before calling the setter
-    this.set = Object.freeze(
-      Object.fromEntries(
-        Object.entries(propSetters).map(([key, setter]) => {
-          return [
-            key as keyof TrProps,
-            (state: StateT, value: TrProps[keyof TrProps]) => {
-              if (state.props[key as keyof TrProps] !== value) {
-                setter(state, value as never);
-                // Assume any prop change will require a render
-                // This is required because otherwise a paused RAF will result
-                // in renders when text props are changed.
-                this.stage.requestRender();
-              }
-            },
-          ];
-        }),
-      ),
-    ) as typeof this.set;
+    const propSet = {};
+    Object.keys(propSetters).forEach((key) => {
+      Object.defineProperty(propSet, key, {
+        value: (state: StateT, value: TrProps[keyof TrProps]) => {
+          // Check if the current prop value is different before calling the setter
+          if (state.props[key as keyof TrProps] !== value) {
+            propSetters[key as keyof TrPropSetters](state, value as never);
+
+            // Assume any prop change will require a render
+            // This ensures that renders are triggered appropriately even with RAF paused
+            this.stage.requestRender();
+          }
+        },
+        writable: false, // Prevents property from being changed
+        configurable: false, // Prevents property from being deleted
+      });
+    });
+    this.set = propSet as Readonly<TrPropSetters<StateT>>;
   }
 
   setStatus(state: StateT, status: StateT['status'], error?: Error) {

package/src/main-api/Inspector.ts

@@ -246,6 +246,18 @@ export class Inspector {
     // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-explicit-any
     (node as any).div = div;
 
+    node.on('inViewport', () => {
+      div.setAttribute('state', 'inViewport');
+    });
+
+    node.on('inBounds', () => {
+      div.setAttribute('state', 'inBounds');
+    });
+
+    node.on('outOfBounds', () => {
+      div.setAttribute('state', 'outOfBounds');
+    });
+
     return this.createProxy(node, div);
   }
 

package/src/main-api/Renderer.ts

@@ -245,6 +245,17 @@ export interface RendererMainSettings {
    *
    */
   fontEngines: (typeof SdfTextRenderer | typeof CanvasTextRenderer)[];
+
+  /**
+   * Force WebGL2
+   *
+   * @remarks
+   * Force the renderer to use WebGL2. This can be used to force the renderer to
+   * use WebGL2 even if the browser supports WebGL1.
+   *
+   * @defaultValue `false`
+   */
+  forceWebGL2?: boolean;
 }
 
 /**
@@ -330,6 +341,7 @@ export class RendererMain extends EventEmitter {
       numImageWorkers:
         settings.numImageWorkers !== undefined ? settings.numImageWorkers : 2,
       enableContextSpy: settings.enableContextSpy ?? false,
+      forceWebGL2: settings.forceWebGL2 ?? false,
       inspector: settings.inspector ?? false,
       renderEngine: settings.renderEngine,
       quadBufferSize: settings.quadBufferSize ?? 4 * 1024 * 1024,
@@ -366,6 +378,7 @@ export class RendererMain extends EventEmitter {
       deviceLogicalPixelRatio: this.settings.deviceLogicalPixelRatio,
       devicePhysicalPixelRatio: this.settings.devicePhysicalPixelRatio,
       enableContextSpy: this.settings.enableContextSpy,
+      forceWebGL2: this.settings.forceWebGL2,
       fpsUpdateInterval: this.settings.fpsUpdateInterval,
       numImageWorkers: this.settings.numImageWorkers,
       renderEngine: this.settings.renderEngine,

package/src/utils.ts

@@ -21,6 +21,7 @@ import type { ContextSpy } from './core/lib/ContextSpy.js';
 
 export function createWebGLContext(
   canvas: HTMLCanvasElement | OffscreenCanvas,
+  forceWebGL2 = false,
   contextSpy: ContextSpy | null,
 ): WebGLRenderingContext {
   const config: WebGLContextAttributes = {
@@ -38,7 +39,7 @@ export function createWebGLContext(
   const gl =
     // TODO: Remove this assertion once this issue is fixed in TypeScript
     // https://github.com/microsoft/TypeScript/issues/53614
-    (canvas.getContext('webgl', config) ||
+    (canvas.getContext(forceWebGL2 ? 'webgl2' : 'webgl', config) ||
       canvas.getContext(
         'experimental-webgl' as 'webgl',
         config,