hexo-theme-stellar 1.44.0 → 2.0.0-rc.2

package/source/js/runtime/extensions/feature.js

@@ -0,0 +1,200 @@
+function queryAll(root, selector) {
+  return Array.from(root.querySelectorAll(selector));
+}
+
+async function mountLazyLoading(root, context, config) {
+  if (root.nodeType !== 9) {
+    throw new TypeError('[stellar runtime] lazy-loading compatibility adapter requires a document root');
+  }
+  const ownerDocument = root.ownerDocument || root;
+  let instance = null;
+  const wrapLazyloadImages = container => {
+    const target = typeof container === 'string' ? root.querySelector(container) : container;
+    if (!target) return;
+    queryAll(target, 'img').forEach(image => {
+      if (image.classList.contains('lazy')) return;
+      const src = image.getAttribute('src');
+      if (!src) return;
+      const wrapper = ownerDocument.createElement('div');
+      wrapper.className = 'lazy-box';
+      const lazyImage = image.cloneNode();
+      lazyImage.removeAttribute('src');
+      lazyImage.setAttribute('data-src', src);
+      lazyImage.classList.add('lazy');
+      const icon = ownerDocument.createElement('div');
+      icon.className = 'lazy-icon';
+      wrapper.append(lazyImage, icon);
+      image.replaceWith(wrapper);
+    });
+    instance?.update?.();
+  };
+  window.wrapLazyloadImages = wrapLazyloadImages;
+  const onInitialized = event => {
+    instance = event.detail.instance;
+    window.lazyLoadInstance = instance;
+  };
+  const lazyLoadOptions = {
+    elements_selector: '.lazy',
+    callback_loaded(element) {
+      element.classList.add('loaded');
+      const wrapper = element.closest('.lazy-box') || element.parentElement;
+      wrapper?.querySelector('.lazy-icon')?.remove();
+    }
+  };
+  window.lazyLoadOptions = lazyLoadOptions;
+  window.addEventListener('LazyLoad::Initialized', onInitialized);
+  const observer = new MutationObserver(mutations => {
+    const found = mutations.some(mutation => Array.from(mutation.addedNodes).some(node =>
+      node.nodeType === 1 && (node.matches?.('.lazy') || node.querySelector?.('.lazy'))
+    ));
+    if (found) instance?.update?.();
+  });
+  observer.observe(root.documentElement || root, { childList: true, subtree: true });
+  const cleanup = () => {
+    observer.disconnect();
+    window.removeEventListener('LazyLoad::Initialized', onInitialized);
+    if (window.wrapLazyloadImages === wrapLazyloadImages) delete window.wrapLazyloadImages;
+    if (window.lazyLoadOptions === lazyLoadOptions) delete window.lazyLoadOptions;
+    instance?.destroy?.();
+    if (window.lazyLoadInstance === instance) delete window.lazyLoadInstance;
+    instance = null;
+  };
+  try {
+    await context.assets.script(config.asset);
+    instance?.update?.();
+    return cleanup;
+  } catch (error) {
+    cleanup();
+    throw error;
+  }
+}
+
+async function mountLightbox(root, context, config) {
+  let selector = '[data-fancybox]:not(.error), .with-fancybox .atk-content img:not([atk-emoticon]):not([class*="emo"]), .with-fancybox .tk-content img:not([atk-emoticon]):not([class*="emo"]), .with-fancybox .wl-content img:not([atk-emoticon]):not([class*="emo"])';
+  if (config.selector) selector += `, ${config.selector}`;
+  await Promise.all([
+    context.assets.style(config.assets.localCss),
+    context.assets.style(config.assets.css),
+    context.assets.script(config.assets.js)
+  ]);
+  const options = {
+    hideScrollbar: false,
+    Thumbs: { autoStart: false },
+    caption: (_instance, slide) => slide.triggerEl.alt || slide.triggerEl.dataset.caption || null
+  };
+  const isDocumentRoot = root.nodeType === 9;
+  if (isDocumentRoot) {
+    window.Fancybox.bind(selector, options);
+  } else {
+    window.Fancybox.bind(root, selector, options);
+  }
+  return () => {
+    if (isDocumentRoot) window.Fancybox?.unbind?.(selector);
+    else window.Fancybox?.unbind?.(root, selector);
+  };
+}
+
+async function mountMathJax(root, context, config) {
+  window.MathJax = {
+    tex: {
+      inlineMath: [['$', '$'], ['\\(', '\\)']],
+      processEscapes: true,
+      skipTags: ['script', 'noscript', 'style', 'textarea', 'pre', 'code']
+    },
+    startup: {
+      ready() {
+        window.MathJax.startup.defaultReady();
+        window.MathJax.typesetPromise().then(() => {
+          queryAll(root, 'mjx-container').forEach(element => element.parentNode?.classList.add('has-jax'));
+        });
+      }
+    }
+  };
+  await context.assets.script(config.asset);
+  return () => {};
+}
+
+async function mountDiagrams(root, context, config) {
+  await context.assets.script(config.assets.js);
+  const theme = config.colorScheme === 'auto' && window.matchMedia('(prefers-color-scheme: dark)').matches
+    ? 'dark'
+    : config.theme;
+  window.mermaid.initialize({
+    startOnLoad: false,
+    theme,
+    logLevel: 3,
+    flowchart: { useMaxWidth: false, htmlLabels: true, curve: 'linear' },
+    gantt: { axisFormat: '%Y/%m/%d' },
+    sequence: { actorMargin: 50 }
+  });
+  await window.mermaid.run({ nodes: queryAll(root, '.mermaid') });
+  return () => {};
+}
+
+async function mountCodeCopy(root, context, config) {
+  const messages = config.messages || {};
+  const policy = context.manifest.policy.features;
+  context.legacy.ctx.copycode = {
+    label: messages.label || '',
+    copied: messages.copied || '',
+    denied: messages.denied || '',
+    unsupported: messages.unsupported || '',
+    toast_ms: policy.codeCopyToastMs
+  };
+  await context.assets.script(config.assets.js);
+  const elements = queryAll(root, '.code');
+  window.createCopyButtons?.(elements);
+  return () => elements.forEach(element => element.querySelector('.copy-btn')?.remove());
+}
+
+async function mountAdaptiveText(root, context, config) {
+  await context.assets.script(config.assets.colorJs);
+  await context.assets.script(config.assets.js);
+  return window.stellarAdaptiveText?.mount?.(queryAll(root, '[data-text-adaptive]')) || (() => {});
+}
+
+async function mountHeti(root, context, config) {
+  await context.assets.style(config.assets.css);
+  await context.assets.script(config.assets.js);
+  const heti = new window.Heti('.heti');
+  queryAll(root, heti.rootSelector).forEach(element => heti.spacingElement(element));
+  return () => {};
+}
+
+async function mountSwiper(root, context, config) {
+  await Promise.all([
+    context.assets.style(config.assets.localCss),
+    context.assets.style(config.assets.css),
+    context.assets.script(config.assets.js)
+  ]);
+  const element = root.querySelector('#swiper-api');
+  const instance = new window.Swiper(element, {
+    slidesPerView: 'auto',
+    spaceBetween: 8,
+    centeredSlides: true,
+    effect: element?.getAttribute('effect') || '',
+    rewind: true,
+    pagination: { el: '.swiper-pagination', clickable: true },
+    navigation: { nextEl: '.swiper-button-next', prevEl: '.swiper-button-prev' }
+  });
+  return () => instance.destroy?.(true, true);
+}
+
+export async function mount(root, context) {
+  const config = context.extension.config;
+  switch (config.feature) {
+    case 'lazy-loading': return mountLazyLoading(root, context, config);
+    case 'link-prefetch':
+      window.FPConfig = { delay: 0, ignoreKeywords: [], maxRPS: 5, hoverDelay: 25 };
+      await context.assets.script(config.asset);
+      return () => {};
+    case 'lightbox': return mountLightbox(root, context, config);
+    case 'mathjax': return mountMathJax(root, context, config);
+    case 'diagrams': return mountDiagrams(root, context, config);
+    case 'code-copy': return mountCodeCopy(root, context, config);
+    case 'adaptive-text': return mountAdaptiveText(root, context, config);
+    case 'heti': return mountHeti(root, context, config);
+    case 'swiper': return mountSwiper(root, context, config);
+    default: throw new TypeError(`unknown built-in feature ${config.feature}`);
+  }
+}

