@vpmedia/phaser 1.112.0 → 1.113.0

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

@@ -0,0 +1,148 @@
+import { describe, expect, it, vi } from 'vitest';
+import { ComplexPrimitiveShader } from './complex.js';
+import { FastShader } from './fast.js';
+import { PrimitiveShader } from './primitive.js';
+import { StripShader } from './strip.js';
+
+type StubOptions = {
+  linkStatus?: boolean;
+  program?: object | null;
+  attribLocations?: Record<string, number>;
+};
+
+const createStubGl = (options: StubOptions = {}) => {
+  const { linkStatus = true, program = {}, attribLocations = {} } = options;
+  const uniformLocations = new Map<string, object>();
+  const deleteProgram = vi.fn();
+  const useProgram = vi.fn();
+  const gl = {
+    VERTEX_SHADER: 1,
+    FRAGMENT_SHADER: 2,
+    COMPILE_STATUS: 3,
+    LINK_STATUS: 4,
+    createShader: vi.fn(() => ({})),
+    shaderSource: vi.fn(),
+    compileShader: vi.fn(),
+    getShaderParameter: vi.fn(() => true),
+    getShaderInfoLog: vi.fn(() => ''),
+    createProgram: vi.fn(() => program),
+    attachShader: vi.fn(),
+    linkProgram: vi.fn(),
+    getProgramParameter: vi.fn(() => linkStatus),
+    getProgramInfoLog: vi.fn(() => 'link failed'),
+    useProgram,
+    deleteProgram,
+    getUniformLocation: vi.fn((_program: unknown, name: string) => {
+      if (!uniformLocations.has(name)) {
+        uniformLocations.set(name, { name });
+      }
+      return uniformLocations.get(name);
+    }),
+    getAttribLocation: vi.fn((_program: unknown, name: string) => attribLocations[name] ?? 0),
+  } as unknown as WebGLRenderingContext;
+  return { gl, deleteProgram, useProgram };
+};
+
+describe('WebGL shaders', () => {
+  describe('PrimitiveShader', () => {
+    it('resolves its uniforms and attributes on construction', () => {
+      const { gl } = createStubGl({ attribLocations: { aVertexPosition: 0, aColor: 1 } });
+      const shader = new PrimitiveShader(gl);
+      expect(shader.program).not.toBeNull();
+      expect(shader.projectionVector).toBeDefined();
+      expect(shader.attributes).toStrictEqual([0, 1]);
+    });
+
+    it('releases the program on destroy', () => {
+      const { gl, deleteProgram } = createStubGl();
+      const shader = new PrimitiveShader(gl);
+      shader.destroy();
+      expect(deleteProgram).toHaveBeenCalledWith(shader.program);
+      expect(shader.attributes).toBeNull();
+      expect(shader.gl).toBeNull();
+    });
+
+    it('leaves the program null when compilation fails', () => {
+      const { gl, useProgram } = createStubGl({ program: null });
+      const shader = new PrimitiveShader(gl);
+      expect(shader.program).toBeNull();
+      expect(useProgram).not.toHaveBeenCalled();
+    });
+
+    it('destroys cleanly after a failed compile', () => {
+      const { gl } = createStubGl({ program: null });
+      const shader = new PrimitiveShader(gl);
+      expect(() => {
+        shader.destroy();
+      }).not.toThrow();
+    });
+  });
+
+  describe('StripShader', () => {
+    it('resolves its uniforms and attributes on construction', () => {
+      const { gl } = createStubGl({
+        attribLocations: { aVertexPosition: 0, aTextureCoord: 1, aColor: 2 },
+      });
+      const shader = new StripShader(gl);
+      expect(shader.attributes).toStrictEqual([0, 1]);
+      expect(shader.uSampler).toBeDefined();
+      expect(shader.translationMatrix).toBeDefined();
+    });
+
+    it('clears its attributes on destroy', () => {
+      const { gl } = createStubGl();
+      const shader = new StripShader(gl);
+      shader.destroy();
+      expect(shader.attributes).toBeNull();
+    });
+  });
+
+  describe('ComplexPrimitiveShader', () => {
+    it('resolves the uniforms it declares', () => {
+      const { gl } = createStubGl();
+      const shader = new ComplexPrimitiveShader(gl);
+      expect(shader.tintColor).toBeDefined();
+      expect(shader.color).toBeDefined();
+      expect(shader.flipY).toBeDefined();
+    });
+
+    it('leaves colorAttribute unresolved, as the shader never reads aColor', () => {
+      const { gl } = createStubGl();
+      const shader = new ComplexPrimitiveShader(gl);
+      expect(shader.colorAttribute).toBeUndefined();
+      expect(shader.attributes).toStrictEqual([0, undefined]);
+    });
+  });
+
+  describe('FastShader', () => {
+    it('resolves the full attribute set in batch order', () => {
+      const { gl } = createStubGl({
+        attribLocations: {
+          aVertexPosition: 0,
+          aPositionCoord: 1,
+          aScale: 2,
+          aRotation: 3,
+          aTextureCoord: 4,
+          aColor: 5,
+        },
+      });
+      const shader = new FastShader(gl);
+      expect(shader.attributes).toStrictEqual([0, 1, 2, 3, 4, 5]);
+    });
+
+    it('falls back to slot 2 when the driver reports aColor as -1', () => {
+      const { gl } = createStubGl({ attribLocations: { aColor: -1 } });
+      const shader = new FastShader(gl);
+      expect(shader.colorAttribute).toBe(2);
+    });
+
+    it('releases the program and buffers on destroy', () => {
+      const { gl, deleteProgram } = createStubGl();
+      const shader = new FastShader(gl);
+      shader.destroy();
+      expect(deleteProgram).toHaveBeenCalled();
+      expect(shader.gl).toBeNull();
+      expect(shader.attributes).toBeNull();
+    });
+  });
+});

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

