mnfst-render 0.5.5 → 0.5.6

package/manifest.render.mjs

@@ -1356,7 +1356,7 @@ function generateLocaleVariantHtml({
   html = stripEmptyInlineMaskStyles(html);
   html = stripResolvedXIconDirectives(html);
   // markPrerenderedManifestComponents must run BEFORE stripPrerenderHydrateMarkers so it can
-  // detect data-prerender-hydrate markers and skip components inside hydrate islands.
+  // detect data-hydrate markers and skip components inside hydrate islands.
   html = markPrerenderedManifestComponents(html);
 
   const fileSegments = pathToFileSegments(pathSeg ? '/' + pathSeg : '/');
@@ -2239,13 +2239,36 @@ async function runPrerender(config) {
       });
 
       // Strip x-markdown from elements that already have baked content.
-      // The markdown plugin hides elements with opacity:0 on init, then re-fetches and re-renders.
-      // For prerendered pages the content is already baked — removing x-markdown prevents the
-      // runtime plugin from re-processing (and temporarily hiding) the static content.
+      // The markdown plugin hides elements with opacity:0 on init, then re-fetches
+      // and re-renders.  For prerendered pages the content is already baked —
+      // removing x-markdown prevents the runtime plugin from re-processing (and
+      // temporarily hiding) the static content.
+      //
+      // We ALSO clear any leftover `opacity: 0` inline style the plugin set
+      // before/while rendering.  On dynamic expressions that initially evaluate
+      // empty (e.g. article content keyed off `$route` before `$x.articles` has
+      // loaded), the plugin sets opacity to 0 and may never restore it to 1 if
+      // the effect re-fires with an empty value.  The end state in the
+      // serialized HTML has rendered content but opacity:0 — invisible in
+      // production.  Since we're also removing x-markdown (so the runtime
+      // plugin doesn't re-hide the element), leaving the inline style would
+      // permanently hide authored content.
       await page.evaluate(() => {
         document.querySelectorAll('[x-markdown]').forEach((el) => {
           if (!el.textContent.trim() && !el.innerHTML.trim()) return;
           el.removeAttribute('x-markdown');
+          // Clean up opacity-0 + transition inline styles the plugin left behind.
+          const style = el.getAttribute('style') || '';
+          if (style) {
+            const cleaned = style
+              .replace(/\bopacity\s*:\s*0(?:\.\d+)?\s*;?/gi, '')
+              .replace(/\btransition\s*:\s*opacity[^;]*;?/gi, '')
+              .replace(/;\s*;/g, ';')
+              .replace(/^\s*;\s*|\s*;\s*$/g, '')
+              .trim();
+            if (cleaned) el.setAttribute('style', cleaned);
+            else el.removeAttribute('style');
+          }
         });
       });
 
@@ -2404,7 +2427,7 @@ async function runPrerender(config) {
       // $url, $auth, or iterates over getter names (filtered*, results, searchResults). See docs prerender + local.data.
       await page.evaluate(() => {
         document.querySelectorAll('template[x-for]').forEach((tpl) => {
-          if (tpl.hasAttribute('data-prerender-hydrate') || tpl.closest('[data-prerender-hydrate]')) {
+          if (tpl.hasAttribute('data-hydrate') || tpl.closest('[data-hydrate]')) {
             tpl.removeAttribute('data-prerender-collapsed');
             tpl.removeAttribute('data-prerender-static-generated');
             return;
@@ -2485,7 +2508,7 @@ async function runPrerender(config) {
       await page.evaluate(() => {
         const loopVarRx = /^\s*(?:\(\s*([A-Za-z_$][\w$]*)(?:\s*,\s*([A-Za-z_$][\w$]*))?\s*\)|([A-Za-z_$][\w$]*))\s+in\s+/;
         document.querySelectorAll('template[x-for][data-prerender-static-generated="1"]').forEach((tpl) => {
-          if (tpl.hasAttribute('data-prerender-hydrate') || tpl.closest('[data-prerender-hydrate]')) return;
+          if (tpl.hasAttribute('data-hydrate') || tpl.closest('[data-hydrate]')) return;
           const xFor = (tpl.getAttribute('x-for') || '').trim();
           const m = xFor.match(loopVarRx);
           const itemVar = m ? (m[1] || m[3] || '') : '';
@@ -2499,7 +2522,7 @@ async function runPrerender(config) {
             // Only process clones that contain data-hydrate descendants
             if (
               !n.hasAttribute('x-data') &&
-              (n.hasAttribute('data-prerender-hydrate') || n.querySelector('[data-prerender-hydrate]'))
+              (n.hasAttribute('data-hydrate') || n.querySelector('[data-hydrate]'))
             ) {
               try {
                 const A = window.Alpine;
@@ -2541,7 +2564,7 @@ async function runPrerender(config) {
           const nodes = [el, ...Array.from(el.querySelectorAll('*'))];
           for (const node of nodes) {
             // Skip elements inside data-hydrate islands — their bindings must remain live
-            if (node.hasAttribute('data-prerender-hydrate') || node.closest('[data-prerender-hydrate]')) continue;
+            if (node.hasAttribute('data-hydrate') || node.closest('[data-hydrate]')) continue;
             const attrs = node.attributes ? Array.from(node.attributes) : [];
             for (const attr of attrs) {
               if (!bindingAttrRegex.test(attr.name)) continue;
@@ -2579,7 +2602,7 @@ async function runPrerender(config) {
         };
 
         document.querySelectorAll('template[x-for]').forEach((tpl) => {
-          if (tpl.hasAttribute('data-prerender-hydrate') || tpl.closest('[data-prerender-hydrate]')) return;
+          if (tpl.hasAttribute('data-hydrate') || tpl.closest('[data-hydrate]')) return;
           const xFor = (tpl.getAttribute('x-for') || '').trim();
           const m = xFor.match(loopVarRegex);
           const itemVar = m ? (m[1] || m[3] || '') : '';
@@ -2608,7 +2631,7 @@ async function runPrerender(config) {
         const runBatch = typeof A?.mutateDom === 'function' ? (fn) => A.mutateDom(fn) : (fn) => fn();
         runBatch(() => {
           document.querySelectorAll('template[x-for][data-prerender-static-generated="1"]').forEach((tpl) => {
-            if (tpl.hasAttribute('data-prerender-hydrate') || tpl.closest('[data-prerender-hydrate]')) return;
+            if (tpl.hasAttribute('data-hydrate') || tpl.closest('[data-hydrate]')) return;
             const parent = tpl.parentNode;
             if (!parent) {
               tpl.remove();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mnfst-render",
-  "version": "0.5.5",
+  "version": "0.5.6",
   "description": "Render Manifest sites to static HTML for SEO",
   "type": "module",
   "bin": {