package/source/js/runtime/extensions/hero-effect.js

@@ -0,0 +1,179 @@
+const EFFECT_SELECTOR = 'canvas[data-hero-effect]';
+const MODULE_QUERY = new URL(import.meta.url).search;
+
+function objectValue(value) {
+  return value != null && typeof value === 'object' && !Array.isArray(value) ? value : {};
+}
+
+function readObject(canvas, attribute) {
+  const raw = canvas.getAttribute(attribute);
+  if (!raw) return {};
+  try {
+    return objectValue(JSON.parse(raw));
+  } catch (error) {
+    void error;
+    return {};
+  }
+}
+
+function runtimePolicy(canvas) {
+  const runtime = readObject(canvas, 'data-effect-runtime');
+  return Object.freeze({
+    pauseWhenHidden: runtime.pauseWhenHidden !== false,
+    respectReducedMotion: runtime.respectReducedMotion !== false
+  });
+}
+
+function effectCanvases(root) {
+  const canvases = [];
+  if (root?.matches?.(EFFECT_SELECTOR)) canvases.push(root);
+  root?.querySelectorAll?.(EFFECT_SELECTOR).forEach(canvas => canvases.push(canvas));
+  return canvases;
+}
+
+function versionedModule(context, module) {
+  const resolved = context.assets.resolve(module);
+  if (!resolved) throw new TypeError('[stellar hero effect] renderer module is required');
+  if (!MODULE_QUERY) return resolved;
+  return `${resolved}${resolved.includes('?') ? '&' : '?'}${MODULE_QUERY.slice(1)}`;
+}
+
+function reducedMotion(windowRef) {
+  return windowRef.matchMedia?.('(prefers-reduced-motion: reduce)').matches === true;
+}
+
+function createLifecycle(canvas, renderer, runtime) {
+  const background = canvas.parentElement;
+  const interactionTarget = canvas.closest('.wiki-hero') || background;
+  const documentRef = canvas.ownerDocument;
+  const windowRef = documentRef?.defaultView || window;
+  if (!background || !interactionTarget || !documentRef) return null;
+
+  const pointer = { x: 0.5, y: 0.5, active: false };
+  let animationFrame = null;
+  let inViewport = true;
+  let destroyed = false;
+
+  function shouldRender() {
+    return !destroyed && (!runtime.pauseWhenHidden || (inViewport && !documentRef.hidden));
+  }
+
+  function frame(time) {
+    animationFrame = null;
+    if (!shouldRender()) return;
+    renderer.render(time, pointer);
+    animationFrame = windowRef.requestAnimationFrame(frame);
+  }
+
+  function start() {
+    if (shouldRender() && animationFrame === null) {
+      animationFrame = windowRef.requestAnimationFrame(frame);
+    }
+  }
+
+  function stop() {
+    if (animationFrame === null) return;
+    windowRef.cancelAnimationFrame(animationFrame);
+    animationFrame = null;
+  }
+
+  function resize() {
+    renderer.resize(background.getBoundingClientRect(), windowRef.devicePixelRatio || 1);
+  }
+
+  function onMouseMove(event) {
+    const rect = background.getBoundingClientRect();
+    if (rect.width <= 0 || rect.height <= 0) return;
+    pointer.x = Math.max(0, Math.min(1, (event.clientX - rect.left) / rect.width));
+    pointer.y = Math.max(0, Math.min(1, (event.clientY - rect.top) / rect.height));
+    pointer.active = true;
+  }
+
+  function onMouseLeave() {
+    pointer.active = false;
+  }
+
+  function onVisibilityChange() {
+    if (documentRef.hidden) stop();
+    else start();
+  }
+
+  if (renderer.pointer === true) {
+    interactionTarget.addEventListener('mousemove', onMouseMove);
+    interactionTarget.addEventListener('mouseleave', onMouseLeave);
+  }
+  if (runtime.pauseWhenHidden) documentRef.addEventListener('visibilitychange', onVisibilityChange);
+
+  let resizeObserver = null;
+  if (windowRef.ResizeObserver) {
+    resizeObserver = new windowRef.ResizeObserver(resize);
+    resizeObserver.observe(background);
+  } else {
+    windowRef.addEventListener('resize', resize);
+  }
+
+  let viewportObserver = null;
+  if (runtime.pauseWhenHidden && windowRef.IntersectionObserver) {
+    viewportObserver = new windowRef.IntersectionObserver(entries => {
+      inViewport = entries[0]?.isIntersecting === true;
+      if (inViewport) start();
+      else stop();
+    }, { threshold: 0.01 });
+    viewportObserver.observe(background);
+  }
+
+  resize();
+  start();
+
+  return function cleanup() {
+    if (destroyed) return;
+    destroyed = true;
+    stop();
+    if (renderer.pointer === true) {
+      interactionTarget.removeEventListener('mousemove', onMouseMove);
+      interactionTarget.removeEventListener('mouseleave', onMouseLeave);
+    }
+    if (runtime.pauseWhenHidden) documentRef.removeEventListener('visibilitychange', onVisibilityChange);
+    windowRef.removeEventListener('resize', resize);
+    resizeObserver?.disconnect();
+    viewportObserver?.disconnect();
+    renderer.destroy();
+  };
+}
+
+async function mountCanvas(canvas, context) {
+  const type = canvas.getAttribute('data-hero-effect') || '';
+  const definition = objectValue(context.extension.config.effects)[type];
+  if (!definition || typeof definition.module !== 'string') {
+    throw new TypeError(`[stellar hero effect] unregistered effect ${type || '<missing>'}`);
+  }
+  const runtime = runtimePolicy(canvas);
+  const windowRef = canvas.ownerDocument?.defaultView || window;
+  if (runtime.respectReducedMotion && reducedMotion(windowRef)) return null;
+  const module = await import(versionedModule(context, definition.module));
+  if (typeof module.createRenderer !== 'function') {
+    throw new TypeError(`[stellar hero effect] ${type} must export createRenderer(canvas, options, defaults)`);
+  }
+  const renderer = module.createRenderer(canvas, readObject(canvas, 'data-effect-options'), objectValue(definition.defaults));
+  if (!renderer) return null;
+  if (typeof renderer.resize !== 'function' || typeof renderer.render !== 'function' || typeof renderer.destroy !== 'function') {
+    renderer.destroy?.();
+    throw new TypeError(`[stellar hero effect] ${type} returned an invalid renderer`);
+  }
+  return createLifecycle(canvas, renderer, runtime);
+}
+
+export async function mount(root, context) {
+  const cleanups = [];
+  await Promise.all(effectCanvases(root).map(async canvas => {
+    try {
+      const cleanup = await mountCanvas(canvas, context);
+      if (typeof cleanup === 'function') cleanups.push(cleanup);
+    } catch (error) {
+      context.reportError(error);
+    }
+  }));
+  return () => {
+    for (let index = cleanups.length - 1; index >= 0; index--) cleanups[index]();
+  };
+}