@@ -4,17 +4,26 @@ import { compileProgram } from '../util.js';
 // the next one is used for rendering triangle strips
 
 export class StripShader {
-  [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 uSampler!: WebGLUniformLocation | null;
+  public projectionVector!: WebGLUniformLocation | null;
+  public offsetVector!: WebGLUniformLocation | null;
+  public translationMatrix!: WebGLUniformLocation | null;
+  public alpha!: WebGLUniformLocation | null;
+  public colorAttribute!: number;
+  public aVertexPosition!: number;
+  public aTextureCoord!: number;
+  public uniforms: unknown = null;
+  public attributes: number[] | null = null;
   /**
    * Creates a new StripShader instance.
    * @param {WebGLRenderingContext} gl - The WebGL rendering context.
    */
-  constructor(gl: WebGLRenderingContext) {
+  public constructor(gl: WebGLRenderingContext) {
     this.gl = gl;
     this._UID = uuidv4();
     /** @type {WebGLProgram} */
@@ -55,9 +64,15 @@ export class StripShader {
   /**
    * 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.uSampler = gl.getUniformLocation(program, 'uSampler');
@@ -77,10 +92,10 @@ export class StripShader {
   /**
    * 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_manager.test.ts

@@ -0,0 +1,124 @@
+import { describe, expect, it, vi } from 'vitest';
+import type { NormalShader } from './shader/normal.js';
+import type { IdentifiedWebGLRenderingContext } from './util.js';
+import { WebGLShaderManager } from './shader_manager.js';
+
+const createGlMocks = () => ({
+  enableVertexAttribArray: vi.fn(),
+  disableVertexAttribArray: vi.fn(),
+  useProgram: vi.fn(),
+});
+
+type GlMocks = ReturnType<typeof createGlMocks>;
+
+const createManager = (): { manager: WebGLShaderManager; gl: GlMocks } => {
+  const gl = createGlMocks();
+  const manager = new WebGLShaderManager();
+  manager.gl = { id: 0, ...gl } as unknown as IdentifiedWebGLRenderingContext;
+  return { manager, gl };
+};
+
+const shaderStub = (uid: string, attributes: number[]): NormalShader =>
+  ({ _UID: uid, program: {}, attributes }) as unknown as NormalShader;
+
+describe('WebGLShaderManager', () => {
+  describe('constructor', () => {
+    it('starts with ten disabled attribute slots', () => {
+      const manager = new WebGLShaderManager();
+      expect(manager.attribState).toHaveLength(10);
+      expect(manager.attribState.every((enabled) => enabled === false)).toBe(true);
+    });
+  });
+
+  describe('setAttribs', () => {
+    it('enables exactly the requested attribute slots', () => {
+      const { manager, gl } = createManager();
+      manager.setAttribs([0, 2]);
+      expect(gl.enableVertexAttribArray).toHaveBeenCalledTimes(2);
+      expect(gl.enableVertexAttribArray).toHaveBeenCalledWith(0);
+      expect(gl.enableVertexAttribArray).toHaveBeenCalledWith(2);
+    });
+
+    it('only touches slots whose state actually changed', () => {
+      const { manager, gl } = createManager();
+      manager.setAttribs([0, 1]);
+      vi.clearAllMocks();
+      manager.setAttribs([0, 1]);
+      expect(gl.enableVertexAttribArray).not.toHaveBeenCalled();
+      expect(gl.disableVertexAttribArray).not.toHaveBeenCalled();
+    });
+
+    it('disables slots dropped between calls', () => {
+      const { manager, gl } = createManager();
+      manager.setAttribs([0, 1, 2]);
+      vi.clearAllMocks();
+      manager.setAttribs([0]);
+      expect(gl.disableVertexAttribArray).toHaveBeenCalledWith(1);
+      expect(gl.disableVertexAttribArray).toHaveBeenCalledWith(2);
+      expect(gl.enableVertexAttribArray).not.toHaveBeenCalled();
+    });
+
+    it('mirrors the sparse temp state, leaving untouched slots unset', () => {
+      const { manager } = createManager();
+      manager.setAttribs([1, 3]);
+      expect(manager.attribState.slice(0, 4)).toStrictEqual([undefined, true, undefined, true]);
+    });
+
+    it('disables the previously enabled slots when given no attributes', () => {
+      const { manager, gl } = createManager();
+      manager.setAttribs([0, 1]);
+      vi.clearAllMocks();
+      manager.setAttribs([]);
+      expect(gl.disableVertexAttribArray).toHaveBeenCalledWith(0);
+      expect(gl.disableVertexAttribArray).toHaveBeenCalledWith(1);
+      expect(manager.attribState[0]).toBe(false);
+      expect(manager.attribState[1]).toBe(false);
+    });
+  });
+
+  describe('setShader', () => {
+    it('binds a new shader and reports that it switched', () => {
+      const { manager, gl } = createManager();
+      const shader = shaderStub('a', [0, 1]);
+      expect(manager.setShader(shader)).toBe(true);
+      expect(manager.currentShader).toBe(shader);
+      expect(gl.useProgram).toHaveBeenCalledWith(shader.program);
+    });
+
+    it('skips rebinding the shader already in use', () => {
+      const { manager, gl } = createManager();
+      const shader = shaderStub('a', [0, 1]);
+      manager.setShader(shader);
+      vi.clearAllMocks();
+      expect(manager.setShader(shader)).toBe(false);
+      expect(gl.useProgram).not.toHaveBeenCalled();
+    });
+
+    it('rebinds when a different shader is supplied', () => {
+      const { manager } = createManager();
+      manager.setShader(shaderStub('a', [0]));
+      const next = shaderStub('b', [0, 1]);
+      expect(manager.setShader(next)).toBe(true);
+      expect(manager.currentShader).toBe(next);
+    });
+  });
+
+  describe('destroy', () => {
+    it('clears attribute state and forgets the current shader', () => {
+      const { manager } = createManager();
+      manager.setShader(shaderStub('a', [0]));
+      manager.destroy();
+      expect(manager.attribState).toStrictEqual([]);
+      expect(manager.tempAttribState).toStrictEqual([]);
+      expect(manager.currentShader).toBeNull();
+      expect(manager._currentId).toBeNull();
+    });
+
+    it('tolerates shaders that were never created', () => {
+      const { manager } = createManager();
+      expect(() => {
+        manager.destroy();
+      }).not.toThrow();
+    });
+  });
+});

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

@@ -6,28 +6,22 @@ import { StripShader } from './shader/strip.js';
 import type { IdentifiedWebGLRenderingContext } from './util.js';
 
 export class WebGLShaderManager {
-  [key: string]: any;
-  gl!: any;
-  primitiveShader!: any;
-  complexPrimitiveShader!: any;
-  defaultShader!: any;
-  fastShader!: any;
-  stripShader!: any;
-  maxAttibs!: any;
-  attribState!: any;
-  tempAttribState!: any;
-  stack!: any;
+  public gl!: IdentifiedWebGLRenderingContext;
+  public primitiveShader: PrimitiveShader | null = null;
+  public complexPrimitiveShader: ComplexPrimitiveShader | null = null;
+  public defaultShader: NormalShader | null = null;
+  public fastShader: FastShader | null = null;
+  public stripShader: StripShader | null = null;
+  public maxAttibs = 10;
+  public attribState: (boolean | undefined)[];
+  public tempAttribState: (boolean | undefined)[];
+  public stack: NormalShader[];
+  public currentShader: NormalShader | null = null;
+  public _currentId: string | null = null;
   /**
    * Initializes the shader manager with a WebGL context.
    */
-  constructor() {
-    this.gl = null;
-    this.primitiveShader = null;
-    this.complexPrimitiveShader = null;
-    this.defaultShader = null;
-    this.fastShader = null;
-    this.stripShader = null;
-    this.maxAttibs = 10;
+  public constructor() {
     this.attribState = [];
     this.tempAttribState = [];
     for (let i = 0; i < this.maxAttibs; i += 1) {
@@ -40,7 +34,7 @@ export class WebGLShaderManager {
    * Initializes the shader manager with a WebGL context.
    * @param {WebGLRenderingContext & { id: number }} gl - The WebGL rendering context.
    */
-  setContext(gl: IdentifiedWebGLRenderingContext) {
+  public setContext(gl: IdentifiedWebGLRenderingContext) {
     this.gl = gl;
     this.primitiveShader = new PrimitiveShader(gl);
     this.complexPrimitiveShader = new ComplexPrimitiveShader(gl);
@@ -54,18 +48,17 @@ export class WebGLShaderManager {
    * Sets up the shader manager for WebGL rendering.
    * @param {number[]} attribs - The attribute locations to set up.
    */
-  setAttribs(attribs: number[]) {
+  public setAttribs(attribs: number[]) {
     // reset temp state
     let i;
     for (i = 0; i < this.tempAttribState.length; i += 1) {
       this.tempAttribState[i] = false;
     }
     // set the new attribs
-    for (i = 0; i < attribs.length; i += 1) {
-      const attribId = attribs[i];
+    for (const attribId of attribs) {
       this.tempAttribState[attribId] = true;
     }
-    const gl = this.gl;
+    const { gl } = this;
     for (i = 0; i < this.attribState.length; i += 1) {
       if (this.attribState[i] !== this.tempAttribState[i]) {
         this.attribState[i] = this.tempAttribState[i];
@@ -83,7 +76,7 @@ export class WebGLShaderManager {
    * @param {NormalShader} shader - The shader to set up.
    * @returns {boolean} Whether the shader setup was successful.
    */
-  setShader(shader: NormalShader) {
+  public setShader(shader: NormalShader): boolean {
     if (this._currentId === shader._UID) {
       return false;
     }
@@ -97,16 +90,15 @@ export class WebGLShaderManager {
   /**
    * Destroys the manager.
    */
-  destroy() {
-    this.attribState = null;
-    this.tempAttribState = null;
+  public destroy(): void {
+    this.attribState = [];
+    this.tempAttribState = [];
     this.currentShader = null;
     this._currentId = null;
-    this.primitiveShader.destroy();
-    this.complexPrimitiveShader.destroy();
-    this.defaultShader.destroy();
-    this.fastShader.destroy();
-    this.stripShader.destroy();
-    this.gl = null;
+    this.primitiveShader?.destroy();
+    this.complexPrimitiveShader?.destroy();
+    this.defaultShader?.destroy();
+    this.fastShader?.destroy();
+    this.stripShader?.destroy();
   }
 }