Consolidate slide preview content resolution

test/player-render-helpers.test.js

@@ -395,14 +395,12 @@ test('shared iframe renderers size preview content explicitly', () => {
   const playerHtmlRegionSource = fs.readFileSync(require.resolve('../src/player/regions/html.js'), 'utf8');
   const playerWebpageRegionSource = fs.readFileSync(require.resolve('../src/player/regions/webpage.js'), 'utf8');
   const playerRenderHelpersSource = fs.readFileSync(require.resolve('../src/player/render-helpers.js'), 'utf8');
-  const slideThumbnailPreviewSource = fs.readFileSync(require.resolve('../src/web/lib/media/slide-thumbnail-preview.js'), 'utf8');
   const slideThumbnailsSource = fs.readFileSync(require.resolve('../src/web/lib/media/slide-thumbnails.js'), 'utf8');
 
   assert.ok(playerHtmlRegionSource.includes('style="width:100%;height:100%;border:0;display:block;background:transparent;overflow:hidden;"'));
   assert.ok(playerWebpageRegionSource.includes('style="width:100%;height:100%;border:0;display:block;background:#fff;overflow:hidden;"'));
   assert.ok(playerRenderHelpersSource.includes('style="width:100%;height:100%;border:0;display:block;background:transparent;overflow:hidden;"'));
-  assert.ok(slideThumbnailPreviewSource.includes('slide-preview-webpage-region'));
-  assert.ok(slideThumbnailPreviewSource.includes('style="width:100%;height:100%;border:0;display:block;background:transparent;overflow:hidden;"'));
+  assert.ok(slideThumbnailsSource.includes('slide-preview-webpage-region'));
   assert.ok(slideThumbnailsSource.includes('slide-preview-webpage-placeholder'));
   assert.ok(slideThumbnailsSource.includes('style="width:100%;height:100%;border:0;display:block;background:transparent;overflow:hidden;"'));
 });

test/region-layout.test.js

@@ -6,7 +6,7 @@ const vm = require('node:vm');
 
 require('../src/common');
 const { buildSlidePayload } = require('../src/data/slides');
-const { buildThumbnailPreviewMarkup } = require('../src/web/lib/media/slide-thumbnail-preview');
+const { buildThumbnailPreviewMarkup } = require('../src/web/lib/media/slide-thumbnails');
 const { buildTemplateLayoutUpdate, buildTemplateAnimationUpdate } = require('../src/data/templates');
 const { getTemplateLayoutSnapshot, getTemplateAnimationSnapshot, retainLayoutAnimation } = require('../src/web/public/js/shared/region-layout');
 

test/slide-form-editor.test.js