package/source/js/runtime/extensions/reveal.js

@@ -0,0 +1,80 @@
+function queryAll(root, selector) {
+  return Array.from(root.querySelectorAll(selector));
+}
+
+const DISTANCE = '8px';
+const DURATION_MS = 1000;
+const INTERVAL_MS = 100;
+const SCALE = 1;
+
+function rootWindow(root) {
+  if (root?.defaultView) return root.defaultView;
+  if (root?.ownerDocument?.defaultView) return root.ownerDocument.defaultView;
+  return null;
+}
+
+function prefersReducedMotion(windowRef) {
+  if (typeof windowRef?.matchMedia !== 'function') return false;
+  try {
+    return windowRef.matchMedia('(prefers-reduced-motion: reduce)').matches;
+  } catch (error) {
+    void error;
+    return false;
+  }
+}
+
+export function mount(root) {
+  const elements = queryAll(root, '.slide-up');
+  const windowRef = rootWindow(root);
+  if (
+    elements.length === 0 ||
+    typeof windowRef?.IntersectionObserver !== 'function' ||
+    prefersReducedMotion(windowRef)
+  ) return () => {};
+
+  const animations = new Set();
+  const pendingInitialObservation = new WeakSet(elements);
+  let observer = null;
+
+  try {
+    observer = new windowRef.IntersectionObserver(entries => {
+      let sequenceIndex = 0;
+      entries.forEach(entry => {
+        if (pendingInitialObservation.has(entry.target)) {
+          pendingInitialObservation.delete(entry.target);
+          if (entry.isIntersecting) observer.unobserve(entry.target);
+          return;
+        }
+        if (!entry.isIntersecting) return;
+        observer.unobserve(entry.target);
+        if (typeof entry.target.animate !== 'function') return;
+        try {
+          const animation = entry.target.animate([
+            { opacity: 0, transform: `translateY(${DISTANCE}) scale(${SCALE})` },
+            { opacity: 1, transform: 'translateY(0) scale(1)' }
+          ], {
+            delay: sequenceIndex * INTERVAL_MS,
+            duration: DURATION_MS,
+            easing: 'ease-out',
+            fill: 'backwards'
+          });
+          animations.add(animation);
+          sequenceIndex += 1;
+        } catch (error) {
+          void error;
+        }
+      });
+    });
+    elements.forEach(element => observer.observe(element));
+  } catch (error) {
+    void error;
+    observer?.disconnect();
+    return () => {};
+  }
+
+  return () => {
+    observer.disconnect();
+    animations.forEach(animation => animation.cancel());
+    animations.clear();
+  };
+}

