@vpmedia/phaser 1.123.0 → 1.125.0

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

@@ -1,7 +1,6 @@
 export class WebGLBlendModeManager {
-  [key: string]: any;
-  public gl: any = null;
-  public currentBlendMode: any = 99_999;
+  public gl!: WebGLRenderingContext;
+  public currentBlendMode = 99_999;
   /**
    * Creates a new BlendModeManager instance.
    */
@@ -26,7 +25,7 @@ export class WebGLBlendModeManager {
     this.currentBlendMode = blendMode;
     const blendModeWebGL = globalThis.PhaserRegistry.blendModesWebGL[this.currentBlendMode];
     if (blendModeWebGL) {
-      this.gl.blendFunc(blendModeWebGL[0], blendModeWebGL[1]);
+      this.gl.blendFunc(blendModeWebGL[0]!, blendModeWebGL[1]!);
     }
     return true;
   }
@@ -35,6 +34,6 @@ export class WebGLBlendModeManager {
    * Sets the blend mode for the WebGL context.
    */
   public destroy(): void {
-    this.gl = null;
+    this.gl = null!;
   }
 }

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/earcut.ts

@@ -8,10 +8,11 @@ import { Node } from './earcut_node.js';
 export function sortLinked(list: Node | null): Node | null {
   let numMerges;
   let inSize = 1;
+  let sorted = list;
   do {
-    let p: Node | null = list;
+    let p: Node | null = sorted;
     let tail: Node | null = null;
-    list = null;
+    sorted = null;
     numMerges = 0;
     while (p) {
       numMerges += 1;
@@ -55,7 +56,7 @@ export function sortLinked(list: Node | null): Node | null {
         if (tail) {
           tail.nextZ = e;
         } else {
-          list = e;
+          sorted = e;
         }
         e.prevZ = tail;
         tail = e;
@@ -67,7 +68,7 @@ export function sortLinked(list: Node | null): Node | null {
     }
     inSize *= 2;
   } while (numMerges > 1);
-  return list;
+  return sorted;
 }
 
 /**
@@ -91,17 +92,17 @@ export function compareX(a: Node, b: Node): number {
  */
 export function zOrder(x: number, y: number, minX: number, minY: number, size: number): number {
   // coords are transformed into non-negative 15-bit integer range
-  x = (32_767 * (x - minX)) / size;
-  y = (32_767 * (y - minY)) / size;
-  x = (x | (x << 8)) & 0x00ff00ff;
-  x = (x | (x << 4)) & 0x0f0f0f0f;
-  x = (x | (x << 2)) & 0x33333333;
-  x = (x | (x << 1)) & 0x55555555;
-  y = (y | (y << 8)) & 0x00ff00ff;
-  y = (y | (y << 4)) & 0x0f0f0f0f;
-  y = (y | (y << 2)) & 0x33333333;
-  y = (y | (y << 1)) & 0x55555555;
-  return x | (y << 1);
+  let ix = (32_767 * (x - minX)) / size;
+  let iy = (32_767 * (y - minY)) / size;
+  ix = (ix | (ix << 8)) & 0x00ff00ff;
+  ix = (ix | (ix << 4)) & 0x0f0f0f0f;
+  ix = (ix | (ix << 2)) & 0x33333333;
+  ix = (ix | (ix << 1)) & 0x55555555;
+  iy = (iy | (iy << 8)) & 0x00ff00ff;
+  iy = (iy | (iy << 4)) & 0x0f0f0f0f;
+  iy = (iy | (iy << 2)) & 0x33333333;
+  iy = (iy | (iy << 1)) & 0x55555555;
+  return ix | (iy << 1);
 }
 
 /**
@@ -446,7 +447,7 @@ export function filterPoints(start: Node | null, end?: Node | null): Node | null
   if (!start) {
     return start;
   }
-  end ??= start;
+  let last = end ?? start;
   let p = start;
   let again;
   do {
@@ -454,7 +455,7 @@ export function filterPoints(start: Node | null, end?: Node | null): Node | null
     if (!p.steiner && (equals(p, p.next) || area(p.prev, p, p.next) === 0)) {
       removeNode(p);
       p = p.prev;
-      end = p;
+      last = p;
       if (p === p.next) {
         return null;
       }
@@ -462,8 +463,8 @@ export function filterPoints(start: Node | null, end?: Node | null): Node | null
     } else {
       p = p.next;
     }
-  } while (again || p !== end);
-  return end;
+  } while (again || p !== last);
+  return last;
 }
 
 /**
@@ -567,14 +568,15 @@ export function eliminateHoles(
   }
   queue.sort(compareX);
   // process holes from left to right
+  let outer = outerNode;
   for (i = 0; i < queue.length; i += 1) {
-    if (!outerNode) {
-      return outerNode;
+    if (!outer) {
+      return outer;
     }
-    eliminateHole(queue[i]!, outerNode);
-    outerNode = filterPoints(outerNode, outerNode.next);
+    eliminateHole(queue[i]!, outer);
+    outer = filterPoints(outer, outer.next);
   }
-  return outerNode;
+  return outer;
 }
 
 /**
@@ -586,6 +588,7 @@ export function eliminateHoles(
  */
 export function cureLocalIntersections(start: Node, triangles: number[], dim: number): Node {
   let p = start;
+  let first = start;
   do {
     const a = p.prev;
     const b = p.next.next;
@@ -598,10 +601,10 @@ export function cureLocalIntersections(start: Node, triangles: number[], dim: nu
       removeNode(p);
       removeNode(p.next);
       p = b;
-      start = p;
+      first = p;
     }
     p = p.next;
-  } while (p !== start);
+  } while (p !== first);
   return p;
 }
 
@@ -659,40 +662,41 @@ export function earcutLinked(
   if (!ear) {
     return;
   }
+  let current = ear;
   // interlink polygon nodes in z-order
-  if (!pass && size) {
-    indexCurve(ear, minX, minY, size);
+  if (pass === undefined && size !== undefined) {
+    indexCurve(current, minX, minY, size);
   }
-  let stop = ear;
+  let stop = current;
   let prev;
   let next;
   // iterate through ears, slicing them one by one
-  while (ear.prev !== ear.next) {
-    ({ prev, next } = ear);
-    if (size ? isEarHashed(ear, minX, minY, size) : isEar(ear)) {
+  while (current.prev !== current.next) {
+    ({ prev, next } = current);
+    if (size === undefined ? isEar(current) : isEarHashed(current, minX, minY, size)) {
       // cut off the triangle
       triangles.push(prev.i / dim);
-      triangles.push(ear.i / dim);
+      triangles.push(current.i / dim);
       triangles.push(next.i / dim);
-      removeNode(ear);
+      removeNode(current);
       // skipping the next vertice leads to less sliver triangles
-      ear = next.next;
+      current = next.next;
       stop = next.next;
       continue;
     }
-    ear = next;
+    current = next;
     // if we looped through the whole remaining polygon and can't find any more ears
-    if (ear === stop) {
+    if (current === stop) {
       // try filtering points and slicing again
-      if (!pass) {
-        earcutLinked(filterPoints(ear), triangles, dim, minX, minY, size, 1);
+      if (pass === undefined) {
+        earcutLinked(filterPoints(current), triangles, dim, minX, minY, size, 1);
         // if this didn't work, try curing all small self-intersections locally
       } else if (pass === 1) {
-        ear = cureLocalIntersections(ear, triangles, dim);
-        earcutLinked(ear, triangles, dim, minX, minY, size, 2);
+        current = cureLocalIntersections(current, triangles, dim);
+        earcutLinked(current, triangles, dim, minX, minY, size, 2);
         // as a last resort, try splitting the remaining polygon into two
       } else if (pass === 2) {
-        splitEarcut(ear, triangles, dim, minX, minY, size);
+        splitEarcut(current, triangles, dim, minX, minY, size);
       }
       break;
     }

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);
@@ -471,7 +471,7 @@ export const buildPoly = (graphicsData: DisplayGraphicsData, webGLData: Graphics
   const g = color[1] * alpha;
   const b = color[2] * alpha;
   const triangles = triangulate(points, null, 2);
-  if (!triangles) {
+  if (triangles.length === 0) {
     return false;
   }
   const vertPos = verts.length / 6;

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.
@@ -74,7 +75,7 @@ export class WebGLRenderer {
       alpha: Boolean(game.config.transparent),
       depth: false,
       antialias: game.config.antialias,
-      premultipliedAlpha: game.config.transparent && game.config.transparent !== 'notMultiplied',
+      premultipliedAlpha: game.config.transparent !== false && game.config.transparent !== 'notMultiplied',
       stencil: true,
       failIfMajorPerformanceCaveat: false,
       preserveDrawingBuffer: game.config.preserveDrawingBuffer,
@@ -110,7 +111,7 @@ export class WebGLRenderer {
     this.shaderManager.destroy();
     this.spriteBatch.destroy();
     this.filterManager.destroy();
-    if (this.gl) {
+    if (this.gl as IdentifiedWebGLRenderingContext | undefined) {
       this.gl.canvas.width = 1;
       this.gl.canvas.height = 1;
       const loseContextExt = this.gl.getExtension('WEBGL_lose_context');
@@ -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();
   }
@@ -288,7 +289,7 @@ export class WebGLRenderer {
    * Maps blend modes to WebGL rendering operations.
    */
   public mapBlendModes(): void {
-    if (globalThis.PhaserRegistry.blendModesWebGL) {
+    if (globalThis.PhaserRegistry.blendModesWebGL as number[][] | undefined) {
       return;
     }
     const { gl } = this;