@@ -7,7 +7,6 @@ const slideFormEditorSource = fs.readFileSync(require.resolve('../src/web/public
 const slideFormSource = fs.readFileSync(require.resolve('../src/web/public/js/slides/slide-form.js'), 'utf8');
 const slideFormTemplateSource = fs.readFileSync(require.resolve('../src/web/views/signage/slides/form.hbs'), 'utf8');
 const mediaPickerSource = fs.readFileSync(require.resolve('../src/web/public/js/shared/ui/media-picker.js'), 'utf8');
-const slideThumbnailPreviewSource = fs.readFileSync(require.resolve('../src/web/lib/media/slide-thumbnail-preview.js'), 'utf8');
 const slideThumbnailsSource = fs.readFileSync(require.resolve('../src/web/lib/media/slide-thumbnails.js'), 'utf8');
 const slideHtmlRegionSource = fs.readFileSync(require.resolve('../src/web/public/js/regions/type/html.js'), 'utf8');
 const slideWebpageRegionSource = fs.readFileSync(require.resolve('../src/web/public/js/regions/type/webpage.js'), 'utf8');
@@ -89,7 +88,6 @@ test('media library selections keep image and video remove controls', () => {
 });
 
 test('slide thumbnail previews treat image-only text as visible content', () => {
-  assert.ok(slideThumbnailPreviewSource.includes('/<img\\b/i.test(raw)'));
   assert.ok(slideThumbnailsSource.includes('/<img\\b/i.test(raw)'));
   assert.ok(slideThumbnailsSource.includes('getCachedImagePath'));
   assert.ok(slideThumbnailsSource.includes('getThumbnailItem'));

test/slide-preview-renderer.test.js

@@ -6,6 +6,8 @@ const vm = require('node:vm');
 const { render } = require('../src/web/public/js/shared/slide-preview-renderer');
 const { buildThumbnailPreviewPayload } = require('../src/web/lib/media/slide-thumbnails');
 const placeholderUtils = require('../src/web/public/js/shared/placeholder-utils');
+const { resolveRegionContent } = require('../src/web/public/js/shared/region-content');
+const { getRegionEditorScripts } = require('../src/web/lib/region-scripts');
 
 function loadEditorTimeDateModule() {
   const source = fs.readFileSync(require.resolve('../src/web/public/js/regions/type/time-date.js'), 'utf8');
@@ -49,6 +51,49 @@ test('thumbnail payload passes saved region geometry and content to the popup re
   assert.equal(payload.existingContent.clock.timezone, 'Europe/London');
 });
 
+test('thumbnail popup respects template defaults, read-only regions and explicit slide content', () => {
+  const payload = buildThumbnailPreviewPayload({
+    template: {
+      canvas_size_width: 1280,
+      canvas_size_height: 720,
+      regions: [
+        { region_key: 'logo', region_type: 'image', read_only: 1, default_content: { value: '/media/uploads/template-logo.png' }, x: 0, y: 0, width: 200, height: 100 },
+        { region_key: 'heading', region_type: 'text', default_content: JSON.stringify({ value: 'Template heading' }), x: 0, y: 100, width: 400, height: 100 },
+        { region_key: 'custom', region_type: 'text', default_content: { value: 'Default custom' }, x: 0, y: 200, width: 400, height: 100 },
+        { region_key: 'blank', region_type: 'text', default_content: { value: 'Do not restore' }, x: 0, y: 300, width: 400, height: 100 }
+      ]
+    },
+    content: {
+      logo: { value: '/media/uploads/stale-logo.png' },
+      custom: { value: 'Slide heading' },
+      blank: { value: '' }
+    }
+  });
+
+  assert.equal(payload.regions[0].content.value, '/media/uploads/template-logo.png');
+  assert.equal(payload.regions[0].content.type, 'image');
+  assert.equal(payload.regions[1].content.value, 'Template heading');
+  assert.equal(payload.regions[2].content.value, 'Slide heading');
+  assert.equal(payload.regions[3].content.value, '');
+  assert.equal(payload.existingContent.logo.value, '/media/uploads/template-logo.png');
+  assert.equal(payload.existingContent.heading.value, 'Template heading');
+  assert.match(payload.html, /template-logo\.png/);
+  assert.match(payload.html, /Template heading/);
+  assert.match(payload.html, /Slide heading/);
+  assert.doesNotMatch(payload.html, /stale-logo|Default custom|Do not restore/);
+});
+
+test('editor and popup load the same browser-compatible content resolver', () => {
+  const sandbox = { window: {} };
+  vm.runInNewContext(fs.readFileSync(require.resolve('../src/web/public/js/shared/region-content'), 'utf8'), sandbox);
+  const region = { region_key: 'brand', region_type: 'text', read_only: true, default_content: { value: 'Shared brand' } };
+  const saved = { brand: { value: 'Stale brand' } };
+  assert.equal(JSON.stringify(sandbox.window.pulseRegionContent.resolveRegionContent(region, saved)), JSON.stringify(resolveRegionContent(region, saved)));
+  assert.ok(getRegionEditorScripts().includes('js/shared/region-content.js'));
+  const editorSource = fs.readFileSync(require.resolve('../src/web/public/js/slides/slide-form.js'), 'utf8');
+  assert.match(editorSource, /window\.pulseRegionContent\.resolveRegionContent\(region, existingContent\)/);
+});
+
 test('thumbnail regions use shared region renderers and their source context', () => {
   const calls = [];
   const registry = {

test/templates.test.js

@@ -13,7 +13,7 @@ const {
 const renderTemplateAddPage = require('../src/web/routes/signage/templates/add');
 const renderTemplateEditPage = require('../src/web/routes/signage/templates/edit');
 const { buildDuplicateTemplateName, buildDuplicateTemplate } = require('../src/web/routes/signage/templates/duplicate');
-const { buildThumbnailPreviewPayload } = require('../src/web/lib/media/slide-thumbnail-preview');
+const { buildThumbnailPreviewPayload } = require('../src/web/lib/media/slide-thumbnails');
 
 function readCssDeclarations(css, selector) {
   const escapedSelector = selector.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');