From ee84217c233175f22e3db7145f553e007eebdfb5 Mon Sep 17 00:00:00 2001 From: Ynchnnn <17665010888@163.com> Date: Thu, 9 Jul 2026 16:52:40 +0800 Subject: [PATCH] fix(fx-runtime): section-level data-fx never initialized MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit initFxIn/stopFxIn use root.querySelectorAll('[data-fx]'), which never matches the root element itself — so data-fx placed directly on a
(the documented way to give a cover slide a canvas background) was silently ignored: no canvas, no handle in __hpxActive. Add fxEls() that includes the root when it carries data-fx, and use it in both init and stop so lifecycle stays symmetric. Verified: a cover slide with data-fx="starfield" now mounts its canvas on activation and stops on leave; descendant [data-fx] behavior unchanged. Co-Authored-By: Claude Fable 5 --- assets/animations/fx-runtime.js | 12 ++++++++++-- 1 file changed, 10 insertions(+), 2 deletions(-) diff --git a/assets/animations/fx-runtime.js b/assets/animations/fx-runtime.js index 2c5f3c9..45b69a8 100644 --- a/assets/animations/fx-runtime.js +++ b/assets/animations/fx-runtime.js @@ -38,9 +38,17 @@ window.__hpxActive = window.__hpxActive || new Map(); + /* querySelectorAll never matches root itself, but decks put data-fx on the + *
too (e.g. a cover starfield) — include it. */ + function fxEls(root){ + const els = Array.from(root.querySelectorAll('[data-fx]')); + if (root.matches && root.matches('[data-fx]')) els.unshift(root); + return els; + } + function initFxIn(root){ if (!window.HPX) return; - const els = root.querySelectorAll('[data-fx]'); + const els = fxEls(root); els.forEach((el) => { if (window.__hpxActive.has(el)) return; const name = el.getAttribute('data-fx'); @@ -54,7 +62,7 @@ } function stopFxIn(root){ - const els = root.querySelectorAll('[data-fx]'); + const els = fxEls(root); els.forEach((el) => { const h = window.__hpxActive.get(el); if (h && typeof h.stop === 'function'){