mnfst-render 0.1.1 → 0.1.3

package/manifest.render.mjs

@@ -384,8 +384,10 @@ function stripPrerenderDynamicBindings(html) {
     const bindingRegex = /(?:^|\s)(?::|x-bind:)(\w+)=(?:"([^"]*)"|'([^']*)')/g;
     let m;
     while ((m = bindingRegex.exec(attrsStr)) !== null) {
+      const attrName = (m[1] || '').toLowerCase();
+      if (attrName === 'class' || attrName === 'style') continue;
       const val = (m[2] !== undefined ? m[2] : m[3]) || '';
-      if (val.indexOf('$x') === -1) toStrip.add(m[1].toLowerCase());
+      if (val.indexOf('$x') === -1) toStrip.add(attrName);
     }
     if (toStrip.size === 0) return match;
     let newAttrs = attrsStr;
@@ -946,6 +948,50 @@ async function runPrerender(config) {
         });
       });
 
+      // Remove orphan x-for clones that still reference loop-scope vars (e.g. image/index)
+      // outside their template scope. These throw Alpine errors in live static hosting.
+      await page.evaluate(() => {
+        const loopVarRegex = /^\s*(?:\(\s*([A-Za-z_$][\w$]*)(?:\s*,\s*([A-Za-z_$][\w$]*))?\s*\)|([A-Za-z_$][\w$]*))\s+in\s+/;
+        const bindingAttrRegex = /^(?:x-bind:|:|x-text|x-html|x-show|x-if|x-model|x-effect|x-on:|@)/;
+
+        document.querySelectorAll('template[x-for]').forEach((tpl) => {
+          const xFor = (tpl.getAttribute('x-for') || '').trim();
+          const m = xFor.match(loopVarRegex);
+          const itemVar = m ? (m[1] || m[3] || '') : '';
+          const indexVar = m ? (m[2] || '') : '';
+          if (!itemVar && !indexVar) return;
+
+          const first = tpl.content?.firstElementChild;
+          if (!first) return;
+          const tag = first.tagName;
+
+          let next = tpl.nextElementSibling;
+          while (next) {
+            const sameTag = next.tagName === tag;
+            if (!sameTag) break;
+
+            let referencesLoopScope = false;
+            const attrNodes = next.attributes ? Array.from(next.attributes) : [];
+            for (const attr of attrNodes) {
+              if (!bindingAttrRegex.test(attr.name)) continue;
+              const expr = attr.value || '';
+              if (
+                (itemVar && new RegExp(`\\b${itemVar}\\b`).test(expr)) ||
+                (indexVar && new RegExp(`\\b${indexVar}\\b`).test(expr))
+              ) {
+                referencesLoopScope = true;
+                break;
+              }
+            }
+
+            const toRemove = next;
+            next = next.nextElementSibling;
+            if (referencesLoopScope) toRemove.remove();
+            else break;
+          }
+        });
+      });
+
       // Remove elements marked data-dynamic (so they are not in static HTML; client will render them).
       // Skip <template> since we only collapse those above; other elements and their subtree are removed.
       await page.evaluate(() => {

package/package.json

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