@vpmedia/phaser 1.46.0 → 1.49.0

package/README.md

@@ -1,6 +1,6 @@
 # @vpmedia/phaser
 
-[![npm version](https://badge.fury.io/js/@vpmedia%2Fphaser.svg?v=1.46.0)](https://badge.fury.io/js/@vpmedia%2Fphaser)
+[![npm version](https://badge.fury.io/js/@vpmedia%2Fphaser.svg?v=1.49.0)](https://badge.fury.io/js/@vpmedia%2Fphaser)
 [![Node.js CI](https://github.com/vpmedia/phaser/actions/workflows/ci.yml/badge.svg)](https://github.com/vpmedia/phaser/actions/workflows/ci.yml)
 
 @vpmedia/phaser is the modern ECMAScript port of the popular Phaser game engine v2.6.2.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vpmedia/phaser",
-  "version": "1.46.0",
+  "version": "1.49.0",
   "description": "@vpmedia/phaser is the modern ECMAScript port of the popular Phaser game engine v2.6.2",
   "author": "Andras Csizmadia <andras@vpmedia.hu> (www.vpmedia.hu)",
   "license": "MIT",
@@ -23,16 +23,16 @@
   "types": "./types/index.d.ts",
   "type": "module",
   "devDependencies": {
-    "@eslint/js": "^9.12.0",
+    "@eslint/js": "^9.14.0",
     "@jest/globals": "^29.7.0",
-    "@types/jest": "^29.5.13",
-    "eslint": "^9.12.0",
-    "eslint-plugin-jsdoc": "^50.3.1",
+    "@types/jest": "^29.5.14",
+    "eslint": "^9.14.0",
+    "eslint-plugin-jsdoc": "^50.4.3",
     "eslint-plugin-unicorn": "^56.0.0",
-    "globals": "^15.11.0",
+    "globals": "^15.12.0",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
-    "lefthook": "^1.7.18",
+    "lefthook": "^1.8.2",
     "prettier": "^3.3.3",
     "typescript": "^5.6.3"
   },

package/src/index.js

@@ -39,4 +39,3 @@ export { Graphics } from './phaser/display/graphics.js';
 export { Group } from './phaser/display/group.js';
 export { Image } from './phaser/display/image.js';
 export { Text } from './phaser/display/text.js';
-

package/src/phaser/core/animation_parser.js

@@ -37,7 +37,7 @@ export function spriteSheet(game, key, frameWidth, frameHeight, frameMax, margin
   //  Zero or smaller than frame sizes?
   if (width === 0 || height === 0 || width < frameWidth || height < frameHeight || total === 0) {
     console.warn(
-      `AnimationParser.spriteSheet: '${  key  }'s width/height zero or width/height < given frameWidth/frameHeight`
+      `AnimationParser.spriteSheet: '${key}'s width/height zero or width/height < given frameWidth/frameHeight`
     );
     return null;
   }

package/src/phaser/core/game.js

@@ -146,11 +146,18 @@ export class Game {
       } catch (e) {
         isWebGlReady = false;
         const tags = {};
+        /** @type {WebGLRenderer} */
+        // @ts-ignore
+        const renderer = this.renderer;
+        if (renderer.gl) {
+          tags['webgl.error'] = renderer.gl.getError();
+          tags['webgl.context_lost'] = renderer.gl.isContextLost();
+        }
         if (window.PhaserRegistry?.GL_PROGRAM_INFO_LOG) {
-          tags.gl_program_log = window.PhaserRegistry.GL_PROGRAM_INFO_LOG;
+          tags['webgl.program_log'] = window.PhaserRegistry.GL_PROGRAM_INFO_LOG;
         }
         if (window.PhaserRegistry?.GL_SHADER_INFO_LOG) {
-          tags.gl_shader_log = window.PhaserRegistry.GL_SHADER_INFO_LOG;
+          tags['webgl.shader_log'] = window.PhaserRegistry.GL_SHADER_INFO_LOG;
         }
         this.exceptionHandler(e, tags);
       }

package/src/phaser/core/input.js

@@ -162,13 +162,13 @@ export class Input {
    */
   addPointer() {
     if (this.pointers.length >= MAX_POINTERS) {
-      console.warn(`Input.addPointer: Maximum limit of ${  MAX_POINTERS  } pointers reached.`);
+      console.warn(`Input.addPointer: Maximum limit of ${MAX_POINTERS} pointers reached.`);
       return null;
     }
     const id = this.pointers.length + 1;
     const pointer = new Pointer(this.game, id, POINTER_CONTACT);
     this.pointers.push(pointer);
-    this[`pointer${  id}`] = pointer;
+    this[`pointer${id}`] = pointer;
     return pointer;
   }
 

package/src/phaser/core/loader.js

@@ -163,14 +163,14 @@ export class Loader {
    */
   addToFileList(type, key = '', url = null, properties = null, overwrite = false, extension = null) {
     if (key === undefined || key === '') {
-      console.warn(`Loader: Invalid or no key given of type ${  type}`);
+      console.warn(`Loader: Invalid or no key given of type ${type}`);
       return this;
     }
     if (url === undefined || url === null) {
       if (extension) {
         url = key + extension;
       } else {
-        console.warn(`Loader: No URL given for file type: ${  type  } key: ${  key}`);
+        console.warn(`Loader: No URL given for file type: ${type} key: ${key}`);
         return this;
       }
     }
@@ -376,12 +376,12 @@ export class Loader {
     }
     this.audio(key, urls, autoDecode);
     if (jsonURL) {
-      this.json(`${key  }-audioatlas`, jsonURL);
+      this.json(`${key}-audioatlas`, jsonURL);
     } else if (jsonData) {
       if (typeof jsonData === 'string') {
         jsonData = JSON.parse(jsonData);
       }
-      this.cache.addJSON(`${key  }-audioatlas`, '', jsonData);
+      this.cache.addJSON(`${key}-audioatlas`, '', jsonData);
     }
     return this;
   }
@@ -399,10 +399,10 @@ export class Loader {
    */
   bitmapFont(key, textureURL = null, atlasURL = null, atlasData = null, xSpacing = 0, ySpacing = 0) {
     if (textureURL === undefined || textureURL === null) {
-      textureURL = `${key  }.png`;
+      textureURL = `${key}.png`;
     }
     if (atlasURL === null && atlasData === null) {
-      atlasURL = `${key  }.xml`;
+      atlasURL = `${key}.xml`;
     }
     //  A URL to a json/xml atlas has been given
     if (atlasURL) {
@@ -441,10 +441,10 @@ export class Loader {
    */
   atlas(key, textureURL, atlasURL = null, atlasData = null, format = TEXTURE_ATLAS_JSON_HASH) {
     if (textureURL === undefined || textureURL === null) {
-      textureURL = `${key  }.png`;
+      textureURL = `${key}.png`;
     }
     if (!atlasURL && !atlasData) {
-      atlasURL = `${key  }.json`;
+      atlasURL = `${key}.json`;
     }
     //  A URL to a json/xml file has been given
     if (atlasURL) {
@@ -936,7 +936,7 @@ export class Loader {
     if (!reason && xhr) {
       reason = xhr.status;
     }
-    const message = `Error loading asset (${  reason  })`;
+    const message = `Error loading asset (${reason})`;
     this.asyncComplete(file, message);
   }
 
@@ -976,7 +976,7 @@ export class Loader {
           if (file.format === TEXTURE_ATLAS_JSON_HASH) {
             this.xhrLoad(file, this.transformUrl(file.atlasURL, file), 'text', this.jsonLoadComplete);
           } else {
-            throw new Error(`Invalid Texture Atlas format: ${  file.format}`);
+            throw new Error(`Invalid Texture Atlas format: ${file.format}`);
           }
         }
         break;
@@ -1068,7 +1068,7 @@ export class Loader {
     const xml = this.parseXml(data);
     if (!xml) {
       const responseType = xhr.responseType || xhr.contentType; // contentType for MS-XDomainRequest
-      console.warn(`Loader - ${  file.key  }: invalid XML (${  responseType  })`);
+      console.warn(`Loader - ${file.key}: invalid XML (${responseType})`);
       this.asyncComplete(file, 'invalid XML');
       return;
     }

package/src/phaser/core/scale_manager.js

@@ -552,10 +552,10 @@ export class ScaleManager {
         const offset = targetEdge - currentEdge;
         margin.left = Math.round(offset);
       }
-      canvas.style.marginLeft = `${margin.left  }px`;
+      canvas.style.marginLeft = `${margin.left}px`;
       if (margin.left !== 0) {
         margin.right = -(parentBounds.width - canvasBounds.width - margin.left);
-        canvas.style.marginRight = `${margin.right  }px`;
+        canvas.style.marginRight = `${margin.right}px`;
       }
     }
     if (vertical) {
@@ -569,10 +569,10 @@ export class ScaleManager {
         const offset = targetEdge - currentEdge;
         margin.top = Math.round(offset);
       }
-      canvas.style.marginTop = `${margin.top  }px`;
+      canvas.style.marginTop = `${margin.top}px`;
       if (margin.top !== 0) {
         margin.bottom = -(parentBounds.height - canvasBounds.height - margin.top);
-        canvas.style.marginBottom = `${margin.bottom  }px`;
+        canvas.style.marginBottom = `${margin.bottom}px`;
       }
     }
     // Silly backwards compatibility..
@@ -613,7 +613,7 @@ export class ScaleManager {
    * @param {string} cssWidth - TBD.
    * @param {string} cssHeight - TBD.
    */
-  resetCanvas(cssWidth = `${this.width  }px`, cssHeight = `${this.height  }px`) {
+  resetCanvas(cssWidth = `${this.width}px`, cssHeight = `${this.height}px`) {
     const canvas = this.game.canvas;
     if (!this.compatibility.noMargins) {
       canvas.style.marginLeft = '';

package/src/phaser/core/signal.js

@@ -44,11 +44,9 @@ export class Signal {
       binding = this._bindings[prevIndex];
       if (binding.isOnce() !== isOnce) {
         throw new Error(
-          `You cannot add${ 
-            isOnce ? '' : 'Once' 
-            }() then add${ 
-            !isOnce ? '' : 'Once' 
-            }() the same listener without removing the relationship first.`
+          `You cannot add${isOnce ? '' : 'Once'}() then add${
+            !isOnce ? '' : 'Once'
+          }() the same listener without removing the relationship first.`
         );
       }
     } else {
@@ -243,7 +241,7 @@ export class Signal {
    * @returns {string} TBD.
    */
   toString() {
-    return `[Signal active:${  this.active  } numListeners:${  this.getNumListeners()  }]`;
+    return `[Signal active:${this.active} numListeners:${this.getNumListeners()}]`;
   }
 
   /**

package/src/phaser/core/signal_binding.js

@@ -96,6 +96,6 @@ export class SignalBinding {
    * @returns {string} TBD.
    */
   toString() {
-    return `[SignalBinding isOnce:${  this._isOnce  }, isBound:${  this.isBound()  }, active:${  this.active  }]`;
+    return `[SignalBinding isOnce:${this._isOnce}, isBound:${this.isBound()}, active:${this.active}]`;
   }
 }

package/src/phaser/core/sound.js

@@ -268,7 +268,7 @@ export class Sound {
         this._tempVolume = this.volume;
         this._tempLoop = this.loop;
       } else {
-        console.warn(`Sound.play: audio marker ${  marker  } does not exist`);
+        console.warn(`Sound.play: audio marker ${marker} does not exist`);
         return this;
       }
     } else {

package/src/phaser/core/sound_manager.js

@@ -160,7 +160,7 @@ export class SoundManager {
           error: e,
         });
         this.removeUnlockHandlers();
-        this.game.exceptionHandler(e, { initialState, state: this.context.state });
+        this.game.exceptionHandler(e, { 'audio.initialState': initialState, 'audio.state': this.context.state });
       });
   }
 

package/src/phaser/core/sound_sprite.js

@@ -7,7 +7,7 @@ export class SoundSprite {
   constructor(game, key) {
     this.game = game;
     this.key = key;
-    this.config = this.game.cache.getJSON(`${key  }-audioatlas`);
+    this.config = this.game.cache.getJSON(`${key}-audioatlas`);
     this.autoplayKey = null;
     this.autoplay = false;
     this.sounds = {};

package/src/phaser/display/bitmap_text.js

@@ -318,7 +318,7 @@ export class BitmapText extends DisplayObject {
     if (typeof this.tint === 'number') {
       let colorStr = this.tint.toString(16);
       while (colorStr.length < 6) {
-        colorStr = `0${  colorStr}`;
+        colorStr = `0${colorStr}`;
       }
       return `#${colorStr.toUpperCase()}`;
     }

package/src/phaser/display/button.js

@@ -127,7 +127,7 @@ export class Button extends Image {
    * @param {boolean} switchImmediately - TBD.
    */
   setStateFrame(state, frame, switchImmediately = false) {
-    const frameKey = `_on${  state  }Frame`;
+    const frameKey = `_on${state}Frame`;
     if (frame) {
       this[frameKey] = frame;
       if (switchImmediately) {
@@ -148,7 +148,7 @@ export class Button extends Image {
       return false;
     }
     const state = this.input.enabled || !this._onDisabledFrame ? newState : STATE_DISABLED;
-    const frameKey = `_on${  state  }Frame`;
+    const frameKey = `_on${state}Frame`;
     const frame = this[frameKey];
     if (typeof frame === 'string') {
       this.frameName = frame;

package/src/phaser/display/canvas/buffer.js

@@ -39,6 +39,11 @@ export class CanvasBuffer {
    * TBD.
    */
   destroy() {
+    try {
+      this.context?.reset();
+    } catch {
+      // pass
+    }
     removeByCanvas(this.canvas);
   }
 }

package/src/phaser/display/canvas/graphics.js

@@ -59,23 +59,23 @@ export function renderGraphics(graphics, context) {
       }
       if (data.fill) {
         context.globalAlpha = data.fillAlpha * worldAlpha;
-        context.fillStyle = `#${  (`00000${  (fillColor | 0).toString(16)}`).substr(-6)}`;
+        context.fillStyle = `#${`00000${(fillColor | 0).toString(16)}`.substr(-6)}`;
         context.fill();
       }
       if (data.lineWidth) {
         context.globalAlpha = data.lineAlpha * worldAlpha;
-        context.strokeStyle = `#${  (`00000${  (lineColor | 0).toString(16)}`).substr(-6)}`;
+        context.strokeStyle = `#${`00000${(lineColor | 0).toString(16)}`.substr(-6)}`;
         context.stroke();
       }
     } else if (data.type === GEOM_RECTANGLE) {
       if (data.fillColor || data.fillColor === 0) {
         context.globalAlpha = data.fillAlpha * worldAlpha;
-        context.fillStyle = `#${  (`00000${  (fillColor | 0).toString(16)}`).substr(-6)}`;
+        context.fillStyle = `#${`00000${(fillColor | 0).toString(16)}`.substr(-6)}`;
         context.fillRect(shape.x, shape.y, shape.width, shape.height);
       }
       if (data.lineWidth) {
         context.globalAlpha = data.lineAlpha * worldAlpha;
-        context.strokeStyle = `#${  (`00000${  (lineColor | 0).toString(16)}`).substr(-6)}`;
+        context.strokeStyle = `#${`00000${(lineColor | 0).toString(16)}`.substr(-6)}`;
         context.strokeRect(shape.x, shape.y, shape.width, shape.height);
       }
     } else if (data.type === GEOM_CIRCLE) {
@@ -84,12 +84,12 @@ export function renderGraphics(graphics, context) {
       context.closePath();
       if (data.fill) {
         context.globalAlpha = data.fillAlpha * worldAlpha;
-        context.fillStyle = `#${  (`00000${  (fillColor | 0).toString(16)}`).substr(-6)}`;
+        context.fillStyle = `#${`00000${(fillColor | 0).toString(16)}`.substr(-6)}`;
         context.fill();
       }
       if (data.lineWidth) {
         context.globalAlpha = data.lineAlpha * worldAlpha;
-        context.strokeStyle = `#${  (`00000${  (lineColor | 0).toString(16)}`).substr(-6)}`;
+        context.strokeStyle = `#${`00000${(lineColor | 0).toString(16)}`.substr(-6)}`;
         context.stroke();
       }
     } else if (data.type === GEOM_ELLIPSE) {
@@ -114,12 +114,12 @@ export function renderGraphics(graphics, context) {
       context.closePath();
       if (data.fill) {
         context.globalAlpha = data.fillAlpha * worldAlpha;
-        context.fillStyle = `#${  (`00000${  (fillColor | 0).toString(16)}`).substr(-6)}`;
+        context.fillStyle = `#${`00000${(fillColor | 0).toString(16)}`.substr(-6)}`;
         context.fill();
       }
       if (data.lineWidth) {
         context.globalAlpha = data.lineAlpha * worldAlpha;
-        context.strokeStyle = `#${  (`00000${  (lineColor | 0).toString(16)}`).substr(-6)}`;
+        context.strokeStyle = `#${`00000${(lineColor | 0).toString(16)}`.substr(-6)}`;
         context.stroke();
       }
     } else if (data.type === GEOM_ROUNDED_RECTANGLE) {
@@ -143,12 +143,12 @@ export function renderGraphics(graphics, context) {
       context.closePath();
       if (data.fillColor || data.fillColor === 0) {
         context.globalAlpha = data.fillAlpha * worldAlpha;
-        context.fillStyle = `#${  (`00000${  (fillColor | 0).toString(16)}`).substr(-6)}`;
+        context.fillStyle = `#${`00000${(fillColor | 0).toString(16)}`.substr(-6)}`;
         context.fill();
       }
       if (data.lineWidth) {
         context.globalAlpha = data.lineAlpha * worldAlpha;
-        context.strokeStyle = `#${  (`00000${  (lineColor | 0).toString(16)}`).substr(-6)}`;
+        context.strokeStyle = `#${`00000${(lineColor | 0).toString(16)}`.substr(-6)}`;
         context.stroke();
       }
     }

package/src/phaser/display/canvas/pool.js

@@ -91,16 +91,17 @@ export function getFree() {
  * @param {object} parent - TBD.
  * @param {number} width - TBD.
  * @param {number} height - TBD.
+ * @param {boolean} skipPool - TBD.
  * @returns {HTMLCanvasElement} TBD.
  */
-export function create(parent, width, height) {
+export function create(parent, width, height, skipPool = false) {
   if (parent === undefined) {
     console.warn('Created CanvasPool element with undefined parent.');
   }
   const idx = getFirst();
   const pool = getPool();
   let canvas;
-  if (idx === -1) {
+  if (idx === -1 || skipPool === true) {
     const container = {
       parent,
       canvas: document.createElement('canvas'),

package/src/phaser/display/canvas/renderer.js

@@ -40,6 +40,7 @@ export class CanvasRenderer {
     this.width = game.width * this.resolution;
     this.height = game.height * this.resolution;
     this.view = game.canvas;
+    /** @type {CanvasRenderingContext2D} */
     this.context = this.view.getContext('2d', { alpha: this.transparent });
     if (!this.context) {
       throw new Error('Error creating Canvas2D context');
@@ -106,8 +107,8 @@ export class CanvasRenderer {
     this.view.width = this.width;
     this.view.height = this.height;
     if (this.autoResize) {
-      this.view.style.width = `${this.width / this.resolution  }px`;
-      this.view.style.height = `${this.height / this.resolution  }px`;
+      this.view.style.width = `${this.width / this.resolution}px`;
+      this.view.style.height = `${this.height / this.resolution}px`;
     }
     if (this.renderSession.smoothProperty) {
       this.context[this.renderSession.smoothProperty] = this.renderSession.scaleMode === SCALE_LINEAR;

package/src/phaser/display/canvas/tinter.js

@@ -1,6 +1,5 @@
-import { CanvasBuffer } from './buffer.js';
-import { create, removeByCanvas } from './pool.js';
 import { hex2rgb } from '../../util/math.js';
+import { create, removeByCanvas } from './pool.js';
 
 /**
  * TBD.
@@ -9,7 +8,7 @@ import { hex2rgb } from '../../util/math.js';
  * @returns {object} TBD.
  */
 export function getTintedTexture(sprite, color) {
-  const canvas = sprite.tintedTexture || create('CanvasTinter');
+  const canvas = sprite.tintedTexture || create('CanvasTinter', 1, 1);
   window.PhaserRegistry.CANVAS_TINT_METHOD(sprite.texture, color, canvas);
   return canvas;
 }
@@ -28,7 +27,7 @@ export function tintWithMultiply(texture, color, canvas) {
     canvas.height = crop.height;
   }
   context.clearRect(0, 0, crop.width, crop.height);
-  context.fillStyle = `#${  (`00000${  (color | 0).toString(16)}`).substr(-6)}`;
+  context.fillStyle = `#${`00000${(color | 0).toString(16)}`.substr(-6)}`;
   context.fillRect(0, 0, crop.width, crop.height);
   context.globalCompositeOperation = 'multiply';
   context.drawImage(texture.baseTexture.source, crop.x, crop.y, crop.width, crop.height, 0, 0, crop.width, crop.height);
@@ -75,20 +74,37 @@ export function tintWithPerPixel(texture, color, canvas) {
  * @returns {boolean} TBD.
  */
 export function checkInverseAlpha() {
-  const canvas = new CanvasBuffer(2, 1);
-  canvas.context.fillStyle = 'rgba(10, 20, 30, 0.5)';
-  //  Draw a single pixel
-  canvas.context.fillRect(0, 0, 1, 1);
-  //  Get the color values
-  const s1 = canvas.context.getImageData(0, 0, 1, 1);
+  // Check for DOM
+  if (document === undefined) {
+    return false;
+  }
+  // Create canvas and context
+  const canvas = create('CanvasAlpha', 2, 1, true);
+  const context = canvas.getContext('2d');
+  if (!context) {
+    return false;
+  }
+  // Set canvas fill style
+  context.fillStyle = 'rgba(10, 20, 30, 0.5)';
+  // Draw a single pixel
+  context.fillRect(0, 0, 1, 1);
+  // Get the color values
+  const s1 = context.getImageData(0, 0, 1, 1);
   if (s1 === null) {
     return false;
   }
-  //  Plot them to x2
-  canvas.context.putImageData(s1, 1, 0);
-  //  Get those values
-  const s2 = canvas.context.getImageData(1, 0, 1, 1);
-  //  Compare and return
+  // Plot them to x2
+  context.putImageData(s1, 1, 0);
+  // Get those values
+  const s2 = context.getImageData(1, 0, 1, 1);
+  // Dispose canvas
+  try {
+    context.reset();
+  } catch {
+    // pass
+  }
+  removeByCanvas(canvas);
+  // Compare and return
   return (
     s2.data[0] === s1.data[0] && s2.data[1] === s1.data[1] && s2.data[2] === s1.data[2] && s2.data[3] === s1.data[3]
   );
@@ -99,17 +115,24 @@ export function checkInverseAlpha() {
  * @returns {boolean} TBD.
  */
 export function canUseNewCanvasBlendModes() {
+  // Check for DOM
   if (document === undefined) {
     return false;
   }
+  // Create test images
   const pngHead = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAABAQMAAADD8p2OAAAAA1BMVEX/';
   const pngEnd = 'AAAACklEQVQI12NgAAAAAgAB4iG8MwAAAABJRU5ErkJggg==';
   const magenta = new Image();
-  magenta.src = `${pngHead  }AP804Oa6${  pngEnd}`;
+  magenta.src = `${pngHead}AP804Oa6${pngEnd}`;
   const yellow = new Image();
-  yellow.src = `${pngHead  }/wCKxvRF${  pngEnd}`;
-  const canvas = create('CanvasTinter', 6, 1);
+  yellow.src = `${pngHead}/wCKxvRF${pngEnd}`;
+  // Create canvas and context
+  const canvas = create('CanvasTinter', 6, 1, true);
   const context = canvas.getContext('2d');
+  if (!context) {
+    return false;
+  }
+  // Draw test images to canvas
   context.globalCompositeOperation = 'multiply';
   context.drawImage(magenta, 0, 0);
   context.drawImage(yellow, 2, 0);
@@ -117,7 +140,14 @@ export function canUseNewCanvasBlendModes() {
     return false;
   }
   const data = context.getImageData(2, 0, 1, 1).data;
+  // Dispose canvas
+  try {
+    context.reset();
+  } catch {
+    // pass
+  }
   removeByCanvas(canvas);
+  // Compare and return
   return data[0] === 255 && data[1] === 0 && data[2] === 0;
 }
 

package/src/phaser/display/canvas/util.js

@@ -129,7 +129,7 @@ export function setTransform(context, translateX, translateY, scaleX, scaleY, sk
 export function getSmoothingPrefix(context) {
   const VENDORS = ['i', 'webkitI', 'msI', 'mozI', 'oI'];
   for (let i = 0; i < VENDORS.length; i += 1) {
-    const s = `${VENDORS[i]  }mageSmoothingEnabled`;
+    const s = `${VENDORS[i]}mageSmoothingEnabled`;
     if (context && context[s]) {
       return s;
     }

package/src/phaser/display/display_object.js

@@ -95,7 +95,7 @@ export class DisplayObject {
       this.children.splice(index, 0, child);
       return child;
     }
-    throw new Error(`${child  }addChildAt: The index ${  index  } supplied is out of bounds ${  this.children.length}`);
+    throw new Error(`${child}addChildAt: The index ${index} supplied is out of bounds ${this.children.length}`);
   }
 
   /**
@@ -155,9 +155,9 @@ export class DisplayObject {
   getChildAt(index) {
     if (index < 0 || index >= this.children.length) {
       throw new Error(
-        `getChildAt: Supplied index ${ 
-          index 
-          } does not exist in the child list, or the supplied DisplayObject must be a child of the caller`
+        `getChildAt: Supplied index ${
+          index
+        } does not exist in the child list, or the supplied DisplayObject must be a child of the caller`
       );
     }
     return this.children[index];

package/src/phaser/display/text.js

@@ -545,7 +545,7 @@ export class Text extends Image {
       // append the entire line and exit early
       const lineWidth = context.measureText(line).width;
       if (lineWidth < wordWrapWidth) {
-        output += `${line  }\n`;
+        output += `${line}\n`;
       } else {
         // otherwise, calculate new lines
         let currentLineWidth = wordWrapWidth;
@@ -553,7 +553,7 @@ export class Text extends Image {
         const words = line.split(' ');
         for (let j = 0; j < words.length; j += 1) {
           const word = words[j];
-          const wordWithSpace = `${word  } `;
+          const wordWithSpace = `${word} `;
           let wordWidth = context.measureText(wordWithSpace).width;
           if (wordWidth > currentLineWidth) {
             // break word
@@ -587,7 +587,7 @@ export class Text extends Image {
               .join(' ')
               .replace(/[ \n]*$/gi, '');
             // prepend remainder to next line
-            lines[i + 1] = `${remainder  } ${  lines[i + 1] || ''}`;
+            lines[i + 1] = `${remainder} ${lines[i + 1] || ''}`;
             linesCount = lines.length;
             break; // processing on this line
             // append word with space to output
@@ -597,7 +597,7 @@ export class Text extends Image {
           }
         }
         // append processed line to output
-        output += `${out.replace(/[ \n]*$/gi, '')  }\n`;
+        output += `${out.replace(/[ \n]*$/gi, '')}\n`;
       }
     }
     // trim the end of the string
@@ -624,11 +624,11 @@ export class Text extends Image {
           if (j > 0) {
             result += '\n';
           }
-          result += `${words[j]  } `;
+          result += `${words[j]} `;
           spaceLeft = this.style.wordWrapWidth - wordWidth;
         } else {
           spaceLeft -= wordWidthWithSpace;
-          result += `${words[j]  } `;
+          result += `${words[j]} `;
         }
       }
       if (i < lines.length - 1) {
@@ -674,7 +674,7 @@ export class Text extends Image {
       let family = m[5].trim();
       // If it looks like the value should be quoted, but isn't, then quote it.
       if (!/^(?:inherit|serif|sans-serif|cursive|fantasy|monospace)$/.exec(family) && !/['",]/.exec(family)) {
-        family = `'${  family  }'`;
+        family = `'${family}'`;
       }
       return {
         font,
@@ -685,7 +685,7 @@ export class Text extends Image {
         fontFamily: family,
       };
     }
-    console.warn(`[Text] Error parsing CSS font: ${  font}`);
+    console.warn(`[Text] Error parsing CSS font: ${font}`);
     return { font };
   }
 
@@ -1039,7 +1039,7 @@ export class Text extends Image {
     mutatedValue = mutatedValue.trim();
     // If it looks like the value should be quoted, but isn't, then quote it.
     if (!/^(?:inherit|serif|sans-serif|cursive|fantasy|monospace)$/.exec(mutatedValue) && !/['",]/.exec(mutatedValue)) {
-      mutatedValue = `'${  mutatedValue  }'`;
+      mutatedValue = `'${mutatedValue}'`;
     }
 
     this._fontComponents.fontFamily = mutatedValue;