@vpmedia/phaser 1.113.0 → 1.115.0

package/src/phaser/display/sprite_util.ts

@@ -4,6 +4,8 @@ import { getTintedTexture } from './canvas/tinter.js';
 import type { Image } from './image.js';
 import type { Texture } from './webgl/texture.js';
 import type { Matrix } from '../geom/matrix.js';
+import type { RenderSession } from './render_session.js';
+import { setSmoothing } from './canvas/util.js';
 
 /**
  * Sets the texture of a sprite.
@@ -27,7 +29,7 @@ export const setTexture = (target: Image, texture: Texture, destroyBase = false)
  * @param {object} matrix - The transformation matrix.
  * @returns {Rectangle} The bounds rectangle.
  */
-export const getBounds = (target: Image, matrix: any | null = null) => {
+export const getBounds = (target: Image, matrix: Matrix | null = null) => {
   // TODO verify
   if (target.currentBounds) {
     return target.currentBounds;
@@ -129,7 +131,7 @@ export const getLocalBounds = (target: Image) => {
  * @param {object} renderSession - The render session object.
  * @param {Matrix | null | undefined} matrix - The transformation matrix.
  */
-export const renderWebGL = (target: Image, renderSession: any, matrix: Matrix | null | undefined = null) => {
+export const renderWebGL = (target: Image, renderSession: RenderSession, matrix: Matrix | null | undefined = null) => {
   // if the sprite is not visible or the alpha is 0 then no need to render this element
   if (!target.visible || target.alpha <= 0 || !target.renderable) {
     return;
@@ -149,7 +151,7 @@ export const renderWebGL = (target: Image, renderSession: any, matrix: Matrix |
     }
     if (target._mask) {
       spriteBatch.stop();
-      renderSession.maskManager.pushMask(target.mask, renderSession);
+      renderSession.maskManager.pushMask(target.mask!, renderSession);
       spriteBatch.start();
     }
     // add this sprite to the batch
@@ -182,7 +184,7 @@ export const renderWebGL = (target: Image, renderSession: any, matrix: Matrix |
  * @param {object} renderSession - The render session object.
  * @param {Matrix | null | undefined} matrix - The transformation matrix.
  */
-export const renderCanvas = (target: Image, renderSession: any, matrix: Matrix | null | undefined = null) => {
+export const renderCanvas = (target: Image, renderSession: RenderSession, matrix: Matrix | null | undefined = null) => {
   // If the sprite is not visible or the alpha is 0 then no need to render this element
   if (
     !target.visible ||
@@ -201,7 +203,7 @@ export const renderCanvas = (target: Image, renderSession: any, matrix: Matrix |
   if (target.blendMode !== renderSession.currentBlendMode) {
     renderSession.currentBlendMode = target.blendMode;
     renderSession.context.globalCompositeOperation =
-      globalThis.PhaserRegistry.blendModesCanvas[renderSession.currentBlendMode];
+      globalThis.PhaserRegistry.blendModesCanvas[renderSession.currentBlendMode] ?? 'source-over';
   }
   if (target._mask) {
     renderSession.maskManager.pushMask(target._mask, renderSession);
@@ -214,7 +216,7 @@ export const renderCanvas = (target: Image, renderSession: any, matrix: Matrix |
     //  If smoothingEnabled is supported and we need to change the smoothing property for this texture
     if (renderSession.smoothProperty && renderSession.scaleMode !== target.texture.baseTexture.scaleMode) {
       renderSession.scaleMode = target.texture.baseTexture.scaleMode;
-      renderSession.context[renderSession.smoothProperty] = renderSession.scaleMode === SCALE_LINEAR;
+      setSmoothing(renderSession.context, renderSession.smoothProperty, renderSession.scaleMode === SCALE_LINEAR);
     }
     //  If the texture is trimmed we offset by the trim x/y, otherwise we use the frame dimensions
     let dx = target.texture.trim
@@ -238,7 +240,7 @@ export const renderCanvas = (target: Image, renderSession: any, matrix: Matrix |
     dx /= resolution;
     dy /= resolution;
     if (target.tint !== 0xffffff) {
-      if (target.texture.requiresReTint || target.cachedTint !== target.tint) {
+      if (target.texture.requiresReTint || target.cachedTint !== target.tint || !target.tintedTexture) {
         target.tintedTexture = getTintedTexture(target, target.tint);
         target.cachedTint = target.tint;
         target.texture.requiresReTint = false;
@@ -267,6 +269,6 @@ export const renderCanvas = (target: Image, renderSession: any, matrix: Matrix |
     child.renderCanvas(renderSession);
   }
   if (target._mask) {
-    renderSession.maskManager.popMask(renderSession);
+    renderSession.maskManager.popMask(target._mask, renderSession);
   }
 };

package/src/phaser/display/text.test.ts

@@ -0,0 +1,136 @@
+import { afterAll, beforeAll, beforeEach, describe, expect, it, vi } from 'vitest';
+import type { Game } from '../core/game.js';
+import { getRegistry } from '../core/registry.js';
+import { Text } from './text.js';
+import { textureFromCanvas } from './webgl/texture_util.js';
+
+// happy-dom has no 2D canvas implementation, so Text cannot be constructed without one. This is the
+// smallest surface updateText() touches.
+const createContext2D = (): CanvasRenderingContext2D =>
+  ({
+    font: '',
+    fillStyle: '',
+    strokeStyle: '',
+    textBaseline: '',
+    lineWidth: 0,
+    lineJoin: '',
+    globalAlpha: 1,
+    measureText: (value: string) => ({
+      width: value.length * 8,
+      actualBoundingBoxAscent: 8,
+      actualBoundingBoxDescent: 2,
+    }),
+    clearRect: vi.fn(),
+    fillRect: vi.fn(),
+    fillText: vi.fn(),
+    strokeText: vi.fn(),
+    save: vi.fn(),
+    restore: vi.fn(),
+    scale: vi.fn(),
+    translate: vi.fn(),
+    setTransform: vi.fn(),
+    getImageData: () => ({ data: new Uint8ClampedArray(4) }),
+    putImageData: vi.fn(),
+  }) as unknown as CanvasRenderingContext2D;
+
+const createGame = (): Game =>
+  ({
+    renderer: { resolution: 1 },
+    cache: { getImage: () => null },
+    add: { existing: (child: unknown) => child },
+  }) as unknown as Game;
+
+const createText = (value: string | number): Text => new Text(createGame(), 0, 0, value);
+
+describe('Text', () => {
+  const originalGetContext = HTMLCanvasElement.prototype.getContext;
+
+  beforeAll(() => {
+    HTMLCanvasElement.prototype.getContext = function getContext(this: HTMLCanvasElement, id: string) {
+      return id === '2d' ? createContext2D() : null;
+    } as typeof HTMLCanvasElement.prototype.getContext;
+  });
+
+  beforeEach(() => {
+    getRegistry().CACHE_MISSING_IMAGE = textureFromCanvas(document.createElement('canvas'));
+  });
+
+  afterAll(() => {
+    HTMLCanvasElement.prototype.getContext = originalGetContext;
+  });
+
+  describe('constructor', () => {
+    it('keeps a string as-is', () => {
+      expect(createText('hello').text).toBe('hello');
+    });
+
+    // Callers pass numbers straight into game.add.text(). The constructor must coerce:
+    // updateText() calls .split() on the value, which throws on a number.
+    it('coerces a number to its string form', () => {
+      expect(createText(42).text).toBe('42');
+    });
+
+    it('coerces zero rather than falling back to the empty string', () => {
+      expect(createText(0).text).toBe('0');
+    });
+
+    it('coerces a negative number', () => {
+      expect(createText(-7).text).toBe('-7');
+    });
+
+    it('defaults to the empty string', () => {
+      expect(new Text(createGame(), 0, 0).text).toBe('');
+    });
+
+    it('renders a numeric label without throwing', () => {
+      expect(() => createText(2026)).not.toThrow();
+    });
+  });
+
+  describe('text setter', () => {
+    it('coerces a number assigned after construction', () => {
+      const text = createText('start');
+      text.text = 99;
+      expect(text.text).toBe('99');
+    });
+  });
+
+  describe('fontSize', () => {
+    // A px-suffixed size cannot be read with Number(); it yields NaN. An autofix made exactly that
+    // substitution once already.
+    it('reads a px size back as a number', () => {
+      const text = new Text(createGame(), 0, 0, 'hello', { font: '20px Arial' });
+      expect(text.fontSize).toBe(20);
+    });
+
+    it('round trips through the setter', () => {
+      const text = createText('hello');
+      text.fontSize = 32;
+      expect(text.fontSize).toBe(32);
+    });
+
+    it('reads zero back as zero', () => {
+      const text = createText('hello');
+      text.fontSize = 0;
+      expect(text.fontSize).toBe(0);
+    });
+
+    it('never reports NaN for a styled font', () => {
+      const text = new Text(createGame(), 0, 0, 'hello', { font: 'bold 14px Arial' });
+      expect(Number.isNaN(text.fontSize)).toBe(false);
+    });
+  });
+
+  describe('setText', () => {
+    it('coerces a number', () => {
+      const text = createText('start');
+      text.setText(123);
+      expect(text.text).toBe('123');
+    });
+
+    it('returns itself for chaining', () => {
+      const text = createText('start');
+      expect(text.setText('next')).toBe(text);
+    });
+  });
+});