nodebb-plugin-ezoic-infinite 1.5.66 → 1.5.68

package/package.json

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

package/public/client.js

@@ -82,10 +82,6 @@
     io: null,
     runQueued: false,
 
-    needsMoreRun: false,
-    moreRunBurst: 0,
-    moreRunLast: 0,
-
     // preloading budget
     inflight: 0,
     pending: [],
@@ -99,19 +95,40 @@
 
     // hero)
     heroDoneForPage: false,
+    burstRuns: 0,
   };
 
   const insertingIds = new Set();
 
-  function unemptyIfFilled(wrap, ph) {
-    try {
-      if (!wrap || !ph) return false;
-      const hasAd = !!(ph.querySelector && ph.querySelector('iframe, ins, img, .ez-ad, .ezoic-ad'));
-      if (hasAd) wrap.classList.remove('is-empty');
-      return hasAd;
-    } catch (e) { return false; }
+  // Hidden pool where we keep placeholder DIVs when they are not currently
+  // mounted in the content flow. This avoids:
+  //  - Ezoic trying to act on ids that were removed from the DOM ("does not exist")
+  //  - re-defining placeholders (we re-use the same node)
+  const POOL_ID = 'nodebb-ezoic-placeholder-pool';
+  function getPoolEl() {
+    let el = document.getElementById(POOL_ID);
+    if (el) return el;
+    el = document.createElement('div');
+    el.id = POOL_ID;
+    el.style.cssText = 'position:fixed;left:-99999px;top:-99999px;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none;';
+    (document.body || document.documentElement).appendChild(el);
+    return el;
+  }
+
+  function isInPool(ph) {
+    try { return !!(ph && ph.closest && ph.closest('#' + POOL_ID)); } catch (e) { return false; }
   }
 
+  function releaseWrapNode(wrap) {
+    try {
+      const ph = wrap && wrap.querySelector && wrap.querySelector(`[id^="${PLACEHOLDER_PREFIX}"]`);
+      if (ph) {
+        try { getPoolEl().appendChild(ph); } catch (e) {}
+        try { if (state.io) state.io.unobserve(ph); } catch (e) {}
+      }
+    } catch (e) {}
+    try { wrap && wrap.remove && wrap.remove(); } catch (e) {}
+  }
 
 
   function markEmptyWrapper(id) {
@@ -130,17 +147,6 @@
           // consider empty if only whitespace and no iframes/ins/img
           const hasAd = !!(ph2.querySelector && ph2.querySelector('iframe, ins, img, .ez-ad, .ezoic-ad'));
           if (!hasAd) w2.classList.add('is-empty');
-          // If the ad fills later, immediately uncollapse to avoid "missing ads" perception.
-          if (!unemptyIfFilled(w2, ph2)) {
-            try {
-              const mo = new MutationObserver(() => {
-                if (unemptyIfFilled(w2, ph2)) { try { mo.disconnect(); } catch (e) {} }
-              });
-              mo.observe(ph2, { childList: true, subtree: true });
-              // safety stop
-              setTimeout(() => { try { mo.disconnect(); } catch (e) {} }, 30000);
-            } catch (e) {}
-          }
         } catch (e) {}
       }, 3500);
     } catch (e) {}
@@ -259,40 +265,22 @@
         window.__nodebbEzoicPatched = true;
         const orig = ez.showAds;
 
-        // Important: preserve the original calling convention.
-        // Some Ezoic builds expect an array; calling one-by-one can lead to
-        // repeated define attempts and "Placeholder Id ... already been defined".
         ez.showAds = function (...args) {
           if (isBlocked()) return;
 
-          const now = Date.now();
           let ids = [];
-          const isArrayCall = (args.length === 1 && Array.isArray(args[0]));
-          if (isArrayCall) ids = args[0];
+          if (args.length === 1 && Array.isArray(args[0])) ids = args[0];
           else ids = args;
 
-          const filtered = [];
           const seen = new Set();
           for (const v of ids) {
             const id = parseInt(v, 10);
             if (!Number.isFinite(id) || id <= 0 || seen.has(id)) continue;
             const ph = document.getElementById(`${PLACEHOLDER_PREFIX}${id}`);
             if (!ph || !ph.isConnected) continue;
-
-            // Extra throttle to avoid rapid duplicate defines during ajaxify churn
-            const last = state.lastShowById.get(id) || 0;
-            if (now - last < 650) continue;
-            state.lastShowById.set(id, now);
-
             seen.add(id);
-            filtered.push(id);
+            try { orig.call(ez, id); } catch (e) {}
           }
-
-          if (!filtered.length) return;
-          try {
-            if (isArrayCall) orig.call(ez, filtered);
-            else orig.apply(ez, filtered);
-          } catch (e) {}
         };
       } catch (e) {}
     };
