@vpmedia/phaser 1.111.0 → 1.113.0

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

@@ -1,3 +1,6 @@
+import type { Game } from '../../core/game.js';
+import type { Stage } from '../../core/stage.js';
+import type { BaseTexture } from './base_texture.js';
 import {
   BLEND_ADD,
   BLEND_COLOR,
@@ -29,32 +32,34 @@ import * as WebGLMaskManager from './mask_manager.js';
 import { WebGLShaderManager } from './shader_manager.js';
 import { WebGLSpriteBatch } from './sprite_batch.js';
 import { WebGLStencilManager } from './stencil_manager.js';
+import type { IdentifiedWebGLRenderingContext } from './util.js';
 import { getWebGLContextErrorCode, getWebGLContextErrorName } from './util.js';
 
 export class WebGLRenderer {
-  [key: string]: any;
-  type!: any;
-  resolution!: any;
-  autoResize!: any;
-  contextLost!: any;
-  clearBeforeRender!: any;
-  width!: any;
-  height!: any;
-  view!: any;
-  _contextOptions!: any;
-  projection!: any;
-  offset!: any;
-  shaderManager!: any;
-  spriteBatch!: any;
-  filterManager!: any;
-  stencilManager!: any;
-  blendModeManager!: any;
-  renderSession!: any;
+  public gl!: IdentifiedWebGLRenderingContext;
+  public glContextId!: number;
+  public type!: any;
+  public resolution!: any;
+  public autoResize!: any;
+  public contextLost!: any;
+  public clearBeforeRender!: any;
+  public width!: any;
+  public height!: any;
+  public view!: any;
+  public _contextOptions!: any;
+  public projection!: any;
+  public offset!: any;
+  public shaderManager!: any;
+  public spriteBatch!: any;
+  public filterManager!: any;
+  public stencilManager!: any;
+  public blendModeManager!: any;
+  public renderSession!: any;
   /**
    * Creates a new WebGLRenderer instance.
-   * @param {import('../../core/game.js').Game} game - The game instance.
+   * @param {Game} game - The game instance.
    */
-  constructor(game: import('../../core/game.js').Game) {
+  public constructor(game: Game) {
     /** @type {number} */
     this.type = RENDER_WEBGL;
     this.resolution = game.config.resolution;
@@ -98,8 +103,8 @@ export class WebGLRenderer {
   /**
    * Destroys this renderer and cleans up resources.
    */
-  destroy() {
-    window.PhaserRegistry.GL_CONTEXTS[this.glContextId] = null;
+  public destroy() {
+    globalThis.PhaserRegistry.GL_CONTEXTS[this.glContextId] = null;
     this.projection = null;
     this.offset = null;
     this.shaderManager.destroy();
@@ -116,43 +121,35 @@ export class WebGLRenderer {
         loseContextExt.loseContext();
       }
     }
-    this.gl = null;
     this.renderSession = null;
     remove(this);
-    window.PhaserRegistry.INSTANCES[this.glContextId] = null;
-    window.PhaserRegistry.GL_CONTEXT_ID -= 1;
+    globalThis.PhaserRegistry.INSTANCES[this.glContextId] = null;
+    globalThis.PhaserRegistry.GL_CONTEXT_ID -= 1;
   }
 
   /**
    * Initializes the WebGL registry.
    */
-  initRegistry() {
-    if (!window.PhaserRegistry.GL_CONTEXT_ID) {
-      window.PhaserRegistry.GL_CONTEXT_ID = 0;
-    }
-    if (!window.PhaserRegistry.GL_CONTEXTS) {
-      window.PhaserRegistry.GL_CONTEXTS = [];
-    }
-    if (!window.PhaserRegistry.INSTANCES) {
-      window.PhaserRegistry.INSTANCES = [];
-    }
+  public initRegistry() {
+    globalThis.PhaserRegistry.GL_CONTEXT_ID ??= 0;
+    globalThis.PhaserRegistry.GL_CONTEXTS ??= [];
+    globalThis.PhaserRegistry.INSTANCES ??= [];
   }
 
   /**
    * Initializes the WebGL context for rendering.
-   * @param {import('../../core/game.js').Game} game - The game instance.
+   * @param {Game} game - The game instance.
    * @throws {Error}
    */
-  initContext(game: import('../../core/game.js').Game) {
+  public initContext(game: Game) {
     game.logger.info('initContext');
     // TODO: view.addEventListener('webglcontextcreationerror', this.onWebGLContextCreationError, false);
     /** @type {WebGLRenderingContext & { id: number }} */
-    // @ts-ignore
-    const gl = this.view.getContext('webgl', this._contextOptions);
-    this.gl = gl;
+    const gl = this.view.getContext('webgl', this._contextOptions) as IdentifiedWebGLRenderingContext | null;
     if (!gl) {
       throw new Error(ENGINE_ERROR_CREATING_WEBGL_CONTEXT);
     }
+    this.gl = gl;
     const errorCode = getWebGLContextErrorCode(gl);
     if (errorCode) {
       const errorName = getWebGLContextErrorName(errorCode);
@@ -163,11 +160,11 @@ export class WebGLRenderer {
     }
     // set current context
     this.initRegistry();
-    this.glContextId = window.PhaserRegistry.GL_CONTEXT_ID;
-    gl.id = window.PhaserRegistry.GL_CONTEXT_ID;
-    window.PhaserRegistry.GL_CONTEXTS[this.glContextId] = gl;
-    window.PhaserRegistry.INSTANCES[this.glContextId] = this;
-    window.PhaserRegistry.GL_CONTEXT_ID += 1;
+    this.glContextId = globalThis.PhaserRegistry.GL_CONTEXT_ID;
+    gl.id = globalThis.PhaserRegistry.GL_CONTEXT_ID;
+    globalThis.PhaserRegistry.GL_CONTEXTS[this.glContextId] = gl;
+    globalThis.PhaserRegistry.INSTANCES[this.glContextId] = this;
+    globalThis.PhaserRegistry.GL_CONTEXT_ID += 1;
     // set default settings
     gl.disable(gl.DEPTH_TEST);
     gl.disable(gl.CULL_FACE);
@@ -185,13 +182,13 @@ export class WebGLRenderer {
 
   /**
    * Renders the stage to WebGL.
-   * @param {import('../../core/stage.js').Stage} stage - The root stage to render.
+   * @param {Stage} stage - The root stage to render.
    */
-  render(stage: import('../../core/stage.js').Stage) {
+  public render(stage: Stage) {
     if (this.contextLost) {
       return;
     }
-    const gl = this.gl;
+    const { gl } = this;
     // -- Does this need to be set every frame? -- //
     // gl.viewport(0, 0, this.width, this.height);
     // make sure we are bound to the main frame buffer
@@ -207,12 +204,12 @@ export class WebGLRenderer {
 
   /**
    * Renders a display object to WebGL.
-   * @param {import('../../display/display_object.js').DisplayObject} displayObject - The display object to render.
+   * @param {DisplayObject} displayObject - The display object to render.
    * @param {Point} projection - The projection matrix.
    * @param {object} buffer - The render buffer.
-   * @param {import('../../geom/matrix.js').Matrix} matrix - The transformation matrix.
+   * @param {Matrix} matrix - The transformation matrix.
    */
-  renderDisplayObject(displayObject: any, projection: Point, buffer?: any, matrix?: any) {
+  public renderDisplayObject(displayObject: any, projection: Point, buffer?: any, matrix?: any) {
     this.renderSession.blendModeManager.setBlendMode(BLEND_NORMAL);
     // reset the render session data..
     this.renderSession.drawCount = 0;
@@ -237,7 +234,7 @@ export class WebGLRenderer {
    * @param {number} width - The new width of the canvas.
    * @param {number} height - The new height of the canvas.
    */
-  resize(width: number, height: number) {
+  public resize(width: number, height: number) {
     this.width = width * this.resolution;
     this.height = height * this.resolution;
     this.view.width = this.width;
@@ -253,17 +250,15 @@ export class WebGLRenderer {
 
   /**
    * Updates a texture in the WebGL context.
-   * @param {import('./base_texture.js').BaseTexture} texture - The base texture to update.
+   * @param {BaseTexture} texture - The base texture to update.
    * @returns {boolean} Whether the update was successful.
    */
-  updateTexture(texture: import('./base_texture.js').BaseTexture) {
+  public updateTexture(texture: BaseTexture) {
     if (!texture.hasLoaded) {
       return false;
     }
-    const gl = this.gl;
-    if (!texture._glTextures[gl.id]) {
-      texture._glTextures[gl.id] = gl.createTexture();
-    }
+    const { gl } = this;
+    texture._glTextures[gl.id] ??= gl.createTexture();
     gl.bindTexture(gl.TEXTURE_2D, texture._glTextures[gl.id]);
     gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, texture.premultipliedAlpha);
     gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, texture.source);
@@ -297,11 +292,11 @@ export class WebGLRenderer {
   /**
    * Maps blend modes to WebGL rendering operations.
    */
-  mapBlendModes() {
-    if (window.PhaserRegistry.blendModesWebGL) {
+  public mapBlendModes() {
+    if (globalThis.PhaserRegistry.blendModesWebGL) {
       return;
     }
-    const gl = this.gl;
+    const { gl } = this;
     const b = [];
     b[BLEND_NORMAL] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA];
     b[BLEND_ADD] = [gl.SRC_ALPHA, gl.DST_ALPHA];
@@ -320,6 +315,6 @@ export class WebGLRenderer {
     b[BLEND_SATURATION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA];
     b[BLEND_COLOR] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA];
     b[BLEND_LUMINOSITY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA];
-    window.PhaserRegistry.blendModesWebGL = b;
+    globalThis.PhaserRegistry.blendModesWebGL = b;
   }
 }

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

@@ -4,17 +4,27 @@ import { compileProgram } from '../util.js';
 // the next one is used for rendering triangle strips
 
 export class ComplexPrimitiveShader {
-  [key: string]: any;
-  gl!: any;
-  _UID!: any;
-  program!: any;
-  fragmentSrc!: any;
-  vertexSrc!: any;
+  public gl: WebGLRenderingContext | null;
+  public _UID: string;
+  public program: WebGLProgram | null;
+  public fragmentSrc: string[];
+  public vertexSrc: string[];
+  public projectionVector!: WebGLUniformLocation | null;
+  public offsetVector!: WebGLUniformLocation | null;
+  public tintColor!: WebGLUniformLocation | null;
+  public color!: WebGLUniformLocation | null;
+  public flipY!: WebGLUniformLocation | null;
+  public translationMatrix!: WebGLUniformLocation | null;
+  public alpha!: WebGLUniformLocation | null;
+  public aVertexPosition!: number;
+  public colorAttribute: number | undefined;
+  public uniforms: unknown = null;
+  public attributes: (number | undefined)[] | null = null;
   /**
    * Creates a new ComplexShader instance.
    * @param {WebGLRenderingContext} gl - The WebGL rendering context.
    */
-  constructor(gl: WebGLRenderingContext) {
+  public constructor(gl: WebGLRenderingContext) {
     this.gl = gl;
     this._UID = uuidv4();
     /** @type {WebGLProgram} */
@@ -52,9 +62,15 @@ export class ComplexPrimitiveShader {
   /**
    * Destroys this shader and cleans up resources.
    */
-  init() {
-    const gl = this.gl;
+  public init(): void {
+    const { gl } = this;
+    if (!gl) {
+      return;
+    }
     const program = compileProgram(gl, this.vertexSrc, this.fragmentSrc);
+    if (!program) {
+      return;
+    }
     gl.useProgram(program);
     // get and store the uniforms for the shader
     this.projectionVector = gl.getUniformLocation(program, 'projectionVector');
@@ -74,10 +90,10 @@ export class ComplexPrimitiveShader {
   /**
    * Binds this shader to the WebGL context.
    */
-  destroy() {
-    this.gl.deleteProgram(this.program);
+  public destroy(): void {
+    this.gl?.deleteProgram(this.program);
     this.uniforms = null;
     this.gl = null;
-    this.attribute = null;
+    this.attributes = null;
   }
 }

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

@@ -4,18 +4,30 @@ import { compileProgram } from '../util.js';
 // this shader is used for the fast sprite rendering
 
 export class FastShader {
-  [key: string]: any;
-  gl!: any;
-  _UID!: any;
-  program!: any;
-  textureCount!: any;
-  fragmentSrc!: any;
-  vertexSrc!: any;
+  public gl: WebGLRenderingContext | null;
+  public _UID: string;
+  public program: WebGLProgram | null;
+  public textureCount: number;
+  public fragmentSrc: string[];
+  public vertexSrc: string[];
+  public uSampler!: WebGLUniformLocation | null;
+  public projectionVector!: WebGLUniformLocation | null;
+  public offsetVector!: WebGLUniformLocation | null;
+  public dimensions!: WebGLUniformLocation | null;
+  public uMatrix!: WebGLUniformLocation | null;
+  public uniforms: unknown = null;
+  public aVertexPosition!: number;
+  public aPositionCoord!: number;
+  public aScale!: number;
+  public aRotation!: number;
+  public aTextureCoord!: number;
+  public colorAttribute!: number;
+  public attributes: number[] | null = null;
   /**
    * Creates a new FastShader instance.
    * @param {WebGLRenderingContext} gl - The WebGL rendering context.
    */
-  constructor(gl: WebGLRenderingContext) {
+  public constructor(gl: WebGLRenderingContext) {
     this.gl = gl;
     this._UID = uuidv4();
     /** @type {WebGLProgram} */
@@ -65,9 +77,15 @@ export class FastShader {
   /**
    * Creates a new FastShader instance.
    */
-  init() {
-    const gl = this.gl;
+  public init(): void {
+    const { gl } = this;
+    if (!gl) {
+      return;
+    }
     const program = compileProgram(gl, this.vertexSrc, this.fragmentSrc);
+    if (!program) {
+      return;
+    }
     gl.useProgram(program);
     // get and store the uniforms for the shader
     this.uSampler = gl.getUniformLocation(program, 'uSampler');
@@ -105,8 +123,8 @@ export class FastShader {
   /**
    * Destroys this shader and cleans up resources.
    */
-  destroy() {
-    this.gl.deleteProgram(this.program);
+  public destroy(): void {
+    this.gl?.deleteProgram(this.program);
     this.uniforms = null;
     this.gl = null;
     this.attributes = null;

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

@@ -21,25 +21,45 @@ const defaultVertexSrc = [
   '}',
 ];
 
+const glMember = (gl: WebGLRenderingContext, name: string): any => (gl as unknown as Record<string, unknown>)[name];
+
 // this shader is used for the default sprite rendering
 
+export type ShaderUniform = {
+  type: string;
+  value: any;
+  uniformLocation?: WebGLUniformLocation | null;
+  glFunc?: (...args: any[]) => void;
+  glMatrix?: boolean;
+  glValueLength?: number;
+  transpose?: boolean;
+  textureData?: Record<string, any>;
+  _init?: boolean;
+};
+
 export class NormalShader {
-  [key: string]: any;
-  gl!: any;
-  _UID!: any;
-  program!: any;
-  fragmentSrc!: any;
-  vertexSrc!: any;
-  textureCount!: any;
-  firstRun!: any;
-  dirty!: any;
-  uniforms!: any;
-  attributes!: any;
+  public gl: WebGLRenderingContext & { id: number };
+  public _UID: string;
+  public program: WebGLProgram | null;
+  public fragmentSrc: string[];
+  public vertexSrc: string[] | null;
+  public textureCount: number;
+  public firstRun: boolean;
+  public dirty: boolean;
+  public uniforms: Record<string, ShaderUniform>;
+  public attributes: number[];
+  public uSampler!: WebGLUniformLocation | null;
+  public projectionVector!: WebGLUniformLocation | null;
+  public offsetVector!: WebGLUniformLocation | null;
+  public dimensions!: WebGLUniformLocation | null;
+  public aVertexPosition!: number;
+  public aTextureCoord!: number;
+  public colorAttribute!: number;
   /**
    * Creates a new NormalShader instance.
    * @param {WebGLRenderingContext & { id: number }} gl - The WebGL rendering context.
    */
-  constructor(gl: WebGLRenderingContext) {
+  public constructor(gl: WebGLRenderingContext & { id: number }) {
     this.gl = gl;
     this._UID = uuidv4();
     /** @type {WebGLProgram} */
@@ -66,9 +86,12 @@ export class NormalShader {
   /**
    * Destroys this shader and cleans up resources.
    */
-  init() {
-    const gl = this.gl;
-    const program = compileProgram(gl, this.vertexSrc || defaultVertexSrc, this.fragmentSrc);
+  public init(): void {
+    const { gl } = this;
+    const program = compileProgram(gl, this.vertexSrc ?? defaultVertexSrc, this.fragmentSrc);
+    if (!program) {
+      return;
+    }
     gl.useProgram(program);
     // get and store the uniforms for the shader
     this.uSampler = gl.getUniformLocation(program, 'uSampler');
@@ -90,10 +113,9 @@ export class NormalShader {
     this.attributes = [this.aVertexPosition, this.aTextureCoord, this.colorAttribute];
     // End worst hack eva //
     // add those custom shaders!
-    const keys = Object.keys(this.uniforms);
-    for (let i = 0; i < keys.length; i += 1) {
+    for (const [key, uniform] of Object.entries(this.uniforms)) {
       // get the uniform locations..
-      this.uniforms[keys[i]].uniformLocation = gl.getUniformLocation(program, keys[i]);
+      uniform.uniformLocation = gl.getUniformLocation(program, key);
     }
     this.initUniforms();
     this.program = program;
@@ -102,15 +124,11 @@ export class NormalShader {
   /**
    * Binds this shader to the WebGL context.
    */
-  initUniforms() {
+  public initUniforms() {
     this.textureCount = 1;
-    const gl = this.gl;
-    let uniform;
-    const keys = Object.keys(this.uniforms);
-    for (let i = 0; i < keys.length; i += 1) {
-      const key = keys[i];
-      uniform = this.uniforms[key];
-      const type = uniform.type;
+    const { gl } = this;
+    for (const uniform of Object.values(this.uniforms)) {
+      const { type } = uniform;
       if (type === 'sampler2D') {
         uniform._init = false;
         if (uniform.value !== null) {
@@ -129,7 +147,7 @@ export class NormalShader {
         }
       } else {
         //  GL function reference
-        uniform.glFunc = gl[`uniform${type}`];
+        uniform.glFunc = glMember(gl, `uniform${type}`);
         if (type === '2f' || type === '2i') {
           uniform.glValueLength = 2;
         } else if (type === '3f' || type === '3i') {
@@ -147,12 +165,12 @@ export class NormalShader {
    * Sets a uniform value for this shader.
    * @param {object} uniform - The uniform to set.
    */
-  initSampler2D(uniform: any) {
+  public initSampler2D(uniform: any) {
     if (!uniform.value || !uniform.value.baseTexture || !uniform.value.baseTexture.hasLoaded) {
       return;
     }
-    const gl = this.gl;
-    gl.activeTexture(gl[`TEXTURE${this.textureCount}`]);
+    const { gl } = this;
+    gl.activeTexture(glMember(gl, `TEXTURE${this.textureCount}`));
     gl.bindTexture(gl.TEXTURE_2D, uniform.value.baseTexture._glTextures[gl.id]);
     //  Extended texture data
     if (uniform.textureData) {
@@ -165,20 +183,20 @@ export class NormalShader {
       // KeyTexture = whatever + luminance + width 256, height 2, border 0
       //  magFilter can be: gl.LINEAR, gl.LINEAR_MIPMAP_LINEAR or gl.NEAREST
       //  wrapS/T can be: gl.CLAMP_TO_EDGE or gl.REPEAT
-      const magFilter = data.magFilter ? data.magFilter : gl.LINEAR;
-      const minFilter = data.minFilter ? data.minFilter : gl.LINEAR;
-      let wrapS = data.wrapS ? data.wrapS : gl.CLAMP_TO_EDGE;
-      let wrapT = data.wrapT ? data.wrapT : gl.CLAMP_TO_EDGE;
+      const magFilter = data.magFilter ?? gl.LINEAR;
+      const minFilter = data.minFilter ?? gl.LINEAR;
+      let wrapS = data.wrapS ?? gl.CLAMP_TO_EDGE;
+      let wrapT = data.wrapT ?? gl.CLAMP_TO_EDGE;
       const format = data.luminance ? gl.LUMINANCE : gl.RGBA;
       if (data.repeat) {
         wrapS = gl.REPEAT;
         wrapT = gl.REPEAT;
       }
-      gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, !!data.flipY);
+      gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, Boolean(data.flipY));
       if (data.width) {
-        const width = data.width ? data.width : 512;
-        const height = data.height ? data.height : 2;
-        const border = data.border ? data.border : 0;
+        const width = data.width ?? 512;
+        const height = data.height ?? 2;
+        const border = data.border ?? 0;
 
         // void texImage2D(GLenum target, GLint level, GLenum internalformat, GLsizei width, GLsizei height, GLint border, GLenum format, GLenum type, ArrayBufferView? pixels);
         gl.texImage2D(gl.TEXTURE_2D, 0, format, width, height, border, format, gl.UNSIGNED_BYTE, null);
@@ -199,27 +217,23 @@ export class NormalShader {
   /**
    * Sets the shader to use for rendering.
    */
-  syncUniforms() {
+  public syncUniforms() {
     this.textureCount = 1;
-    let uniform;
-    const gl = this.gl;
+    const { gl } = this;
     //  This would probably be faster in an array and it would guarantee key order
-    const keys = Object.keys(this.uniforms);
-    for (let i = 0; i < keys.length; i += 1) {
-      const key = keys[i];
-      uniform = this.uniforms[key];
+    for (const uniform of Object.values(this.uniforms)) {
       if (uniform.glValueLength === 1) {
         if (uniform.glMatrix === true) {
-          uniform.glFunc.call(gl, uniform.uniformLocation, uniform.transpose, uniform.value);
+          uniform.glFunc?.call(gl, uniform.uniformLocation, uniform.transpose, uniform.value);
         } else {
-          uniform.glFunc.call(gl, uniform.uniformLocation, uniform.value);
+          uniform.glFunc?.call(gl, uniform.uniformLocation, uniform.value);
         }
       } else if (uniform.glValueLength === 2) {
-        uniform.glFunc.call(gl, uniform.uniformLocation, uniform.value.x, uniform.value.y);
+        uniform.glFunc?.call(gl, uniform.uniformLocation, uniform.value.x, uniform.value.y);
       } else if (uniform.glValueLength === 3) {
-        uniform.glFunc.call(gl, uniform.uniformLocation, uniform.value.x, uniform.value.y, uniform.value.z);
+        uniform.glFunc?.call(gl, uniform.uniformLocation, uniform.value.x, uniform.value.y, uniform.value.z);
       } else if (uniform.glValueLength === 4) {
-        uniform.glFunc.call(
+        uniform.glFunc?.call(
           gl,
           uniform.uniformLocation,
           uniform.value.x,
@@ -229,15 +243,15 @@ export class NormalShader {
         );
       } else if (uniform.type === 'sampler2D') {
         if (uniform._init) {
-          gl.activeTexture(gl[`TEXTURE${this.textureCount}`]);
+          gl.activeTexture(glMember(gl, `TEXTURE${this.textureCount}`));
           if (uniform.value.baseTexture._dirty[gl.id]) {
-            window.PhaserRegistry.INSTANCES[gl.id].updateTexture(uniform.value.baseTexture);
+            globalThis.PhaserRegistry.INSTANCES[gl.id]?.updateTexture(uniform.value.baseTexture);
           } else {
             // bind the current texture
             gl.bindTexture(gl.TEXTURE_2D, uniform.value.baseTexture._glTextures[gl.id]);
           }
           //  gl.bindTexture(gl.TEXTURE_2D, uniform.value.baseTexture._glTextures[gl.id] || PIXI.createWebGLTexture( uniform.value.baseTexture, gl));
-          gl.uniform1i(uniform.uniformLocation, this.textureCount);
+          gl.uniform1i(uniform.uniformLocation ?? null, this.textureCount);
           this.textureCount += 1;
         } else {
           this.initSampler2D(uniform);
@@ -249,10 +263,9 @@ export class NormalShader {
   /**
    * Destroys this shader and cleans up resources.
    */
-  destroy() {
+  public destroy(): void {
     this.gl.deleteProgram(this.program);
-    this.uniforms = null;
-    this.gl = null;
-    this.attributes = null;
+    this.uniforms = {};
+    this.attributes = [];
   }
 }

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

@@ -4,17 +4,26 @@ import { compileProgram } from '../util.js';
 // the next one is used for rendering primitives
 
 export class PrimitiveShader {
-  [key: string]: any;
-  gl!: any;
-  _UID!: any;
-  program!: any;
-  fragmentSrc!: any;
-  vertexSrc!: any;
+  public gl: WebGLRenderingContext | null;
+  public _UID: string;
+  public program: WebGLProgram | null;
+  public fragmentSrc: string[];
+  public vertexSrc: string[];
+  public projectionVector!: WebGLUniformLocation | null;
+  public offsetVector!: WebGLUniformLocation | null;
+  public tintColor!: WebGLUniformLocation | null;
+  public flipY!: WebGLUniformLocation | null;
+  public translationMatrix!: WebGLUniformLocation | null;
+  public alpha!: WebGLUniformLocation | null;
+  public aVertexPosition!: number;
+  public colorAttribute!: number;
+  public uniforms: unknown = null;
+  public attributes: number[] | null = null;
   /**
    * Creates a new PrimitiveShader instance.
    * @param {WebGLRenderingContext} gl - The WebGL rendering context.
    */
-  constructor(gl: WebGLRenderingContext) {
+  public constructor(gl: WebGLRenderingContext) {
     this.gl = gl;
     this._UID = uuidv4();
     /** @type {WebGLProgram} */
@@ -51,9 +60,15 @@ export class PrimitiveShader {
   /**
    * Destroys this shader and cleans up resources.
    */
-  init() {
-    const gl = this.gl;
+  public init(): void {
+    const { gl } = this;
+    if (!gl) {
+      return;
+    }
     const program = compileProgram(gl, this.vertexSrc, this.fragmentSrc);
+    if (!program) {
+      return;
+    }
     gl.useProgram(program);
     // get and store the uniforms for the shader
     this.projectionVector = gl.getUniformLocation(program, 'projectionVector');
@@ -72,8 +87,8 @@ export class PrimitiveShader {
   /**
    * Binds this shader to the WebGL context.
    */
-  destroy() {
-    this.gl.deleteProgram(this.program);
+  public destroy(): void {
+    this.gl?.deleteProgram(this.program);
     this.uniforms = null;
     this.gl = null;
     this.attributes = null;