@vpmedia/phaser 1.123.0 → 1.124.0

package/src/phaser/display/webgl/earcut.test.ts

@@ -31,32 +31,32 @@ const SQUARE_WITH_HOLE = [
   10, 10, 20, 10, 20, 20, 10, 20,
 ];
 
-describe('earcut triangulate', () => {
-  describe('simple polygons', () => {
-    it('cuts a square into two triangles', () => {
+describe('earcut triangulate', (): void => {
+  describe('simple polygons', (): void => {
+    it('cuts a square into two triangles', (): void => {
       const triangles = triangulate(SQUARE, null, 2);
       expect(triangles).toHaveLength(6);
       expect(coveredArea(SQUARE, triangles)).toBeCloseTo(100, 6);
     });
 
-    it('leaves a triangle as one triangle', () => {
+    it('leaves a triangle as one triangle', (): void => {
       const triangles = triangulate(TRIANGLE, null, 2);
       expect(triangles).toHaveLength(3);
       expect(coveredArea(TRIANGLE, triangles)).toBeCloseTo(50, 6);
     });
 
-    it('covers an L shape exactly', () => {
+    it('covers an L shape exactly', (): void => {
       const triangles = triangulate(L_SHAPE, null, 2);
       expect(triangles).toHaveLength(12);
       expect(coveredArea(L_SHAPE, triangles)).toBeCloseTo(300, 6);
     });
 
-    it('covers a concave polygon exactly', () => {
+    it('covers a concave polygon exactly', (): void => {
       const triangles = triangulate(CONCAVE, null, 2);
       expect(coveredArea(CONCAVE, triangles)).toBeCloseTo(300, 6);
     });
 
-    it('emits indices in range and in whole triangles', () => {
+    it('emits indices in range and in whole triangles', (): void => {
       const triangles = triangulate(L_SHAPE, null, 2);
       expect(triangles.length % 3).toBe(0);
       for (const index of triangles) {
@@ -66,21 +66,21 @@ describe('earcut triangulate', () => {
     });
   });
 
-  describe('polygons with holes', () => {
-    it('covers the outer ring minus the hole', () => {
+  describe('polygons with holes', (): void => {
+    it('covers the outer ring minus the hole', (): void => {
       const triangles = triangulate(SQUARE_WITH_HOLE, [4], 2);
       expect(coveredArea(SQUARE_WITH_HOLE, triangles)).toBeCloseTo(900 - 100, 6);
     });
 
-    it('emits whole triangles', () => {
+    it('emits whole triangles', (): void => {
       const triangles = triangulate(SQUARE_WITH_HOLE, [4], 2);
       expect(triangles.length % 3).toBe(0);
       expect(triangles.length).toBeGreaterThan(0);
     });
   });
 
-  describe('winding order', () => {
-    it('gives the same coverage whichever way the ring is wound', () => {
+  describe('winding order', (): void => {
+    it('gives the same coverage whichever way the ring is wound', (): void => {
       const clockwise = [0, 0, 0, 10, 10, 10, 10, 0];
       const counter = [0, 0, 10, 0, 10, 10, 0, 10];
       expect(coveredArea(clockwise, triangulate(clockwise, null, 2))).toBeCloseTo(
@@ -90,32 +90,32 @@ describe('earcut triangulate', () => {
     });
   });
 
-  describe('degenerate input', () => {
-    it('returns nothing for an empty ring', () => {
+  describe('degenerate input', (): void => {
+    it('returns nothing for an empty ring', (): void => {
       expect(triangulate([], null, 2)).toStrictEqual([]);
     });
 
-    it('returns nothing for a single point', () => {
+    it('returns nothing for a single point', (): void => {
       expect(triangulate([1, 1], null, 2)).toStrictEqual([]);
     });
 
-    it('returns nothing for a two point ring', () => {
+    it('returns nothing for a two point ring', (): void => {
       expect(triangulate([0, 0, 10, 10], null, 2)).toStrictEqual([]);
     });
 
-    it('returns nothing for a zero area ring', () => {
+    it('returns nothing for a zero area ring', (): void => {
       expect(triangulate([0, 0, 10, 10, 20, 20], null, 2)).toStrictEqual([]);
     });
 
-    it('drops duplicated consecutive points', () => {
+    it('drops duplicated consecutive points', (): void => {
       const withDuplicate = [0, 0, 0, 0, 10, 0, 10, 10, 0, 10];
       expect(coveredArea(withDuplicate, triangulate(withDuplicate, null, 2))).toBeCloseTo(100, 6);
     });
   });
 
-  describe('large rings', () => {
+  describe('large rings', (): void => {
     // Past 80 vertices earcut switches to the z-order curve hash, a separate code path.
-    it('covers a many sided polygon exactly, exercising the hashed path', () => {
+    it('covers a many sided polygon exactly, exercising the hashed path', (): void => {
       const sides = 200;
       const radius = 100;
       const ring: number[] = [];

package/src/phaser/display/webgl/fast_sprite_batch.ts

@@ -2,6 +2,11 @@ import type { BaseTexture } from './base_texture.js';
 import type { IdentifiedWebGLRenderingContext } from './util.js';
 import type { Image } from '../../display/image.js';
 import type { RenderSession } from '../render_session.js';
+import type { DisplayObject } from '../display_object.js';
+
+/** What the fast batch draws: a container whose children are plain images sharing one texture. */
+export type FastBatchRoot = DisplayObject & { children: Image[] };
+import type { FastShader } from './shader/fast.js';
 
 export class FastSpriteBatch {
   public gl!: IdentifiedWebGLRenderingContext;
@@ -16,10 +21,10 @@ export class FastSpriteBatch {
   public drawing!: boolean;
   public currentBatchSize!: number;
   public currentBaseTexture!: BaseTexture | null;
-  public currentBlendMode!: any;
+  public currentBlendMode!: number;
   public renderSession!: RenderSession;
-  public shader!: any;
-  public matrix!: any;
+  public shader!: FastShader | null;
+  public matrix!: Float32Array | number[] | null;
   /**
    * Creates a new FastSpriteBatch instance.
    * @param {WebGLRenderingContext & { id: number }} gl - The WebGL rendering context.
@@ -75,7 +80,7 @@ export class FastSpriteBatch {
    * @param {object} spriteBatch - The sprite batch to render.
    * @param {object} renderSession - The render session to use.
    */
-  public begin(spriteBatch: any, renderSession: RenderSession): void {
+  public begin(spriteBatch: FastBatchRoot, renderSession: RenderSession): void {
     this.renderSession = renderSession;
     this.shader = this.renderSession.shaderManager.fastShader;
     this.matrix = spriteBatch.worldTransform.toArray(true);
@@ -93,12 +98,12 @@ export class FastSpriteBatch {
    * Flushes the sprite batch to WebGL.
    * @param {object} spriteBatch - The sprite batch to flush.
    */
-  public render(spriteBatch: any): void {
+  public render(spriteBatch: FastBatchRoot): void {
     const { children } = spriteBatch;
     const [sprite] = children;
     // if the uvs have not updated then no point rendering just yet!
     // check texture.
-    if (!sprite.texture._uvs) {
+    if (!sprite?.texture._uvs) {
       return;
     }
     this.currentBaseTexture = sprite.texture.baseTexture;
@@ -107,8 +112,8 @@ export class FastSpriteBatch {
       this.flush();
       this.renderSession.blendModeManager.setBlendMode(sprite.blendMode);
     }
-    for (let i = 0, j = children.length; i < j; i += 1) {
-      this.renderSprite(children[i]);
+    for (const child of children) {
+      this.renderSprite(child);
     }
     this.flush();
   }
@@ -268,16 +273,16 @@ export class FastSpriteBatch {
     gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
     // set the projection
     const { projection } = this.renderSession;
-    gl.uniform2f(this.shader.projectionVector, projection.x, projection.y);
+    gl.uniform2f(this.shader!.projectionVector, projection.x, projection.y);
     // set the matrix
-    gl.uniformMatrix3fv(this.shader.uMatrix, false, this.matrix);
+    gl.uniformMatrix3fv(this.shader!.uMatrix, false, this.matrix!);
     // set the pointers
     const stride = this.vertSize * 4;
-    gl.vertexAttribPointer(this.shader.aVertexPosition, 2, gl.FLOAT, false, stride, 0);
-    gl.vertexAttribPointer(this.shader.aPositionCoord, 2, gl.FLOAT, false, stride, 2 * 4);
-    gl.vertexAttribPointer(this.shader.aScale, 2, gl.FLOAT, false, stride, 4 * 4);
-    gl.vertexAttribPointer(this.shader.aRotation, 1, gl.FLOAT, false, stride, 6 * 4);
-    gl.vertexAttribPointer(this.shader.aTextureCoord, 2, gl.FLOAT, false, stride, 7 * 4);
-    gl.vertexAttribPointer(this.shader.colorAttribute, 1, gl.FLOAT, false, stride, 9 * 4);
+    gl.vertexAttribPointer(this.shader!.aVertexPosition, 2, gl.FLOAT, false, stride, 0);
+    gl.vertexAttribPointer(this.shader!.aPositionCoord, 2, gl.FLOAT, false, stride, 2 * 4);
+    gl.vertexAttribPointer(this.shader!.aScale, 2, gl.FLOAT, false, stride, 4 * 4);
+    gl.vertexAttribPointer(this.shader!.aRotation, 1, gl.FLOAT, false, stride, 6 * 4);
+    gl.vertexAttribPointer(this.shader!.aTextureCoord, 2, gl.FLOAT, false, stride, 7 * 4);
+    gl.vertexAttribPointer(this.shader!.colorAttribute, 1, gl.FLOAT, false, stride, 9 * 4);
   }
 }

package/src/phaser/display/webgl/filter_manager.ts

@@ -1,9 +1,12 @@
+import type { AbstractFilter } from './abstract_filter.js';
+import type { FilterTexture } from './filter_texture.js';
+
 export class WebGLFilterManager {
   public gl!: WebGLRenderingContext;
-  public texturePool!: any[];
-  public filterStack!: any;
-  public offsetX!: any;
-  public offsetY!: any;
+  public texturePool!: FilterTexture[];
+  public filterStack!: AbstractFilter[];
+  public offsetX!: number;
+  public offsetY!: number;
   /**
    * Creates a new FilterManager instance.
    */

package/src/phaser/display/webgl/filter_texture.ts

@@ -3,10 +3,10 @@ import { SCALE_LINEAR } from '../../core/const.js';
 export class FilterTexture {
   public width!: number;
   public height!: number;
-  public gl!: any;
-  public frameBuffer!: any;
-  public texture!: any;
-  public renderBuffer!: any;
+  public gl!: WebGLRenderingContext;
+  public frameBuffer!: WebGLFramebuffer | null;
+  public texture!: WebGLTexture | null;
+  public renderBuffer!: WebGLRenderbuffer | null;
   /**
    * Creates a new FilterTexture instance.
    * @param {WebGLRenderingContext} gl - The WebGL rendering context.
@@ -72,6 +72,6 @@ export class FilterTexture {
     this.frameBuffer = null;
     this.texture = null;
     this.renderBuffer = null;
-    this.gl = null;
+    this.gl = null!;
   }
 }

package/src/phaser/display/webgl/graphics.ts

@@ -26,7 +26,7 @@ export const getStencilBufferLimit = (): number => {
  * Updates the graphics data for WebGL rendering.
  * @returns {object[]} The graphics data array.
  */
-export const getGraphicsDataPool = () => {
+export const getGraphicsDataPool = (): GraphicsData[] => {
   globalThis.PhaserRegistry.graphicsDataPool ??= [];
   return globalThis.PhaserRegistry.graphicsDataPool;
 };
@@ -37,7 +37,7 @@ export const getGraphicsDataPool = () => {
  * @param {number} type - The type of graphics data to create.
  * @returns {object} The newly created graphics data object.
  */
-export const switchMode = (webGL: GraphicsWebGLBucket, type: number) => {
+export const switchMode = (webGL: GraphicsWebGLBucket, type: number): GraphicsData => {
   let webGLData;
   if (webGL.data.length === 0) {
     webGLData = getGraphicsDataPool().pop() ?? new GraphicsData(webGL.gl);

package/src/phaser/display/webgl/mask_manager.ts

@@ -1,24 +1,22 @@
 import { updateGraphics } from './graphics.js';
 import type { RenderSession } from '../render_session.js';
+import type { Graphics } from '../graphics.js';
 
 /**
  * Sets up the mask manager for WebGL rendering.
  * @param {object} maskData - The mask data to apply.
  * @param {object} renderSession - The rendering session.
  */
-export const pushMask = (maskData: any, renderSession: RenderSession): void => {
+export const pushMask = (maskData: Graphics, renderSession: RenderSession): void => {
   const { gl } = renderSession;
   if (maskData.dirty) {
     updateGraphics(maskData, gl);
   }
-  if (
-    maskData._webGL[gl.id] === undefined ||
-    maskData._webGL[gl.id].data === undefined ||
-    maskData._webGL[gl.id].data.length === 0
-  ) {
+  const [first] = maskData._webGL[gl.id]?.data ?? [];
+  if (!first) {
     return;
   }
-  renderSession.stencilManager.pushStencil(maskData, maskData._webGL[gl.id].data[0], renderSession);
+  renderSession.stencilManager.pushStencil(maskData, first, renderSession);
 };
 
 /**
@@ -26,14 +24,11 @@ export const pushMask = (maskData: any, renderSession: RenderSession): void => {
  * @param {object} maskData - The mask data to apply.
  * @param {object} renderSession - The rendering session.
  */
-export const popMask = (maskData: any, renderSession: RenderSession): void => {
+export const popMask = (maskData: Graphics | null, renderSession: RenderSession): void => {
   const { gl } = renderSession;
-  if (
-    maskData._webGL[gl.id] === undefined ||
-    maskData._webGL[gl.id].data === undefined ||
-    maskData._webGL[gl.id].data.length === 0
-  ) {
+  const [first] = maskData?._webGL[gl.id]?.data ?? [];
+  if (!first) {
     return;
   }
-  renderSession.stencilManager.popStencil(maskData, maskData._webGL[gl.id].data[0], renderSession);
+  renderSession.stencilManager.popStencil(maskData!, first, renderSession);
 };

package/src/phaser/display/webgl/render_texture.ts

@@ -9,17 +9,16 @@ import type { WebGLRenderer } from './renderer.js';
 import type { CanvasRenderer } from '../canvas/renderer.js';
 
 export class RenderTexture extends Texture {
-  [key: string]: any;
   declare public width: number;
   declare public height: number;
   public resolution!: number;
-  declare public frame: any;
-  declare public crop: any;
-  public renderer!: any;
-  public textureBuffer!: any;
-  public render!: any;
-  public projection!: any;
-  declare public valid: any;
+  declare public frame: Rectangle;
+  declare public crop: Rectangle;
+  public renderer!: WebGLRenderer | CanvasRenderer;
+  public textureBuffer!: FilterTexture | CanvasBuffer;
+  public render!: () => void;
+  public projection: Point | null = null;
+  declare public valid: boolean;
   /**
    * Creates a new RenderTexture instance.
    * @param {number} width - The width of the render texture.
@@ -52,17 +51,19 @@ export class RenderTexture extends Texture {
     this.frame = new Rectangle(0, 0, this.width * this.resolution, this.height * this.resolution);
     this.crop = new Rectangle(0, 0, this.width * this.resolution, this.height * this.resolution);
     this.renderer = renderer;
-    if (this.renderer.type === RENDER_WEBGL) {
-      const { gl } = this.renderer;
+    if (renderer.type === RENDER_WEBGL) {
+      const { gl } = renderer as WebGLRenderer;
       this.baseTexture._dirty[gl.id] = false;
-      this.textureBuffer = new FilterTexture(gl, this.width, this.height, this.baseTexture.scaleMode);
-      this.baseTexture._glTextures[gl.id] = this.textureBuffer.texture;
+      const buffer = new FilterTexture(gl, this.width, this.height, this.baseTexture.scaleMode);
+      this.textureBuffer = buffer;
+      this.baseTexture._glTextures[gl.id] = buffer.texture;
       this.render = this.renderWebGL;
       this.projection = new Point(this.width * 0.5, -this.height * 0.5);
     } else {
       this.render = this.renderCanvas;
-      this.textureBuffer = new CanvasBuffer(this.width * this.resolution, this.height * this.resolution);
-      this.baseTexture.source = this.textureBuffer.canvas;
+      const buffer = new CanvasBuffer(this.width * this.resolution, this.height * this.resolution);
+      this.textureBuffer = buffer;
+      this.baseTexture.source = buffer.canvas;
     }
     this.valid = true;
     this._updateUvs();

package/src/phaser/display/webgl/renderer.ts

@@ -35,6 +35,7 @@ import { WebGLStencilManager } from './stencil_manager.js';
 import type { IdentifiedWebGLRenderingContext } from './util.js';
 import { getWebGLContextErrorCode, getWebGLContextErrorName } from './util.js';
 import type { RenderSession } from '../render_session.js';
+import type { DisplayObject } from '../display_object.js';
 
 export class WebGLRenderer {
   public gl!: IdentifiedWebGLRenderingContext;
@@ -52,9 +53,9 @@ export class WebGLRenderer {
   public offset!: Point;
   public shaderManager!: WebGLShaderManager;
   public spriteBatch!: WebGLSpriteBatch;
-  public filterManager!: any;
-  public stencilManager!: any;
-  public blendModeManager!: any;
+  public filterManager!: WebGLFilterManager;
+  public stencilManager!: WebGLStencilManager;
+  public blendModeManager!: WebGLBlendModeManager;
   public renderSession!: RenderSession;
   /**
    * Creates a new WebGLRenderer instance.
@@ -204,7 +205,7 @@ export class WebGLRenderer {
    * @param {object} buffer - The render buffer.
    * @param {Matrix} matrix - The transformation matrix.
    */
-  public renderDisplayObject(displayObject: any, projection: Point, buffer?: any, matrix?: any): void {
+  public renderDisplayObject(displayObject: DisplayObject, projection: Point, buffer?: WebGLFramebuffer | null): void {
     this.renderSession.blendModeManager.setBlendMode(BLEND_NORMAL);
     // reset the render session data..
     this.renderSession.drawCount = 0;
@@ -217,9 +218,9 @@ export class WebGLRenderer {
     // start the sprite batch
     this.spriteBatch.begin(this.renderSession);
     // start the filter manager
-    this.filterManager.begin(this.renderSession, buffer);
+    this.filterManager.begin();
     // render the scene!
-    displayObject.renderWebGL(this.renderSession, matrix);
+    displayObject.renderWebGL(this.renderSession);
     // finish the sprite batch
     this.spriteBatch.end();
   }

package/src/phaser/display/webgl/shader/normal.ts

@@ -1,5 +1,6 @@
 import { v4 as uuidv4 } from 'uuid';
 import { compileProgram } from '../util.js';
+import type { Texture } from '../texture.js';
 
 const defaultVertexSrc = [
   'attribute vec2 aVertexPosition;',
@@ -21,7 +22,7 @@ const defaultVertexSrc = [
   '}',
 ];
 
-const glMember = (gl: WebGLRenderingContext, name: string): any => (gl as unknown as Record<string, unknown>)[name];
+const glMember = (gl: WebGLRenderingContext, name: string): GLenum => (gl as unknown as Record<string, GLenum>)[name]!;
 
 /** Applies one of the gl uniform setters, whose signatures vary by uniform kind. */
 const callUniformSetter = (setter: unknown, gl: WebGLRenderingContext, ...args: unknown[]): void => {
@@ -32,9 +33,29 @@ const callUniformSetter = (setter: unknown, gl: WebGLRenderingContext, ...args:
 
 // this shader is used for the default sprite rendering
 
+/** The extra texture parameters a sampler uniform may carry, as the consumer supplied them. */
+export type ShaderTextureData = {
+  magFilter?: GLenum;
+  minFilter?: GLenum;
+  wrapS?: GLenum;
+  wrapT?: GLenum;
+  luminance?: boolean;
+  repeat?: boolean;
+  flipY?: boolean;
+  width?: number;
+  height?: number;
+  border?: number;
+};
+
+/** A sampler uniform, whose value is the texture to bind. */
+export type SamplerUniform = ShaderUniform & { value: Texture | null };
+
+/** A vector uniform value, read component-wise by the setter matching its arity. */
+export type UniformVector = { x: number; y: number; z?: number; w?: number };
+
 export type ShaderUniform = {
   type: string;
-  value: any;
+  value: unknown;
   uniformLocation?: WebGLUniformLocation | null;
   /** One of the gl uniform setters. Their arities differ by uniform kind, so the stored value is
    * opaque and applied through callUniformSetter. */
@@ -42,7 +63,7 @@ export type ShaderUniform = {
   glMatrix?: boolean;
   glValueLength?: number;
   transpose?: boolean;
-  textureData?: Record<string, any>;
+  textureData?: ShaderTextureData;
   _init?: boolean;
 };
 
@@ -141,7 +162,7 @@ export class NormalShader {
       if (type === 'sampler2D') {
         uniform._init = false;
         if (uniform.value !== null) {
-          this.initSampler2D(uniform);
+          this.initSampler2D(uniform as SamplerUniform);
         }
       } else if (type === 'mat2' || type === 'mat3' || type === 'mat4') {
         //  These require special handling
@@ -174,13 +195,14 @@ export class NormalShader {
    * Sets a uniform value for this shader.
    * @param {object} uniform - The uniform to set.
    */
-  public initSampler2D(uniform: any): void {
-    if (!uniform.value || !uniform.value.baseTexture || !uniform.value.baseTexture.hasLoaded) {
+  public initSampler2D(uniform: SamplerUniform): void {
+    const texture = uniform.value;
+    if (!texture?.baseTexture.hasLoaded) {
       return;
     }
     const { gl } = this;
     gl.activeTexture(glMember(gl, `TEXTURE${this.textureCount}`));
-    gl.bindTexture(gl.TEXTURE_2D, uniform.value.baseTexture._glTextures[gl.id]);
+    gl.bindTexture(gl.TEXTURE_2D, texture.baseTexture._glTextures[gl.id] ?? null);
     //  Extended texture data
     if (uniform.textureData) {
       const data = uniform.textureData;
@@ -211,14 +233,14 @@ export class NormalShader {
         gl.texImage2D(gl.TEXTURE_2D, 0, format, width, height, border, format, gl.UNSIGNED_BYTE, null);
       } else {
         //  void texImage2D(GLenum target, GLint level, GLenum internalformat, GLenum format, GLenum type, ImageData? pixels);
-        gl.texImage2D(gl.TEXTURE_2D, 0, format, gl.RGBA, gl.UNSIGNED_BYTE, uniform.value.baseTexture.source);
+        gl.texImage2D(gl.TEXTURE_2D, 0, format, gl.RGBA, gl.UNSIGNED_BYTE, texture.baseTexture.source!);
       }
       gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, magFilter);
       gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, minFilter);
       gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, wrapS);
       gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, wrapT);
     }
-    gl.uniform1i(uniform.uniformLocation, this.textureCount);
+    gl.uniform1i(uniform.uniformLocation ?? null, this.textureCount);
     uniform._init = true;
     this.textureCount += 1;
   }
@@ -231,6 +253,8 @@ export class NormalShader {
     const { gl } = this;
     //  This would probably be faster in an array and it would guarantee key order
     for (const uniform of Object.values(this.uniforms)) {
+      const vector = uniform.value as UniformVector;
+      const sampler = uniform as SamplerUniform;
       if (uniform.glValueLength === 1) {
         if (uniform.glMatrix === true) {
           callUniformSetter(uniform.glFunc, gl, uniform.uniformLocation, uniform.transpose, uniform.value);
@@ -238,40 +262,26 @@ export class NormalShader {
           callUniformSetter(uniform.glFunc, gl, uniform.uniformLocation, uniform.value);
         }
       } else if (uniform.glValueLength === 2) {
-        callUniformSetter(uniform.glFunc, gl, uniform.uniformLocation, uniform.value.x, uniform.value.y);
+        callUniformSetter(uniform.glFunc, gl, uniform.uniformLocation, vector.x, vector.y);
       } else if (uniform.glValueLength === 3) {
-        callUniformSetter(
-          uniform.glFunc,
-          gl,
-          uniform.uniformLocation,
-          uniform.value.x,
-          uniform.value.y,
-          uniform.value.z
-        );
+        callUniformSetter(uniform.glFunc, gl, uniform.uniformLocation, vector.x, vector.y, vector.z);
       } else if (uniform.glValueLength === 4) {
-        callUniformSetter(
-          uniform.glFunc,
-          gl,
-          uniform.uniformLocation,
-          uniform.value.x,
-          uniform.value.y,
-          uniform.value.z,
-          uniform.value.w
-        );
+        callUniformSetter(uniform.glFunc, gl, uniform.uniformLocation, vector.x, vector.y, vector.z, vector.w);
       } else if (uniform.type === 'sampler2D') {
         if (uniform._init) {
           gl.activeTexture(glMember(gl, `TEXTURE${this.textureCount}`));
-          if (uniform.value.baseTexture._dirty[gl.id]) {
-            globalThis.PhaserRegistry.INSTANCES[gl.id]?.updateTexture(uniform.value.baseTexture);
+          const { baseTexture } = sampler.value!;
+          if (baseTexture._dirty[gl.id]) {
+            globalThis.PhaserRegistry.INSTANCES[gl.id]?.updateTexture(baseTexture);
           } else {
             // bind the current texture
-            gl.bindTexture(gl.TEXTURE_2D, uniform.value.baseTexture._glTextures[gl.id]);
+            gl.bindTexture(gl.TEXTURE_2D, baseTexture._glTextures[gl.id] ?? null);
           }
           //  gl.bindTexture(gl.TEXTURE_2D, uniform.value.baseTexture._glTextures[gl.id] || PIXI.createWebGLTexture( uniform.value.baseTexture, gl));
           gl.uniform1i(uniform.uniformLocation ?? null, this.textureCount);
           this.textureCount += 1;
         } else {
-          this.initSampler2D(uniform);
+          this.initSampler2D(sampler);
         }
       }
     }