@@ -390,27 +378,17 @@ function withInternalDomChange(fn) {
       // NodeBB can insert separators/spacers; accept an anchor within a few previous siblings
       let ok = false;
       let prev = wrap.previousElementSibling;
-      for (let i = 0; i < 8 && prev; i++) {
+      for (let i = 0; i < 3 && prev; i++) {
         if (itemSet.has(prev)) { ok = true; break; }
         prev = prev.previousElementSibling;
       }
 
-      // If it is already filled (iframe/ins/img), be conservative and keep it.
-      // Prevents ads "disappearing too fast" during ajaxify churn / minor rerenders.
       if (!ok) {
-        try {
-          const ph = wrap.querySelector && wrap.querySelector(`[id^="${PLACEHOLDER_PREFIX}"]`);
-          const filled = !!(ph && ph.querySelector && ph.querySelector('iframe, ins, img, .ez-ad, .ezoic-ad'));
-          if (filled) ok = true;
-        } catch (e) {}
-      }
-
-      if (!ok) {
-        const id = getWrapIdFromWrap(wrap);
         withInternalDomChange(() => {
           try {
-            if (id) safeDestroyById(id);
-            wrap.remove();
+            // Do not destroy placeholders; move them back to the pool so
+            // Ezoic won't log "does not exist" and we can reuse them later.
+            releaseWrapNode(wrap);
           } catch (e) {}
         });
         removed++;
@@ -421,28 +399,6 @@ function withInternalDomChange(fn) {
     return removed;
   }
 
-  function declusterWraps(kindClass) {
-    try {
-      const wraps = Array.from(document.querySelectorAll(`.${WRAP_CLASS}.${kindClass}`));
-      if (wraps.length < 2) return;
-      for (let i = 1; i < wraps.length; i++) {
-        const w = wraps[i];
-        if (!w || !w.isConnected) continue;
-        // If previous siblings contain another wrap within 2 hops, remove this one.
-        let prev = w.previousElementSibling;
-        let hops = 0;
-        while (prev && hops < 3) {
-          if (prev.classList && prev.classList.contains(WRAP_CLASS)) {
-            withInternalDomChange(() => { try { w.remove(); } catch (e) {} });
-            break;
-          }
-          prev = prev.previousElementSibling;
-          hops++;
-        }
-      }
-    } catch (e) {}
-  }
-
   function refreshEmptyState(id) {
     // After Ezoic has had a moment to fill the placeholder, toggle the CSS class.
     window.setTimeout(() => {
@@ -458,20 +414,14 @@ function withInternalDomChange(fn) {
     }, 3500);
   }
 
-function buildWrap(id, kindClass, afterPos, existingPlaceholder) {
+function buildWrap(id, kindClass, afterPos, createPlaceholder) {
     const wrap = document.createElement('div');
     wrap.className = `${WRAP_CLASS} ${kindClass}`;
     wrap.setAttribute('data-ezoic-after', String(afterPos));
     wrap.setAttribute('data-ezoic-wrapid', String(id));
     wrap.style.width = '100%';
 
-    if (existingPlaceholder && existingPlaceholder.nodeType === 1) {
-      try {
-        existingPlaceholder.id = `${PLACEHOLDER_PREFIX}${id}`;
-        existingPlaceholder.setAttribute('data-ezoic-id', String(id));
-      } catch (e) {}
-      wrap.appendChild(existingPlaceholder);
-    } else {
+    if (createPlaceholder) {
       const ph = document.createElement('div');
       ph.id = `${PLACEHOLDER_PREFIX}${id}`;
       ph.setAttribute('data-ezoic-id', String(id));
@@ -490,28 +440,28 @@ function buildWrap(id, kindClass, afterPos, existingPlaceholder) {
     if (findWrap(kindClass, afterPos)) return null;
     if (insertingIds.has(id)) return null;
 
+    const existingPh = document.getElementById(`${PLACEHOLDER_PREFIX}${id}`);
+
     insertingIds.add(id);
     try {
-      const existingPh = document.getElementById(`${PLACEHOLDER_PREFIX}${id}`);
-
-      // CRITICAL: never create a second element with the same id, even briefly.
-      // That can trigger "Placeholder Id ... already been defined" during load.
-      // If an existing placeholder already exists, move it into the new wrapper
-      // before inserting the wrapper into the DOM.
-      let moved = null;
-      if (existingPh && existingPh.isConnected) {
-        moved = existingPh;
-        // If it was inside one of our wrappers, drop that empty wrapper.
+      // If a placeholder already exists (either in content or in our pool),
+      // do NOT create a new DOM node with the same id even temporarily.
+      const wrap = buildWrap(id, kindClass, afterPos, !existingPh);
+      target.insertAdjacentElement('afterend', wrap);
+
+      // If a placeholder with this id already exists elsewhere (some Ezoic flows
+      // pre-create placeholders), move it into our wrapper instead of aborting.
+      // replaceChild moves the node atomically (no detach window).
+      if (existingPh) {
         try {
-          const oldWrap = moved.closest && moved.closest(`.${WRAP_CLASS}`);
-          if (oldWrap && oldWrap.parentNode) {
-            withInternalDomChange(() => { try { oldWrap.remove(); } catch (e) {} });
-          }
-        } catch (e) {}
+          existingPh.setAttribute('data-ezoic-id', String(id));
+          // If we didn't create a placeholder, just append.
+          if (!wrap.firstElementChild) wrap.appendChild(existingPh);
+          else wrap.replaceChild(existingPh, wrap.firstElementChild);
+        } catch (e) {
+          // Keep the new placeholder if replace fails.
+        }
       }
-
-      const wrap = buildWrap(id, kindClass, afterPos, moved);
-      target.insertAdjacentElement('afterend', wrap);
       return wrap;
     } finally {
       insertingIds.delete(id);
@@ -529,7 +479,9 @@ function buildWrap(id, kindClass, afterPos, existingPlaceholder) {
 
       const id = allIds[idx];
       const ph = document.getElementById(`${PLACEHOLDER_PREFIX}${id}`);
-      if (ph && ph.isConnected) continue;
+      // If placeholder is currently mounted in the content flow, skip.
+      // If it's in our hidden pool, it's available for reuse.
+      if (ph && ph.isConnected && !isInPool(ph)) continue;
 
       return id;
     }
@@ -551,13 +503,7 @@ function buildWrap(id, kindClass, afterPos, existingPlaceholder) {
       // Otherwise remove the earliest one in the document
       if (!victim) victim = wraps[0];
 
-      // Unobserve placeholder if still observed
-      try {
-        const ph = victim.querySelector && victim.querySelector(`[id^="${PLACEHOLDER_PREFIX}"]`);
-        if (ph && state.io) state.io.unobserve(ph);
-      } catch (e) {}
-
-      victim.remove();
+      releaseWrapNode(victim);
       return true;
     } catch (e) {
       return false;
@@ -720,10 +666,8 @@ function startShow(id) {
     let inserted = 0;
     const maxInserts = MAX_INSERTS_PER_RUN + (isBoosted() ? 1 : 0);
 
-    let hitLimit = false;
-
     for (const afterPos of targets) {
-      if (inserted >= maxInserts) { hitLimit = true; break; }
+      if (inserted >= maxInserts) break;
 
       const el = items[afterPos - 1];
       if (!el || !el.isConnected) continue;
@@ -755,11 +699,6 @@ function startShow(id) {
       inserted += 1;
     }
 
-    if (hitLimit) {
-      // We intentionally cap per run for smoothness. If we hit the cap, queue another pass.
-      state.needsMoreRun = true;
-    }
-
     return inserted;
   }
 
@@ -771,8 +710,6 @@ function startShow(id) {
 
     initPools(cfg);
 
-    state.needsMoreRun = false;
-
     const kind = getKind();
     let items = [];
     let allIds = [];
@@ -826,6 +763,7 @@ function startShow(id) {
 
   async function runCore() {
     if (isBlocked()) { dbg('blocked'); return; }
+    let insertedThisRun = 0;
 
     patchShowAds();
 
@@ -840,7 +778,7 @@ function startShow(id) {
       if (normalizeBool(cfg.enableMessageAds)) {
         const __items = getPostContainers();
         pruneOrphanWraps('ezoic-ad-message', __items);
-        injectBetween(
+        insertedThisRun += injectBetween(
           'ezoic-ad-message',
           __items,
           Math.max(1, parseInt(cfg.messageIntervalPosts, 10) || 3),
@@ -848,13 +786,12 @@ function startShow(id) {
           state.allPosts,
           'curPosts'
         );
-        declusterWraps('ezoic-ad-message');
       }
     } else if (kind === 'categoryTopics') {
       if (normalizeBool(cfg.enableBetweenAds)) {
         const __items = getTopicItems();
         pruneOrphanWraps('ezoic-ad-between', __items);
-        injectBetween(
+        insertedThisRun += injectBetween(
           'ezoic-ad-between',
           __items,
           Math.max(1, parseInt(cfg.intervalPosts, 10) || 6),
@@ -862,13 +799,12 @@ function startShow(id) {
           state.allTopics,
           'curTopics'
         );
-        declusterWraps('ezoic-ad-between');
       }
     } else if (kind === 'categories') {
       if (normalizeBool(cfg.enableCategoryAds)) {
         const __items = getCategoryItems();
         pruneOrphanWraps('ezoic-ad-categories', __items);
-        injectBetween(
+        insertedThisRun += injectBetween(
           'ezoic-ad-categories',
           __items,
           Math.max(1, parseInt(cfg.intervalCategories, 10) || 4),
@@ -876,34 +812,47 @@ function startShow(id) {
           state.allCategories,
           'curCategories'
         );
-        declusterWraps('ezoic-ad-categories');
       }
     }
-    // If we hit the per-run insertion cap, schedule another pass soon.
-    // Guard against infinite loops when nothing more can be inserted (e.g. no ids / adjacency everywhere).
-    if (state.needsMoreRun) {
-      const now = Date.now();
-      if (now - state.moreRunLast > 800) state.moreRunBurst = 0;
-      state.moreRunLast = now;
-      state.moreRunBurst += 1;
-      if (state.moreRunBurst <= 8) {
-        setTimeout(scheduleRun, 60);
-      }
-    }
-
   }
 
-  function scheduleRun() {
+  function scheduleRun(delayMs = 0) {
+    // schedule a single run (coalesced)
     if (state.runQueued) return;
     state.runQueued = true;
-    window.requestAnimationFrame(() => {
+    const doRun = () => {
       state.runQueued = false;
       const pk = getPageKey();
       if (state.pageKey && pk !== state.pageKey) return;
       runCore().catch(() => {});
-    });
+    };
+    if (delayMs > 0) {
+      window.setTimeout(() => window.requestAnimationFrame(doRun), delayMs);
+    } else {
+      window.requestAnimationFrame(doRun);
+    }
   }
 
+  function scheduleBurst() {
+    // During ajaxify/infinite scroll, the DOM may arrive in waves.
+    // We run a small, bounded burst to ensure all 1/X targets are reached.
+    const pk = getPageKey();
+    state.pageKey = pk;
+    state.burstRuns = 0;
+    const burst = () => {
+      if (getPageKey() !== pk) return;
+      if (state.burstRuns >= 6) return;
+      state.burstRuns += 1;
+      scheduleRun(0);
+      // follow-up passes catch late-rendered items (especially on topics)
+      window.setTimeout(() => scheduleRun(0), 180);
+      window.setTimeout(() => scheduleRun(0), 650);
+      window.setTimeout(() => scheduleRun(0), 1400);
+    };
+    burst();
+  }
+
+
   // ---------- observers / lifecycle ----------
 
   function cleanup() {
@@ -912,7 +861,7 @@ function startShow(id) {
     // remove all wrappers
     try {
       document.querySelectorAll(`.${WRAP_CLASS}`).forEach((el) => {
-        try { el.remove(); } catch (e) {}
+        releaseWrapNode(el);
       });
     } catch (e) {}
 
@@ -938,7 +887,7 @@ function startShow(id) {
     if (state.domObs) return;
     state.domObs = new MutationObserver(() => {
       if (state.internalDomChange > 0) return;
-      if (!isBlocked()) scheduleRun();
+      if (!isBlocked()) scheduleBurst();
     });
     try {
       state.domObs.observe(document.body, { childList: true, subtree: true });
@@ -967,13 +916,13 @@ function startShow(id) {
       insertHeroAdEarly().catch(() => {});
 
       // Then normal insertion
-      scheduleRun();
+      scheduleBurst();
     });
 
     // Infinite scroll / partial updates
     $(window).on('action:posts.loaded.ezoicInfinite action:topics.loaded.ezoicInfinite action:category.loaded.ezoicInfinite action:topic.loaded.ezoicInfinite', () => {
       if (isBlocked()) return;
-      scheduleRun();
+      scheduleBurst();
     });
   }
 
@@ -1007,7 +956,7 @@ function startShow(id) {
       ticking = true;
       window.requestAnimationFrame(() => {
         ticking = false;
-        if (!isBlocked()) scheduleRun();
+        if (!isBlocked()) scheduleBurst();
       });
     }, { passive: true });
   }
@@ -1026,5 +975,5 @@ function startShow(id) {
   // First paint: try hero + run
   blockedUntil = 0;
   insertHeroAdEarly().catch(() => {});
-  scheduleRun();
+  scheduleBurst();
 })();

package/public/style.css

@@ -29,17 +29,17 @@
   display: block !important;
   margin: 0 !important;
   padding: 0 !important;
-  height: 1px !important;
-  min-height: 1px !important;
+  height: 0 !important;
+  min-height: 0 !important;
   overflow: hidden !important;
 }
 
 .nodebb-ezoic-wrap {
-  min-height: 1px !important;
+  min-height: 0 !important;
 }
 
 .nodebb-ezoic-wrap > [id^="ezoic-pub-ad-placeholder-"] {
-  min-height: 1px !important;
+  min-height: 0 !important;
 }
 
 /*