nodebb-plugin-ezoic-infinite 1.5.34 → 1.5.35

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nodebb-plugin-ezoic-infinite",
-  "version": "1.5.34",
+  "version": "1.5.35",
   "description": "Production-ready Ezoic infinite ads integration for NodeBB 4.x",
   "main": "library.js",
   "license": "MIT",

package/public/client.js

@@ -383,7 +383,33 @@ function withInternalDomChange(fn) {
     } catch (e) {}
   }
 
-  function pruneOrphanWraps(kindClass, items) {
+  
+  function findWrapById(id) {
+    try {
+      return document.querySelector(`.${WRAP_CLASS}[data-ezoic-wrapid="${id}"]`);
+    } catch (e) {}
+    return null;
+  }
+
+  function armPlaceholder(wrap, id) {
+    try {
+      if (!wrap || !wrap.isConnected) return null;
+      const domId = `${PLACEHOLDER_PREFIX}${id}`;
+
+      // If the id is already present somewhere, do not reassign it.
+      const existing = document.getElementById(domId);
+      if (existing && existing.isConnected) return existing;
+
+      const ph = wrap.querySelector('[data-ezoic-ph="1"]');
+      if (!ph) return null;
+
+      if (!ph.id) ph.id = domId;
+      return ph;
+    } catch (e) {}
+    return null;
+  }
+
+function pruneOrphanWraps(kindClass, items) {
     if (!items || !items.length) return 0;
     const itemSet = new Set(items);
     const wraps = document.querySelectorAll(`.${WRAP_CLASS}.${kindClass}`);
@@ -421,8 +447,10 @@ function buildWrap(id, kindClass, afterPos) {
     wrap.style.width = '100%';
 
     const ph = document.createElement('div');
-    ph.id = `${PLACEHOLDER_PREFIX}${id}`;
+    // Do not assign the Ezoic placeholder id until we actually want to load the ad.
+    // This avoids Ezoic defining placeholders too early during DOM churn/infinite scroll.
     ph.setAttribute('data-ezoic-id', String(id));
+    ph.setAttribute('data-ezoic-ph', '1');
     wrap.appendChild(ph);
 
     return wrap;
@@ -437,8 +465,8 @@ function buildWrap(id, kindClass, afterPos) {
     if (findWrap(kindClass, afterPos)) return null;
     if (insertingIds.has(id)) return null;
 
-    const existingPh = document.getElementById(`${PLACEHOLDER_PREFIX}${id}`);
-    if (existingPh && existingPh.isConnected) return null;
+        const existingWrap = findWrapById(id);
+    if (existingWrap && existingWrap.isConnected) return null;
 
     insertingIds.add(id);
     try {
@@ -460,8 +488,8 @@ function buildWrap(id, kindClass, afterPos) {
       state[cursorKey] = (state[cursorKey] + 1) % n;
 
       const id = allIds[idx];
-      const ph = document.getElementById(`${PLACEHOLDER_PREFIX}${id}`);
-      if (ph && ph.isConnected) continue;
+            const w = findWrapById(id);
+      if (w && w.isConnected) continue;
 
       return id;
     }
@@ -488,8 +516,8 @@ function buildWrap(id, kindClass, afterPos) {
       withInternalDomChange(() => {
         // Unobserve placeholder if still observed
         try {
-          const ph = victim.querySelector && victim.querySelector(`[id^="${PLACEHOLDER_PREFIX}"]`);
-          if (ph && state.io) state.io.unobserve(ph);
+          const t = victim;
+          if (t && state.io) state.io.unobserve(t);
         } catch (e) {}
 
         try { if (id) safeDestroyById(id); } catch (e) {}
@@ -604,9 +632,12 @@ function startShow(id) {
           const el = ent.target;
           try { state.io && state.io.unobserve(el); } catch (e) {}
 
-          const idAttr = el && el.getAttribute && el.getAttribute('data-ezoic-id');
+          const idAttr = el && el.getAttribute && el.getAttribute('data-ezoic-wrapid');
           const id = parseInt(idAttr, 10);
-          if (Number.isFinite(id) && id > 0) enqueueShow(id);
+          if (Number.isFinite(id) && id > 0) {
+            armPlaceholder(el, id);
+            enqueueShow(id);
+          }
         }
       }, { root: null, rootMargin: desiredMargin, threshold: 0 });
       state.ioMargin = desiredMargin;
@@ -618,7 +649,7 @@ function startShow(id) {
     // If we rebuilt the observer, re-observe existing placeholders so we don't miss them.
     try {
       if (state.io) {
-        const nodes = document.querySelectorAll(`[id^="${PLACEHOLDER_PREFIX}"]`);
+        const nodes = document.querySelectorAll(`.${WRAP_CLASS}[data-ezoic-wrapid]`);
         nodes.forEach((n) => { try { state.io.observe(n); } catch (e) {} });
       }
     } catch (e) {}
@@ -626,17 +657,20 @@ function startShow(id) {
   }
 
   function observePlaceholder(id) {
-    const ph = document.getElementById(`${PLACEHOLDER_PREFIX}${id}`);
-    if (!ph || !ph.isConnected) return;
+    const wrap = findWrapById(id);
+    if (!wrap || !wrap.isConnected) return;
     const io = ensurePreloadObserver();
-    try { io && io.observe(ph); } catch (e) {}
+    try { io && io.observe(wrap); } catch (e) {}
 
-    // If already above fold, fire immediately
+    // If already near the fold, arm & fire immediately
     try {
-      const r = ph.getBoundingClientRect();
+      const r = wrap.getBoundingClientRect();
       const screens = isBoosted() ? 5.0 : 3.0;
-      const minBottom = isBoosted() ? -1500 : -800;
-      if (r.top < window.innerHeight * screens && r.bottom > minBottom) enqueueShow(id);
+      const h = (window.innerHeight || 800);
+      if (r.top < screens * h && r.bottom > -screens * h) {
+        armPlaceholder(wrap, id);
+        enqueueShow(id);
+      }
     } catch (e) {}
   }