Refine player control-plane flow

test/player-markup-preload.test.js

@@ -0,0 +1,148 @@
+const fs = require('node:fs');
+const path = require('node:path');
+const vm = require('node:vm');
+const test = require('node:test');
+const assert = require('node:assert/strict');
+
+function loadScript(scriptPath, sandbox) {
+  const source = fs.readFileSync(scriptPath, 'utf8');
+  vm.runInNewContext(source, sandbox, { filename: scriptPath });
+}
+
+function createStyleStore() {
+  const values = Object.create(null);
+  return {
+    values,
+    getPropertyValue(name) {
+      return values[name] || '';
+    },
+    setProperty(name, value) {
+      values[name] = String(value || '');
+    },
+    removeProperty(name) {
+      delete values[name];
+    }
+  };
+}
+
+test('primeSlideMarkup restores the current canvas dimensions', () => {
+  const style = createStyleStore();
+  style.setProperty('--player-canvas-width', '1920px');
+  style.setProperty('--player-canvas-height', '1080px');
+
+  const sandbox = {
+    window: null,
+    document: {
+      documentElement: { style }
+    },
+    Date,
+    JSON,
+    Math,
+    Number,
+    String,
+    Boolean,
+    Array,
+    Object,
+    Promise,
+    currentPlaylistSignature: 'signature',
+    currentPlaylistEtag: '',
+    currentPlaylistFadeBetweenSlides: false,
+    currentPlaylistSkipUnavailableRtmp: false,
+    videoRegionRenderVersion: 0,
+    lastRenderedSlide: { id: 1 },
+    slideMarkupCache: Object.create(null),
+    templateLayoutCache: Object.create(null),
+    templateRenderPlanCache: Object.create(null),
+    renderCacheViewportKey: '',
+    window: null,
+    innerWidth: 1280,
+    innerHeight: 720,
+    pulsePlayerRegionTypes: {
+      get() {
+        return null;
+      }
+    },
+    syncRenderCacheViewport() {},
+    syncBlackoutState() {},
+    setPlayerCanvasDimensions() {},
+    escapeHtml(value) {
+      return String(value || '');
+    }
+  };
+  sandbox.window = sandbox;
+
+  const renderingPath = path.join(__dirname, '..', 'src', 'player', 'public', 'js', 'player-page-rendering.js');
+  loadScript(renderingPath, sandbox);
+
+  const slide = {
+    id: 2,
+    kind: 'image',
+    media_url: 'https://example.com/next.jpg',
+    modified_at: '2026-08-07T00:00:00.000Z'
+  };
+
+  const markup = sandbox.primeSlideMarkup(slide);
+
+  assert.match(markup, /<img src="https:\/\/example\.com\/next\.jpg"/);
+  assert.equal(style.getPropertyValue('--player-canvas-width'), '1920px');
+  assert.equal(style.getPropertyValue('--player-canvas-height'), '1080px');
+  assert.deepEqual(sandbox.lastRenderedSlide, { id: 1 });
+});
+
+test('scheduleSlideMarkupPreload warms the next slide only', () => {
+  const timers = [];
+  const calls = [];
+  const sandbox = {
+    window: null,
+    document: {
+      documentElement: { style: createStyleStore() }
+    },
+    Date,
+    JSON,
+    Math,
+    Number,
+    String,
+    Boolean,
+    Array,
+    Object,
+    Promise,
+    currentPlaylistSignature: 'signature',
+    currentPlaylistEtag: '',
+    currentPlaylistFadeBetweenSlides: false,
+    currentPlaylistSkipUnavailableRtmp: false,
+    videoRegionRenderVersion: 0,
+    innerWidth: 1280,
+    innerHeight: 720,
+    slideMarkupCache: Object.create(null),
+    templateLayoutCache: Object.create(null),
+    templateRenderPlanCache: Object.create(null),
+    renderCacheViewportKey: '',
+    escapeHtml(value) {
+      return String(value || '');
+    },
+    syncRenderCacheViewport() {},
+    syncBlackoutState() {},
+    setPlayerCanvasDimensions() {},
+    primeSlideMarkup(slide) {
+      calls.push(slide.id);
+      return 'markup:' + slide.id;
+    },
+    setTimeout(fn) {
+      timers.push(fn);
+      return timers.length;
+    }
+  };
+  sandbox.window = sandbox;
+
+  const playlistPath = path.join(__dirname, '..', 'src', 'player', 'public', 'js', 'player-page-playlist.js');
+  loadScript(playlistPath, sandbox);
+
+  const current = { id: 1 };
+  const next = { id: 2 };
+  const later = { id: 3 };
+
+  sandbox.scheduleSlideMarkupPreload([current, next, later], 0);
+  assert.equal(timers.length, 1);
+  timers.shift()();
+  assert.deepEqual(calls, [2]);
+});