NetMesh/components/terminal/runtime/rendererDprWatch.test.ts

import assert from "node:assert/strict";
import { test } from "node:test";
import {
  type MediaQueryListLike,
  watchDevicePixelRatio,
} from "./rendererDprWatch";

class FakeMediaQueryList implements MediaQueryListLike {
  readonly query: string;
  modernListeners: Array<() => void> = [];
  legacyListeners: Array<() => void> = [];
  private readonly supportsModern: boolean;

  constructor(query: string, supportsModern = true) {
    this.query = query;
    this.supportsModern = supportsModern;
    if (!supportsModern) {
      // Strip the modern API to emulate legacy environments.
      this.addEventListener = undefined;
      this.removeEventListener = undefined;
    }
  }

  addEventListener? = (_type: "change", listener: () => void) => {
    this.modernListeners.push(listener);
  };

  removeEventListener? = (_type: "change", listener: () => void) => {
    this.modernListeners = this.modernListeners.filter((l) => l !== listener);
  };

  addListener = (listener: () => void) => {
    this.legacyListeners.push(listener);
  };

  removeListener = (listener: () => void) => {
    this.legacyListeners = this.legacyListeners.filter((l) => l !== listener);
  };

  trigger() {
    for (const l of [...this.modernListeners, ...this.legacyListeners]) l();
  }

  get listenerCount() {
    return this.modernListeners.length + this.legacyListeners.length;
  }
}

function makeEnv(initialDpr: number, supportsModern = true) {
  let dpr = initialDpr;
  const created: FakeMediaQueryList[] = [];
  return {
    created,
    getDevicePixelRatio: () => dpr,
    matchMedia: (query: string) => {
      const mql = new FakeMediaQueryList(query, supportsModern);
      created.push(mql);
      return mql;
    },
    setDpr: (value: number) => {
      dpr = value;
    },
  };
}

test("registers a change listener for the current devicePixelRatio", () => {
  const env = makeEnv(1);
  watchDevicePixelRatio({
    getDevicePixelRatio: env.getDevicePixelRatio,
    matchMedia: env.matchMedia,
    onChange: () => {},
  });

  assert.equal(env.created.length, 1);
  assert.equal(env.created[0].query, "(resolution: 1dppx)");
  assert.equal(env.created[0].listenerCount, 1);
});

test("invokes onChange when the media query reports a change", () => {
  const env = makeEnv(1);
  let calls = 0;
  watchDevicePixelRatio({
    getDevicePixelRatio: env.getDevicePixelRatio,
    matchMedia: env.matchMedia,
    onChange: () => {
      calls += 1;
    },
  });

  env.setDpr(2);
  env.created[0].trigger();

  assert.equal(calls, 1);
});

test("re-registers for the new ratio so subsequent changes still fire", () => {
  const env = makeEnv(1);
  let calls = 0;
  watchDevicePixelRatio({
    getDevicePixelRatio: env.getDevicePixelRatio,
    matchMedia: env.matchMedia,
    onChange: () => {
      calls += 1;
    },
  });

  env.setDpr(2);
  env.created[0].trigger();

  assert.equal(env.created.length, 2);
  assert.equal(env.created[1].query, "(resolution: 2dppx)");
  // The stale listener must be detached so it cannot double-fire.
  assert.equal(env.created[0].listenerCount, 0);

  env.setDpr(3);
  env.created[1].trigger();

  assert.equal(calls, 2);
});

test("cleanup stops further onChange callbacks", () => {
  const env = makeEnv(1);
  let calls = 0;
  const stop = watchDevicePixelRatio({
    getDevicePixelRatio: env.getDevicePixelRatio,
    matchMedia: env.matchMedia,
    onChange: () => {
      calls += 1;
    },
  });

  stop();

  assert.equal(env.created[0].listenerCount, 0);
  env.created[0].trigger();
  assert.equal(calls, 0);
});

test("falls back to addListener/removeListener when addEventListener is unavailable", () => {
  const env = makeEnv(1, /* supportsModern */ false);
  let calls = 0;
  const stop = watchDevicePixelRatio({
    getDevicePixelRatio: env.getDevicePixelRatio,
    matchMedia: env.matchMedia,
    onChange: () => {
      calls += 1;
    },
  });

  assert.equal(env.created[0].legacyListeners.length, 1);
  env.created[0].trigger();
  assert.equal(calls, 1);

  stop();
  // After cleanup the most recently registered query has no listeners.
  const latest = env.created[env.created.length - 1];
  assert.equal(latest.listenerCount, 0);
});