diff --git a/server.ts b/server.ts index 2d5c3f3..6bfa6e3 100644 --- a/server.ts +++ b/server.ts @@ -72,7 +72,17 @@ const COLOR_MAP: ReadonlyArray<{ field: keyof StationConfig; prop: string }> = [ ]; /** - * Resolve the static browser index.html path. + * Resolve the static CSR shell path (index.csr.html). + * + * IMPORTANT: We MUST prefer index.csr.html over index.html. + * The Angular build with prerender config produces both: + * - index.html: prerendered at build time with stale DEFAULT_CONFIG baked in + * - index.csr.html: pure CSR shell with empty — Angular hydrates client-side + * + * Serving index.html to regular users causes the flash: the prerendered DOM + * shows stale build-time content until Angular re-renders with fresh data. + * Even with window.__STATION_CONFIG injection, the prerendered innerHTML inside + * still shows old content on the first paint. * * Production (Docker): browser files are copied to /usr/share/nginx/html/ * Local dev (ng build): browser files live in dist/radio-station/browser/ @@ -80,9 +90,11 @@ const COLOR_MAP: ReadonlyArray<{ field: keyof StationConfig; prop: string }> = [ */ function browserIndexPath(): string { // Production path — Dockerfile copies browser output here + // CSR shell first — avoid prerendered index.html with stale content const productionPaths = [ - '/usr/share/nginx/html/index.html', '/usr/share/nginx/html/index.csr.html', + '/usr/share/nginx/html/index.html', + '/var/www/html/index.csr.html', '/var/www/html/index.html', ];