package/source/js/runtime/extensions/search.js

@@ -0,0 +1,23 @@
+export async function mount(root, context) {
+  const config = context.extension.config;
+  const assets = context.assets;
+  if (config.provider === 'algolia') {
+    window.searchConfig = Object.assign({}, config.options, {
+      js: config.assets.client,
+      hitsPerPage: 100
+    });
+    await assets.script(config.assets.client);
+    await assets.script(config.assets.provider);
+  } else if (config.provider === 'local') {
+    await assets.script(config.assets.provider);
+  }
+  await assets.script(config.assets.shortcut);
+  const providerCleanup = config.provider === 'algolia'
+    ? window.stellarAlgoliaSearch?.mount?.(root)
+    : window.stellarLocalSearch?.mount?.(root);
+  const shortcutCleanup = window.stellarSearchShortcut?.mount?.(root);
+  return () => {
+    shortcutCleanup?.();
+    providerCleanup?.();
+  };
+}

package/source/js/{services.js → runtime/extensions/services.js}

@@ -1,77 +1,74 @@
-const initServices = () => {
+export async function mount(root, context) {
+  if (root.nodeType !== 9) {
+    throw new TypeError('[stellar runtime] legacy data-service adapter requires a document root');
+  }
+  const assets = context.assets;
+  const config = context.extension.config;
+  const services = Object.assign({}, config.services, {
+    siteinfo: Object.assign({}, config.services.siteinfo, { api: config.siteInfoEndpoint })
+  });
+  const deps = { marked: config.marked };
+  const loads = [];
+  const voiceCleanups = [];
   // 用于存储需要清理的资源
-  let timers = [];
+  let intervals = [];
+  let timeouts = [];
 
-  for (let id of Object.keys(ctx.services)) {
-    const js = ctx.services[id].js;
+  for (let id of Object.keys(services)) {
+    const js = services[id].js;
     if (id == 'siteinfo') {
-      const cardlinks = document.querySelectorAll('a.link-card[cardlink]');
-      const siteCards = document.querySelectorAll('.ds-sites, .site-card .card-link[data-siteinfo-api]');
+      const cardlinks = root.querySelectorAll('a.link-card[cardlink]');
+      const siteCards = root.querySelectorAll('.ds-sites, .site-card .card-link[data-siteinfo-api]');
       if (cardlinks?.length > 0 || siteCards?.length > 0) {
-        utils.js(js, { defer: true }).then(function () {
+        loads.push(assets.script(js).then(function () {
           if (cardlinks?.length > 0) {
             setCardLink(cardlinks);
           }
-        });
+        }));
       }
     } else if (id == 'ghinfo') {
-      const els = document.querySelectorAll('.ds-ghinfo');
+      const els = root.querySelectorAll('.ds-ghinfo');
       if (els.length > 0) {
-        utils.js(js, { defer: true });
+        loads.push(assets.script(js));
       }
     } else if (id == 'voice') {
-      const voiceAudios = document.querySelectorAll('.voice>audio');
+      const voiceAudios = root.querySelectorAll('.voice>audio');
       if (voiceAudios?.length > 0) {
-        utils.js(js, { defer: true }).then(function () {
-          createVoiceDom(voiceAudios);
-        });
+        loads.push(assets.script(js).then(function () {
+          const voiceCleanup = createVoiceDom(voiceAudios);
+          if (typeof voiceCleanup === 'function') voiceCleanups.push(voiceCleanup);
+        }));
       }
     } else if (id == 'video') {
-      const videos = document.querySelectorAll('.video>video');
+      const videos = root.querySelectorAll('.video>video');
       if (videos?.length > 0) {
-        utils.js(js, { defer: true }).then(function () {
+        loads.push(assets.script(js).then(function () {
           videoEvents(videos);
-        });
+        }));
       }
     } else if (id == 'download-file') {
-      const files = document.querySelectorAll('.chat-file');
+      const files = root.querySelectorAll('.chat-file');
       if (files?.length > 0) {
-        utils.js(js, { defer: true }).then(function () {
+        loads.push(assets.script(js).then(function () {
           downloadFileEvent(files);
-        });
+        }));
       }
     } else {
-      const els = document.getElementsByClassName(`ds-${id}`);
+      const els = root.getElementsByClassName(`ds-${id}`);
       if (els?.length > 0) {
         if (id == 'timeline' || id == 'memos' || id == 'marked' || id == 'mdrender') {
-          utils.js(deps.marked).then(function () {
-            utils.js(js, { defer: true });
-          });
+          loads.push(assets.script(deps.marked).then(function () {
+            return assets.script(js);
+          }));
         } else {
-          utils.js(js, { defer: true });
+          loads.push(assets.script(js));
         }
       }
     }
   }
 
-  // search
-  if (ctx.search && typeof searchFunc === 'function') {
-    const searchCfg = ctx.search.local_search;
-    const lazyLoad = searchCfg ? searchCfg.lazy_load !== false : true;
-    // 懒加载模式下由 local-search.js 的聚焦事件负责初始化，此处跳过
-    if (!lazyLoad) {
-      const inputArea = document.querySelector("input#search-input");
-      if (inputArea && !inputArea._searchInitialized) {
-        const path = ctx.search.path.startsWith('/') ? ctx.root + ctx.search.path.substring(1) : ctx.root + ctx.search.path;
-        const filter = inputArea.getAttribute('data-filter') || '';
-        searchFunc(path, filter, 'search-wrapper', 'search-input', 'search-result');
-        // searchFunc 内部管理 _searchInitialized（pending → true），此处不再覆盖
-      }
-    }
-  }
-
   // chat iphone time
-  let phoneTimes = document.querySelectorAll('.chat .status-bar .time');
+  let phoneTimes = root.querySelectorAll('.chat .status-bar .time');
   let firstAdjustInterval = null;
   let mainInterval = null;
 
@@ -80,7 +77,7 @@ const initServices = () => {
     const date = new Date();
     const sec = date.getSeconds();
     firstAdjustInterval = setInterval(firstAdjustTime, 1000 * (60 - sec));
-    timers.push(firstAdjustInterval);
+    intervals.push(firstAdjustInterval);
 
     function firstAdjustTime() {
       NowTime();
@@ -89,7 +86,7 @@ const initServices = () => {
         firstAdjustInterval = null;
       }
       mainInterval = setInterval(NowTime, 1000 * 60);
-      timers.push(mainInterval);
+      intervals.push(mainInterval);
     }
 
     function NowTime() {
@@ -115,19 +112,22 @@ const initServices = () => {
   const chat_quote_obverser = new IntersectionObserver((entries, observer) => {
     entries.filter((entry) => { return entry.isIntersecting }).sort((a, b) => a.intersectionRect.y !== b.intersectionRect.y ? a.intersectionRect.y - b.intersectionRect.y : a.intersectionRect.x - b.intersectionRect.x).forEach((entry, index) => {
         observer.unobserve(entry.target);
-        setTimeout(() => {
+        const blinkStart = setTimeout(() => {
           entry.target.classList.add('quote-blink');
-          setTimeout(() => {
+          const blinkEnd = setTimeout(() => {
             entry.target.classList.remove('quote-blink');
           }, 1000);
+          timeouts.push(blinkEnd);
         }, Math.max(100, 16) * (index + 1));
+        timeouts.push(blinkStart);
       });
   });
 
-  var chatQuotes = document.querySelectorAll(".chat .talk .quote");
+  var chatQuotes = root.querySelectorAll(".chat .talk .quote");
   chatQuotes.forEach((quote) => {
     const handler = function () {
-      var chatCellDom = document.getElementById("quote-" + quote.getAttribute("quotedCellTag"));
+      var candidate = root.getElementById("quote-" + quote.getAttribute("quotedCellTag"));
+      var chatCellDom = candidate && root.documentElement.contains(candidate) ? candidate : null;
       if (chatCellDom) {
         var chatDiv = chatCellDom.parentElement;
         var mid = chatDiv.clientHeight / 2;
@@ -151,12 +151,16 @@ const initServices = () => {
   });
 
   // 返回清理函数，用于清理定时器和观察器
-  return () => {
+  const cleanup = () => {
     // 清理所有定时器（包括可能未完成的 firstAdjustInterval）
-    timers.forEach(timer => {
+    intervals.forEach(timer => {
       if (timer) clearInterval(timer);
     });
-    timers = [];
+    intervals = [];
+    timeouts.forEach(timer => {
+      if (timer) clearTimeout(timer);
+    });
+    timeouts = [];
     if (firstAdjustInterval) {
       clearInterval(firstAdjustInterval);
       firstAdjustInterval = null;
@@ -176,7 +180,16 @@ const initServices = () => {
       quote.removeEventListener('click', handler);
     });
     quoteClickHandlers.clear();
+    for (let index = voiceCleanups.length - 1; index >= 0; index -= 1) {
+      voiceCleanups[index]();
+    }
+    voiceCleanups.length = 0;
   };
-};
-
-stellar.initPlugin(initServices, 'services');
+  try {
+    await Promise.all(loads);
+  } catch (error) {
+    cleanup();
+    throw error;
+  }
+  return cleanup;
+}