@braccato/core 1.6.1 → 1.6.3

package/dist/engine.d.ts

@@ -41,8 +41,6 @@ export interface AnimationEngineInstance extends AnimEngineViewState {
     window: EngineWindow;
     host: LyricsRendererHost;
     cachedTabRendererHeight: number | null;
-    cachedMaxScrollTop: number | null;
-    cachedScrollTop: number | null;
     cachedFooterItem: LineScrollItem | null;
     cachedLineScrollTiming: Map<string, LineScrollTiming>;
     tabRendererResizeObserver: ResizeObserver | null;

package/dist/engine.js

@@ -137,8 +137,6 @@ export function createAnimationEngineInstance(engineDocument, engineWindow, host
         passiveScrollAccumulatedTime: 0,
         passiveLastWallTime: 0,
         cachedTabRendererHeight: null,
-        cachedMaxScrollTop: null,
-        cachedScrollTop: null,
         cachedFooterItem: null,
         cachedLineScrollTiming: new Map(),
         tabRendererResizeObserver: null,
@@ -1444,6 +1442,8 @@ export function setupLineCullObserver(engine) {
         engine.lineCullObserver = null;
         return;
     }
+    // Scroll anchoring would compensate residual cull height-shifts with a scroll the engine misreads as the user's (Firefox); the engine owns scrollTop, so disable it.
+    engine.host.getScrollElement()?.style.setProperty("overflow-anchor", "none");
     // Pin each line's skipped placeholder to its last rendered size, so skipping a line never shifts the
     // container's scroll height, which the engine would misread as a user scroll.
     const restingHeights = engine.lines.map(line => line.lyricElement.offsetHeight);
@@ -1749,7 +1749,6 @@ function passiveScrollEngine(engine, isPlaying) {
     const prevScrollTop = tabRenderer.scrollTop;
     tabRenderer.scrollTop = targetScroll;
     const appliedScrollTop = tabRenderer.scrollTop;
-    engine.cachedScrollTop = appliedScrollTop;
     // Only skip the next scroll event if scrollTop actually changed.
     // When it doesn't change (pause phases, sub-pixel rounding), no programmatic
     // scroll event fires, so setting skipScrolls would eat user scroll events instead.
@@ -1769,19 +1768,11 @@ function setupTabRendererObserver(engine, element) {
         dropPendingLineScroll(engine);
         if (element && element.isConnected) {
             engine.cachedTabRendererHeight = element.getBoundingClientRect().height;
-            refreshScrollMetrics(engine, element);
         }
     });
     engine.tabRendererResizeObserver.observe(element);
     engine.observedTabRenderer = element;
     engine.cachedTabRendererHeight = element.getBoundingClientRect().height;
-    refreshScrollMetrics(engine, element);
-}
-// Scroll position and bounds are cached here (and refreshed where layout is measured on purpose) so
-// the tick never reads them off the DOM, which would force a synchronous layout flush mid-frame.
-function refreshScrollMetrics(engine, tabRenderer) {
-    engine.cachedMaxScrollTop = Math.max(0, tabRenderer.scrollHeight - tabRenderer.clientHeight);
-    engine.cachedScrollTop = tabRenderer.scrollTop;
 }
 /**
  * Fills in everything a caller left out of a tick. The tick reads each of these arithmetically, so
@@ -1883,17 +1874,9 @@ export function tickView(engine, currentTime, options) {
             setupTabRendererObserver(engine, tabRenderer);
         }
         const tabRendererHeight = engine.cachedTabRendererHeight ?? tabRenderer.getBoundingClientRect().height;
-        // Read the DOM position only while the user scrolls (they own it then); otherwise reuse the cached
-        // value the engine last wrote, so the tick never forces a mid-frame layout flush.
-        let scrollTop;
-        if (engine.scrollResumeTime >= now || engine.cachedScrollTop === null) {
-            scrollTop = tabRenderer.scrollTop;
-            engine.cachedScrollTop = scrollTop;
-        }
-        else {
-            scrollTop = engine.cachedScrollTop;
-        }
-        const maxScrollTop = engine.cachedMaxScrollTop ?? Math.max(0, tabRenderer.scrollHeight - tabRenderer.clientHeight);
+        // Read before the loop's class writes so this layout read is batched and forces no mid-frame reflow.
+        let scrollTop = tabRenderer.scrollTop;
+        const maxScrollTop = Math.max(0, tabRenderer.scrollHeight - tabRenderer.clientHeight);
         if (animationConfig.enabled.scroll) {
             updateVisibleLyricWillChange(engine, lines, scrollTop, engine.pendingLineScroll?.toScrollTop ?? scrollTop, tabRendererHeight);
         }
@@ -2152,7 +2135,6 @@ export function tickView(engine, currentTime, options) {
                     scrollTop = scrollPos;
                     engine.scrollPos = scrollTop;
                     tabRenderer.scrollTop = scrollTop;
-                    engine.cachedScrollTop = scrollTop;
                     engine.skipScrolls += 1;
                     engine.skipScrollsDecayTimes.push(Date.now() + 2000);
                 }
@@ -2269,9 +2251,6 @@ export function relayout(engine, measureLines) {
     measureFooterItem(engine, lyricsElement);
     // Re-arm from the fresh measurements, so a line skipped after this holds its new placeholder height.
     setupLineCullObserver(engine);
-    const tabRenderer = engine.host.getScrollElement();
-    if (tabRenderer)
-        refreshScrollMetrics(engine, tabRenderer);
     engine.wasUserScrolling = true; // trigger rescrolls
     engine.host.debug?.resize();
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@braccato/core",
-  "version": "1.6.1",
+  "version": "1.6.3",
   "description": "Synchronized lyrics renderer with word-by-word animations",
   "type": "module",
   "license": "MIT",