Multiple Text objects using the same Font object overwrite each other

[DaVince]

When creating more than 1 Label or Text that use the same Font, Excalibur gets confused and overwrites the contents of previous Labels. It also offsets the x positions of the Labels randomly.

Steps to Reproduce

• Create a font resource.
• Create two Labels with different text and coordinates. Make them use the same font resource.
• Add the labels to the scene and display the scene.

Code example:

My code:

import pixelFont from "./assets/font/at01.ttf";
let Resources = {
  pixelFont: new Font({ family: 'pixel-font', size: 32, smoothing: false }),
};

class Game extends Engine {
  constructor() {
    super({
      width: 1280,
      height: 720,
      maxFps: 60,
      displayMode: DisplayMode.FillScreen
    });
  }
  initialize() {
    const loader = new Loader([]);
    this.start(loader).then(() => {
      const text = new Label({
        text: "hi!",
        pos: vec(0, 20),
        font: Resources.pixelFont
      });
      this.add(text);

      const text2 = new Label({
        text: "hi????!",
        pos: vec(0, 40),
        font: Resources.pixelFont
      });
      this.add(text2);
    });
  }
}

export const game = new Game();
game.initialize();

Expected Result

Two labels with their own relative text and positions should appear.

Actual Result

The two labels appear, but they both have the text from the last label created.

Environment

• browsers and versions: Chrome 103.0.5060.114, Firefox 102.0.1
• operating system: Ubuntu 21.10
• Excalibur versions: 0.27.0, 0.26.0.
• Regression happened between 0.25.0 and 0.26.0; the former does properly create two labels with their own text and proper offsets.

Current workaround

Creating a clone of the Font object with the .clone() method for each Label and Text object.

Additional information

Attached is the full output of one of the WebGL warnings that appears in the console: BindTexturesError.txt

This error also happens in Firefox, though the console message is worded differently:

WebGL warning: bindTexture: Object `tex` is already deleted.

[eonarheim]

@DaVince Thanks for the issue!

Definitely a bug! Feels like I've fixed this one before, you should be able to re-use the fonts as you expect.

[eonarheim]

Doh, definitely a regression I should have a fix up soon (with a better test to prevent this from happening again)

Related #2152

[DaVince]

Excellent, thanks so much!