refactor: introduce EnumRecord utility methods (#60)

Author: timkurvers

babel.config.cjs

@@ -0,0 +1,6 @@
+module.exports = {
+  presets: [
+    ['@babel/preset-env', { targets: { node: 'current' }}],
+    '@babel/preset-typescript',
+  ],
+};

jest.config.cjs

@@ -6,7 +6,8 @@ module.exports = {
   coverageDirectory: './coverage/',
   moduleFileExtensions: ['js', 'ts'],
   testMatch: [
-    '**/spec/**/*.spec.js',
+    '**/*.test.js',
+    '**/*.test.ts',
   ],
   verbose: true,
 };

package-lock.json

@@ -32,13 +32,16 @@
     "fengari": "0.1.4"
   },
   "devDependencies": {
+    "@babel/preset-env": "7.24.4",
+    "@babel/preset-typescript": "7.24.1",
     "@commitlint/cli": "18.4.4",
     "@commitlint/config-conventional": "18.4.4",
+    "@types/jest": "29.5.12",
     "@typescript-eslint/eslint-plugin": "6.19.0",
     "eslint": "8.56.0",
     "eslint-plugin-import": "2.29.1",
     "husky": "^4.3.6",
-    "jest": "26.0.1",
+    "jest": "29.7.0",
     "lint-staged": "15.2.0",
     "typescript": "^5.2.2",
     "vite": "^5.0.13"

package.json

@@ -2,7 +2,7 @@ import DrawLayerType from '../DrawLayerType';
 import Screen from '../../gfx/Screen';
 import ScreenLayer from '../../gfx/ScreenLayer';
 import { EdgeRect } from '../../math';
-import { EnumRecord, LinkedList, NDCtoDDCWidth, NDCtoDDCHeight } from '../../utils';
+import { EnumRecord, LinkedList, NDCtoDDCWidth, NDCtoDDCHeight, enumRecordFor } from '../../utils';
 
 import Frame, { FrameFlag } from './simple/Frame';
 import FramePointType from './abstract/FramePointType';
@@ -31,17 +31,7 @@ class UIRoot extends LayoutFrame {
       anchor: FramePointType.TOPLEFT,
     };
 
-    this.strata = [
-      new FrameStrata(FrameStrataType.WORLD),
-      new FrameStrata(FrameStrataType.BACKGROUND),
-      new FrameStrata(FrameStrataType.LOW),
-      new FrameStrata(FrameStrataType.MEDIUM),
-      new FrameStrata(FrameStrataType.HIGH),
-      new FrameStrata(FrameStrataType.DIALOG),
-      new FrameStrata(FrameStrataType.FULLSCREEN),
-      new FrameStrata(FrameStrataType.FULLSCREEN_DIALOG),
-      new FrameStrata(FrameStrataType.TOOLTIP),
-    ];
+    this.strata = enumRecordFor(FrameStrataType, (type) => new FrameStrata(type));
 
     this.frames = LinkedList.using('framesLink');
     this.destroyedFrames = LinkedList.using('destroyedLink');

spec/.eslintrc

@@ -1,7 +1,7 @@
 import DrawLayerType from '../../DrawLayerType';
 import Frame from '../simple/Frame';
 import RenderBatch from '../../rendering/RenderBatch';
-import { EnumRecord, LinkedList } from '../../../utils';
+import { EnumRecord, LinkedList, enumRecordFor } from '../../../utils';
 
 class FrameStrataLevel {
   index: number;
@@ -19,13 +19,7 @@ class FrameStrataLevel {
     this.pendingFrames = LinkedList.using('strataLink');
     this.frames = LinkedList.using('strataLink');
 
-    this.batches = [
-      new RenderBatch(DrawLayerType.BACKGROUND),
-      new RenderBatch(DrawLayerType.BORDER),
-      new RenderBatch(DrawLayerType.ARTWORK),
-      new RenderBatch(DrawLayerType.OVERLAY),
-      new RenderBatch(DrawLayerType.HIGHLIGHT),
-    ];
+    this.batches = enumRecordFor(DrawLayerType, (type) => new RenderBatch(type));
 
     this.batchDirty = 0;
 

spec/index.spec.js

@@ -14,6 +14,7 @@ import {
   LinkedListLink,
   LinkedListNode,
   Status,
+  enumRecordFor,
   stringToBoolean,
 } from '../../../utils';
 import { EPSILON1, Rect, areClose } from '../../../math';
@@ -80,13 +81,7 @@ class Frame extends ScriptRegion {
     this.level = 0;
     this.frameScale = 1.0;
 
-    this.layersEnabled = [
-      true,
-      true,
-      true,
-      true,
-      false,
-    ];
+    this.layersEnabled = enumRecordFor(DrawLayerType, (type) => type !== DrawLayerType.HIGHLIGHT);
     this.backdrop = null;
 
     this.regions = LinkedList.using('regionLink');

src/ui/components/UIRoot.ts

@@ -1,6 +1,7 @@
 import Client from '../../../Client';
 import Device from '../../../gfx/Device';
 import DrawLayerType from '../../DrawLayerType';
+import FramePointType from '../../components/abstract/FramePointType';
 import GfxTexture from '../../../gfx/Texture';
 import Region from './Region';
 import RenderBatch from '../../rendering/RenderBatch';
@@ -15,6 +16,7 @@ import {
   NDCtoDDCHeight,
   NDCtoDDCWidth,
   Status,
+  enumSizeFor,
   maxAspectCompensation,
   stringToBoolean,
   stringToFloat,
@@ -255,12 +257,13 @@ class Texture extends Region {
   postLoadXML(_node: XMLNode) {
     if (this._parent) {
       let i = 0;
+      const length = enumSizeFor(FramePointType);
       for (const point of this.points) {
         if (point && !(point.flags & 0x8)) {
           break;
         }
 
-        if (i + 1 === this.points.length) {
+        if (i + 1 === length) {
           this.setAllPoints(this._parent, true);
           break;
         }

src/ui/components/abstract/FrameStrataLevel.ts

@@ -0,0 +1,53 @@
+import { enumRecordFor, enumSizeFor, enumValuesFor } from './types';
+
+enum Currency {
+  USD = 'US Dollar',
+  EUR = 'Euro'
+}
+
+enum Ranking {
+  FIRST = 1,
+  SECOND = 2,
+  THIRD = 3
+}
+
+describe('enumValuesFor', () => {
+  it('returns an array of string enum values', () => {
+    expect(enumValuesFor(Currency)).toEqual([Currency.USD, Currency.EUR]);
+   });
+
+  it('returns an array of number enum values', () => {
+    expect(enumValuesFor(Ranking)).toEqual([Ranking.FIRST, Ranking.SECOND, Ranking.THIRD]);
+  });
+});
+
+describe('enumRecordFor', () => {
+  it('constructs an iterable string enum record', () => {
+    const record = enumRecordFor(Currency, (value) => value.length);
+    expect(record).toEqual({
+      [Currency.USD]: 9,
+      [Currency.EUR]: 4,
+    });
+    expect(Array.from(record)).toEqual([9, 4]);
+  });
+
+  it('constructs an iterable number enum record', () => {
+    const record = enumRecordFor(Ranking, (value) => value * 3);
+    expect(record).toEqual({
+      [Ranking.FIRST]: 3,
+      [Ranking.SECOND]: 6,
+      [Ranking.THIRD]: 9,
+    });
+    expect(Array.from(record)).toEqual([3, 6, 9]);
+  });
+});
+
+describe('enumSizeFor', () => {
+  it('returns size for string enum', () => {
+    expect(enumSizeFor(Currency)).toEqual(2);
+  });
+
+  it('returns size for number enum', () => {
+    expect(enumSizeFor(Ranking)).toEqual(3);
+  });
+});

src/ui/components/simple/Frame.ts

@@ -1,4 +1,29 @@
-export type EnumRecord<E extends string | number | symbol, V> = Record<E, V> & Iterable<V> & { length: number };
+export type EnumRecord<E extends string | number, V> = Record<E, V> & Iterable<V>;
+
+// Loosely adapted from: https://github.com/microsoft/TypeScript/issues/4753#issuecomment-694557208
+type EnumType<T> = { [name: string]: T }
+
+export function enumValuesFor<T extends string>(enumeration: EnumType<T>): T[];
+export function enumValuesFor<T extends string | number>(enumeration: EnumType<T>): Exclude<T, string>[];
+export function enumValuesFor<T>(enumeration: EnumType<T>): T[] {
+  const isStringEnum = Object.values(enumeration).every((value) => typeof value === 'string');
+  return Object.values(enumeration).filter((value) => isStringEnum || typeof value === 'number');
+}
+
+export function enumRecordFor<T extends string, V extends (value: T) => unknown>(enumeration: EnumType<T>, mapFv: V): EnumRecord<T, ReturnType<V>>;
+export function enumRecordFor<T extends string | number, V extends (value: Exclude<T, string>) => unknown>(enumeration: EnumType<T>, mapFn: V): EnumRecord<Exclude<T, string>, ReturnType<V>>;
+export function enumRecordFor<T extends string | number, V extends (value: T) => unknown>(enumeration: EnumType<T>, mapFn: V): EnumRecord<T, ReturnType<V>> {
+  const values = enumValuesFor(enumeration);
+  const record = Object.assign({}, ...values.map((value) => ({ [value]: mapFn(value) })));
+  Object.defineProperty(record, Symbol.iterator, {
+    value: () => Object.values(record).values()
+  });
+  return record;
+}
+
+export function enumSizeFor<T extends string | number>(enumeration: EnumType<T>): number {
+  return enumValuesFor(enumeration).length;
+}
 
 // See: https://github.com/microsoft/TypeScript/issues/5863#issuecomment-1336204919
 export type ThisConstructor<