14840900305

Committed 05 May 2025 04:07PM UTC coverage: 87.864% (-1.5%) from 89.319%

Build # 14840900305

Build Type

push

github

Committed by

web-flow

Commit Message

chore: migrate tests to vitest (#3381)

managed to migrate the engine leak & memory reporters, although it took a bit of rigamarole. Mainly because, as opposed to karma, the reporter runs in node and not the browser. So I have to track the data needed separately in some global hooks _within_ the browser environment, which the reporter then reads and creates the logs if needed.

However, it seems the memory tracking is regularly reporting >1 mb, so I'm not sure if it's tracking properly or if things have changed with the new browsers. My only theory is that because the timing where memory is read is during an `afterEach` _before_ the test's `afterEach`, it's running before any potential cleanup. The timing of this is not something that's easy to control, unfortunately. I did try to prove this theory by doing the memory analysis on the next test's `beforeEach`, but it didnt seem to change the results, so it may not be an issue.

Implementation is done in `src/spec/vitest/__reporters__/memory.ts` and `src/spec/vitest/__reporters/memory.setup.ts`

---

I noticed CouroutineSpec was an offender for >10mb memory, which spins up additional engines. I added a short 100ms wait after the engine.dispose and the memory usage did drop, so it does seem like this is prone to scheduled garbage collecting.

---

I was able to run the garbage collector (if exposed, currently only on chrome) and this makes the reports more accurate

Run Details

4998 of 6942 branches covered (72.0%)

13655 of 15541 relevant lines covered (87.86%)

25165.01 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

39.53

/src/engine/Graphics/Text.ts

import type { ExcaliburGraphicsContext } from './Context/ExcaliburGraphicsContext';
import type { BoundingBox } from '../Collision/BoundingBox';
import type { SpriteFont } from './SpriteFont';
import type { GraphicOptions } from './Graphic';
import { Graphic } from './Graphic';
import { Color } from '../Color';
import { Font } from './Font';

export interface TextOptions {
  /**
   * Text to draw
   */
  text: string;

  /**
   * Optionally override the font color, currently unsupported by SpriteFont
   */
  color?: Color;

  /**
   * Optionally specify a font, if none specified a default font is used (System sans-serif 10 pixel)
   */
  font?: Font | SpriteFont;

  /**
   * Optionally specify a maximum width in pixels for our text, and wrap to the next line if needed.
   */
  maxWidth?: number;
}

/**
 * Represent Text graphics in excalibur
 *
 * Useful for in game labels, ui, or overlays
 */
export class Text extends Graphic {
  public color?: Color;
  public maxWidth?: number;
  constructor(options: TextOptions & GraphicOptions) {
    super(options);
    // This order is important font, color, then text
    this.font = options.font ?? new Font();
    this.color = options.color ?? this.color;
    this.text = options.text;
    this.maxWidth = options.maxWidth;
  }

  public clone(): Text {
    return new Text({
      text: this.text.slice(),
      color: this.color?.clone() ?? Color.Black,
      font: this.font.clone(),
      maxWidth: this.maxWidth
    });
  }

  private _text: string = '';
  public get text() {
    return this._text;
  }

  public set text(value: string) {
    this._text = value;
    this._calculateDimension();
  }

  private _font!: Font | SpriteFont;
  public get font(): Font | SpriteFont {
    return this._font;
  }
  public set font(font: Font | SpriteFont) {
    this._font = font;
  }

  private _textWidth: number = 0;

  public get width() {
    if (this._textWidth === 0) {
      this._calculateDimension();
    }
    return this._textWidth * this.scale.x;
  }

  private _textHeight: number = 0;
  public get height() {
    if (this._textHeight === 0) {
      this._calculateDimension();
    }
    return this._textHeight * this.scale.y;
  }

  private _calculateDimension() {
    const { width, height } = this.font.measureText(this._text, this.maxWidth);
    this._textWidth = width;
    this._textHeight = height;
  }

  public get localBounds(): BoundingBox {
    return this.font.measureText(this._text, this.maxWidth).scale(this.scale);
  }

  protected override _rotate(_ex: ExcaliburGraphicsContext) {
    // None this is delegated to font
    // This override erases the default behavior
  }

  protected override _flip(_ex: ExcaliburGraphicsContext) {
    // None this is delegated to font
    // This override erases the default behavior
  }

  protected override _preDraw(ex: ExcaliburGraphicsContext, x: number, y: number): void {
    if (this.isStale() || this.font.isStale()) {
      this.font.flipHorizontal = this.flipHorizontal;
      this.font.flipVertical = this.flipVertical;
      this.font.rotation = this.rotation;
      this.font.origin = this.origin;
      this.font.opacity = this.opacity;
    }
    this.font.tint = this.tint;
    super._preDraw(ex, x, y);
  }

  protected override _drawImage(ex: ExcaliburGraphicsContext, x: number, y: number) {
    let color = Color.Black;
    if (this.font instanceof Font) {
      color = this.color ?? this.font.color;
    }

    const { width, height } = this.font.measureText(this._text, this.maxWidth);
    this._textWidth = width;
    this._textHeight = height;

    this.font.render(ex, this._text, color, x, y, this.maxWidth);

    if (this.font.showDebug) {
      ex.debug.drawRect(x - width, y - height, width * 2, height * 2);
      if (this.maxWidth != null) {
        ex.debug.drawRect(x, y, this.maxWidth, this.height, {
          color: Color.Yellow
        });
      }
    }
  }
}

1	import type { ExcaliburGraphicsContext } from './Context/ExcaliburGraphicsContext';
2	import type { BoundingBox } from '../Collision/BoundingBox';
3	import type { SpriteFont } from './SpriteFont';
4	import type { GraphicOptions } from './Graphic';
5	import { Graphic } from './Graphic';
6	import { Color } from '../Color';
7	import { Font } from './Font';
8
9	export interface TextOptions {
10	/**
11	* Text to draw
12	*/
13	text: string;
14
15	/**
16	* Optionally override the font color, currently unsupported by SpriteFont
17	*/
18	color?: Color;
19
20	/**
21	* Optionally specify a font, if none specified a default font is used (System sans-serif 10 pixel)
22	*/
23	font?: Font \| SpriteFont;
24
25	/**
26	* Optionally specify a maximum width in pixels for our text, and wrap to the next line if needed.
27	*/
28	maxWidth?: number;
29	}
30
31	/**
32	* Represent Text graphics in excalibur
33	*
34	* Useful for in game labels, ui, or overlays
35	*/
36	export class Text extends Graphic {
37	public color?: Color;
38	public maxWidth?: number;
39	constructor(options: TextOptions & GraphicOptions) {
40	super(options);	5✔
41	// This order is important font, color, then text
42	this.font = options.font ?? new Font();	5!
43	this.color = options.color ?? this.color;	5!
44	this.text = options.text;	5✔
45	this.maxWidth = options.maxWidth;	5✔
46	}
47
48	public clone(): Text {
49	return new Text({	×
50	text: this.text.slice(),
51	color: this.color?.clone() ?? Color.Black,	×
52	font: this.font.clone(),
53	maxWidth: this.maxWidth
54	});
55	}
56
57	private _text: string = '';	5✔
58	public get text() {
59	return this._text;	2✔
60	}
61
62	public set text(value: string) {
63	this._text = value;	10✔
64	this._calculateDimension();	10✔
65	}
66
67	private _font!: Font \| SpriteFont;
68	public get font(): Font \| SpriteFont {
69	return this._font;	20✔
70	}
71	public set font(font: Font \| SpriteFont) {
72	this._font = font;	11✔
73	}
74
75	private _textWidth: number = 0;	5✔
76
77	public get width() {
78	if (this._textWidth === 0) {	×
79	this._calculateDimension();	×
80	}
81	return this._textWidth * this.scale.x;	×
82	}
83
84	private _textHeight: number = 0;	5✔
85	public get height() {
86	if (this._textHeight === 0) {	×
87	this._calculateDimension();	×
88	}
89	return this._textHeight * this.scale.y;	×
90	}
91
92	private _calculateDimension() {
93	const { width, height } = this.font.measureText(this._text, this.maxWidth);	10✔
94	this._textWidth = width;	10✔
95	this._textHeight = height;	10✔
96	}
97
98	public get localBounds(): BoundingBox {
99	return this.font.measureText(this._text, this.maxWidth).scale(this.scale);	10✔
100	}
101
102	protected override _rotate(_ex: ExcaliburGraphicsContext) {
103	// None this is delegated to font
104	// This override erases the default behavior
105	}
106
107	protected override _flip(_ex: ExcaliburGraphicsContext) {
108	// None this is delegated to font
109	// This override erases the default behavior
110	}
111
112	protected override _preDraw(ex: ExcaliburGraphicsContext, x: number, y: number): void {
113	if (this.isStale() \|\| this.font.isStale()) {	×
114	this.font.flipHorizontal = this.flipHorizontal;	×
115	this.font.flipVertical = this.flipVertical;	×
116	this.font.rotation = this.rotation;	×
117	this.font.origin = this.origin;	×
118	this.font.opacity = this.opacity;	×
119	}
120	this.font.tint = this.tint;	×
121	super._preDraw(ex, x, y);	×
122	}
123
124	protected override _drawImage(ex: ExcaliburGraphicsContext, x: number, y: number) {
125	let color = Color.Black;	×
126	if (this.font instanceof Font) {	×
127	color = this.color ?? this.font.color;	×
128	}
129
130	const { width, height } = this.font.measureText(this._text, this.maxWidth);	×
131	this._textWidth = width;	×
132	this._textHeight = height;	×
133
134	this.font.render(ex, this._text, color, x, y, this.maxWidth);	×
135
136	if (this.font.showDebug) {	×
137	ex.debug.drawRect(x - width, y - height, width * 2, height * 2);	×
138	if (this.maxWidth != null) {	×
139	ex.debug.drawRect(x, y, this.maxWidth, this.height, {	×
140	color: Color.Yellow
141	});
142	}
143	}
144	}
145	}

excaliburjs / Excalibur / 14840900305

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous