meno-core 1.0.53 → 1.1.0

package/lib/server/ssr/htmlGenerator.test.ts

@@ -2,21 +2,85 @@
  * Tests for htmlGenerator - SSR HTML document generation
  */
 
-import { describe, test, expect, mock, beforeEach } from 'bun:test';
+import { describe, test, expect, mock, beforeEach, afterAll } from 'bun:test';
 
 // ---- Mock all dependencies before importing the module under test ----
 
-const mockRenderPageSSR = mock(async () => ({
-  html: '<div>Test Content</div>',
-  meta: '<title>Test Page</title>',
-  title: 'Test Page',
-  javascript: '',
-  componentCSS: '',
-  locale: 'en',
-  interactiveStylesMap: new Map(),
-  preloadImages: [],
-  neededCollections: new Set<string>(),
-}));
+// bun's mock.module() patches are PROCESS-GLOBAL and persist across test
+// files in the same run. Snapshot the real module exports here (imports are
+// evaluated before this module body runs, so these capture the originals)
+// and restore them in afterAll so later test files (e.g.
+// routes/api/colors.test.ts, services/configService.test.ts) see the real
+// implementations.
+import * as realSsrRenderer from './ssrRenderer';
+import * as realConfigServiceModule from '../services/configService';
+import * as realJsonLoader from '../jsonLoader';
+import * as realFontLoader from '../../shared/fontLoader';
+import * as realColorServiceModule from '../services/ColorService';
+import * as realCssGenerator from '../cssGenerator';
+import * as realCssGeneration from '../../shared/cssGeneration';
+import * as realValidateStyleCoverage from '../validateStyleCoverage';
+import * as realFormHandler from '../../client/scripts/formHandler';
+import * as realMenoFilterScript from '../../client/meno-filter/script.generated';
+import * as realClientDataInjector from './clientDataInjector';
+import * as realLibraryLoader from '../../shared/libraryLoader';
+
+const REAL_SSR_RENDERER = { ...realSsrRenderer };
+const REAL_CONFIG_SERVICE_MODULE = { ...realConfigServiceModule };
+const REAL_JSON_LOADER = { ...realJsonLoader };
+const REAL_FONT_LOADER = { ...realFontLoader };
+const REAL_COLOR_SERVICE_MODULE = { ...realColorServiceModule };
+const REAL_CSS_GENERATOR = { ...realCssGenerator };
+const REAL_CSS_GENERATION = { ...realCssGeneration };
+const REAL_VALIDATE_STYLE_COVERAGE = { ...realValidateStyleCoverage };
+const REAL_FORM_HANDLER = { ...realFormHandler };
+const REAL_MENO_FILTER_SCRIPT = { ...realMenoFilterScript };
+const REAL_CLIENT_DATA_INJECTOR = { ...realClientDataInjector };
+const REAL_LIBRARY_LOADER = { ...realLibraryLoader };
+
+afterAll(() => {
+  mock.module('./ssrRenderer', () => REAL_SSR_RENDERER);
+  mock.module('../services/configService', () => REAL_CONFIG_SERVICE_MODULE);
+  mock.module('../jsonLoader', () => REAL_JSON_LOADER);
+  mock.module('../../shared/fontLoader', () => REAL_FONT_LOADER);
+  mock.module('../services/ColorService', () => REAL_COLOR_SERVICE_MODULE);
+  mock.module('../cssGenerator', () => REAL_CSS_GENERATOR);
+  mock.module('../../shared/cssGeneration', () => REAL_CSS_GENERATION);
+  mock.module('../validateStyleCoverage', () => REAL_VALIDATE_STYLE_COVERAGE);
+  mock.module('../../client/scripts/formHandler', () => REAL_FORM_HANDLER);
+  mock.module('../../client/meno-filter/script.generated', () => REAL_MENO_FILTER_SCRIPT);
+  mock.module('./clientDataInjector', () => REAL_CLIENT_DATA_INJECTOR);
+  mock.module('../../shared/libraryLoader', () => REAL_LIBRARY_LOADER);
+});
+
+// Explicit result type for the renderPageSSR mock: keeps array/Map fields
+// wide (PreloadImage[] instead of the inferred never[]) so per-test
+// mockImplementation calls with non-empty fixtures typecheck.
+type MockRenderPageSSRResult = {
+  html: string;
+  meta: string;
+  title: string;
+  javascript: string;
+  componentCSS: string;
+  locale: string;
+  interactiveStylesMap: Map<string, InteractiveStyles>;
+  preloadImages: PreloadImage[];
+  neededCollections: Set<string>;
+};
+
+const mockRenderPageSSR = mock(
+  async (): Promise<MockRenderPageSSRResult> => ({
+    html: '<div>Test Content</div>',
+    meta: '<title>Test Page</title>',
+    title: 'Test Page',
+    javascript: '',
+    componentCSS: '',
+    locale: 'en',
+    interactiveStylesMap: new Map(),
+    preloadImages: [],
+    neededCollections: new Set<string>(),
+  }),
+);
 
 mock.module('./ssrRenderer', () => ({
   renderPageSSR: mockRenderPageSSR,
@@ -97,7 +161,8 @@ mock.module('../../client/meno-filter/script.generated', () => ({
 }));
 
 const mockGenerateAllInlineDataScripts = mock(() => '');
-const mockPrepareClientData = mock(() => null);
+// Wide return type so tests can mockReturnValue a real ClientDataCollection.
+const mockPrepareClientData = mock((): ClientDataCollection | null => null);
 
 mock.module('./clientDataInjector', () => ({
   generateAllInlineDataScripts: mockGenerateAllInlineDataScripts,
@@ -111,7 +176,9 @@ mock.module('../../shared/libraryLoader', () => ({
 
 // Now import the module under test
 import { generateSSRHTML } from './htmlGenerator';
-import type { GenerateSSRHTMLOptions, SSRHTMLResult } from './htmlGenerator';
+import type { PreloadImage } from './ssrRenderer';
+import type { ClientDataCollection } from './clientDataInjector';
+import type { InteractiveStyles } from '../../shared/types';
 
 // ---- Fixtures ----
 
@@ -223,7 +290,8 @@ describe('generateSSRHTML', () => {
   describe('CSS injection', () => {
     test('should contain a style tag with base reset CSS', async () => {
       const result = (await generateSSRHTML(minimalPage)) as string;
-      expect(result).toContain('<style>');
+      // The main style tag carries id="meno-styles" so hot reload can patch it in place
+      expect(result).toContain('<style id="meno-styles">');
       expect(result).toContain('</style>');
       // base reset includes the universal selector
       expect(result).toContain('box-sizing: border-box');
@@ -259,9 +327,7 @@ describe('generateSSRHTML', () => {
         neededCollections: new Set<string>(),
       }));
 
-      const result = (await generateSSRHTML(
-        minimalPage, {}, '/', '', true
-      )) as string;
+      const result = (await generateSSRHTML(minimalPage, {}, '/', '', true)) as string;
 
       // Minified CSS should not have unnecessary whitespace
       expect(result).not.toContain('.test {\n  color: blue;\n');
@@ -309,8 +375,8 @@ describe('generateSSRHTML', () => {
     });
 
     test('should include interactive CSS when interactiveStylesMap is non-empty', async () => {
-      const stylesMap = new Map();
-      stylesMap.set('btn-hover', { hover: { backgroundColor: 'blue' } });
+      const stylesMap = new Map<string, InteractiveStyles>();
+      stylesMap.set('btn-hover', [{ postfix: ':hover', style: { backgroundColor: 'blue' } }]);
 
       mockRenderPageSSR.mockImplementation(async () => ({
         html: '<div>Content</div>',
@@ -334,9 +400,7 @@ describe('generateSSRHTML', () => {
 
   describe('JavaScript handling', () => {
     test('should not include client script in production mode', async () => {
-      const result = (await generateSSRHTML(
-        minimalPage, {}, '/', '', true
-      )) as string;
+      const result = (await generateSSRHTML(minimalPage, {}, '/', '', true)) as string;
       expect(result).not.toContain('client-router.tsx');
     });
 
@@ -397,7 +461,16 @@ describe('generateSSRHTML', () => {
       }));
 
       const result = (await generateSSRHTML(
-        minimalPage, {}, '/', '', false, undefined, undefined, undefined, undefined, '/_scripts/abc123.js'
+        minimalPage,
+        {},
+        '/',
+        '',
+        false,
+        undefined,
+        undefined,
+        undefined,
+        undefined,
+        '/_scripts/abc123.js',
       )) as string;
 
       expect(result).toContain('<script src="/_scripts/abc123.js" defer></script>');
@@ -418,9 +491,9 @@ describe('generateSSRHTML', () => {
       }));
 
       const result = await generateSSRHTML({
-        pageData: minimalPage as any,
+        pageData: minimalPage,
         returnSeparateJS: true,
-      } as any) as SSRHTMLResult;
+      });
 
       expect(result).toHaveProperty('html');
       expect(result).toHaveProperty('javascript');
@@ -432,9 +505,9 @@ describe('generateSSRHTML', () => {
 
     test('should return null javascript when no JS is generated with returnSeparateJS', async () => {
       const result = await generateSSRHTML({
-        pageData: minimalPage as any,
+        pageData: minimalPage,
         returnSeparateJS: true,
-      } as any) as SSRHTMLResult;
+      });
 
       expect(result.javascript).toBeNull();
     });
@@ -444,7 +517,7 @@ describe('generateSSRHTML', () => {
       // Should still have the client router, but no <script> with inline JS
       const scriptTags = result.match(/<script[^>]*>[\s\S]*?<\/script>/g) || [];
       const inlineScriptTags = scriptTags.filter(
-        (s: string) => !s.includes('src=') && !s.includes('type="application/json"')
+        (s: string) => !s.includes('src=') && !s.includes('type="application/json"'),
       );
       expect(inlineScriptTags.length).toBe(0);
     });
@@ -573,7 +646,7 @@ describe('generateSSRHTML', () => {
       });
 
       mockGenerateAllInlineDataScripts.mockReturnValue(
-        '<script type="application/json" id="meno-cms-posts">[{"_id":"1","title":"Test"}]</script>'
+        '<script type="application/json" id="meno-cms-posts">[{"_id":"1","title":"Test"}]</script>',
       );
 
       const result = (await generateSSRHTML({
@@ -763,7 +836,7 @@ describe('generateSSRHTML', () => {
         // and updates attrs/classes/text in place, so event handlers, DOM identity
         // and JS-built nodes survive.
         expect(result).toContain('softSync(or,nr,lastSrvRoot)');
-        expect(result).toContain('querySelectorAll(\'[data-element-path]\')');
+        expect(result).toContain("querySelectorAll('[data-element-path]')");
       });
 
       test('preserves runtime-added classes against cached server snapshot', async () => {
@@ -823,16 +896,14 @@ describe('generateSSRHTML', () => {
         })) as string;
         // Must not contain the old unconditional pattern where oscr is removed
         // outside of a hash-mismatch branch.
-        expect(result).not.toContain('if(nscr){var src=nscr.getAttribute(\'src\');if(oscr)oscr.remove()');
+        expect(result).not.toContain("if(nscr){var src=nscr.getAttribute('src');if(oscr)oscr.remove()");
       });
     });
   });
 
   describe('Options object vs legacy positional args', () => {
     test('should work with legacy positional arguments', async () => {
-      const result = (await generateSSRHTML(
-        minimalPage, {}, '/about', '', false, 'en'
-      )) as string;
+      const result = (await generateSSRHTML(minimalPage, {}, '/about', '', false, 'en')) as string;
 
       expect(typeof result).toBe('string');
       expect(result).toContain('<!DOCTYPE html>');
@@ -872,6 +943,8 @@ describe('generateSSRHTML', () => {
         undefined, // slugMappings
         undefined, // cmsContext
         undefined, // cmsService
+        false, // isProductionBuild (defaults to false)
+        false, // injectEditorAttrs (defaults to false)
       );
     });
   });
@@ -967,10 +1040,10 @@ describe('generateSSRHTML', () => {
         neededCollections: new Set<string>(),
       }));
 
-      const result = (await generateSSRHTML({
-        pageData: minimalPage as any,
+      const result = await generateSSRHTML({
+        pageData: minimalPage,
         returnSeparateJS: true,
-      } as any)) as SSRHTMLResult;
+      });
 
       expect(result.javascript).toContain('window.__MENO_CONFIG__=');
       expect(result.javascript).toContain('console.log("test")');
@@ -1030,7 +1103,7 @@ describe('generateSSRHTML', () => {
   describe('Font preload tags', () => {
     test('should include font preload tags when present', async () => {
       mockGenerateFontPreloadTags.mockReturnValue(
-        '<link rel="preload" href="/font.woff2" as="font" type="font/woff2" crossorigin>'
+        '<link rel="preload" href="/font.woff2" as="font" type="font/woff2" crossorigin>',
       );
 
       const result = (await generateSSRHTML(minimalPage)) as string;
@@ -1064,13 +1137,16 @@ describe('generateSSRHTML', () => {
 
       mockPrepareClientData.mockReturnValue({
         collection: 'categories',
-        items: [{ _id: '1', name: 'Tech' }, { _id: '2', name: 'Design' }],
+        items: [
+          { _id: '1', name: 'Tech' },
+          { _id: '2', name: 'Design' },
+        ],
         config: { enabled: true, strategy: 'inline' as const },
         strategy: 'inline' as const,
       });
 
       mockGenerateAllInlineDataScripts.mockReturnValue(
-        '<script type="application/json" id="meno-cms-categories">[{"_id":"1"},{"_id":"2"}]</script>'
+        '<script type="application/json" id="meno-cms-categories">[{"_id":"1"},{"_id":"2"}]</script>',
       );
 
       await generateSSRHTML({
@@ -1111,15 +1187,15 @@ describe('generateSSRHTML', () => {
       });
 
       console.warn = originalWarn;
-      expect(warnings.some(w => w.includes('events'))).toBe(true);
-      expect(warnings.some(w => w.includes('clientData.enabled'))).toBe(true);
+      expect(warnings.some((w) => w.includes('events'))).toBe(true);
+      expect(warnings.some((w) => w.includes('clientData.enabled'))).toBe(true);
     });
   });
 
   describe('Base reset CSS content', () => {
     test('should include body font-family reset', async () => {
       const result = (await generateSSRHTML(minimalPage)) as string;
-      expect(result).toContain("font-family: -apple-system");
+      expect(result).toContain('font-family: -apple-system');
     });
 
     test('should include button reset styles', async () => {