fix(virtual-core): notify synchronously after above-viewport resize compensation#1239
Merged
piecyk merged 1 commit intoJul 22, 2026
Merged
Conversation
|
Caution Review failedThe pull request is closed. ℹ️ Recent review info⚙️ Run configurationConfiguration used: defaults Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (3)
📝 WalkthroughWalkthrough
ChangesScroll compensation
Estimated code review effort: 3 (Moderate) | ~20 minutes Sequence Diagram(s)sequenceDiagram
participant resizeItem
participant applyScrollAdjustment
participant scrollToFn
participant onChange
resizeItem->>applyScrollAdjustment: Apply resize compensation
applyScrollAdjustment->>scrollToFn: Write adjusted scroll position when applicable
applyScrollAdjustment-->>resizeItem: Return synchronous-write status
resizeItem->>onChange: Notify with sync status
Possibly related PRs
🚥 Pre-merge checks | ✅ 3 | ❌ 2❌ Failed checks (2 warnings)
✅ Passed checks (3 passed)
✨ Finishing Touches🧪 Generate unit tests (beta)
Warning There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure. 🔧 ESLint
ESLint install timed out. The project may have too many dependencies for the sandbox. Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
|
View your CI Pipeline Execution ↗ for commit a8a35b1
☁️ Nx Cloud last updated this comment at |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
🧹 Nitpick comments (1)
packages/virtual-core/tests/index.test.ts (1)
2741-2766: 🎯 Functional Correctness | 🔵 Trivial | ⚡ Quick winExercise the reported upward-scroll state.
This test leaves
isScrolling=falseandscrollDirection=null, so it only validates compensation while idle. Use the helper’s existingemitScrollwith a decreasing offset beforeresizeItem; otherwise, a regression affecting active upward scrolling could still pass.Suggested test adjustment
- const { v, scrollToFn } = createAdjustmentVirtualizer({ + const { v, scrollToFn, emitScroll } = createAdjustmentVirtualizer({ offset: 600, onChange, }) v['getMeasurements']() + emitScroll(500, true) onChange.mockClear()🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@packages/virtual-core/tests/index.test.ts` around lines 2741 - 2766, Update the test around createAdjustmentVirtualizer to exercise active upward scrolling: use the helper’s existing emitScroll with a decreasing offset before calling resizeItem, while preserving the current compensation and synchronous onChange assertions.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Nitpick comments:
In `@packages/virtual-core/tests/index.test.ts`:
- Around line 2741-2766: Update the test around createAdjustmentVirtualizer to
exercise active upward scrolling: use the helper’s existing emitScroll with a
decreasing offset before calling resizeItem, while preserving the current
compensation and synchronous onChange assertions.
ℹ️ Review info
⚙️ Run configuration
Configuration used: defaults
Review profile: CHILL
Plan: Pro
Run ID: 392c9e81-ae96-40df-b91a-961aaa5729c8
📒 Files selected for processing (3)
.changeset/fix-up-scroll-compensation-flash.mdpackages/virtual-core/src/index.tspackages/virtual-core/tests/index.test.ts
2 tasks
…ompensation `resizeItem` writes `scrollTop` synchronously inside the ResizeObserver callback to compensate for an above-viewport size change, but then notified asynchronously. The browser could paint one frame with the new `scrollTop` and the old item transforms, so the viewport visibly jumped by the resize delta and snapped back on the next commit (TanStack#1227) — the scrollbar stayed anchored (skew=0) but the content flashed. When a compensation actually moves the scroll position, notify synchronously so the transform commit lands in the same paint as the scroll write. Resizes that move nothing (below-fold measurements) and iOS-deferred adjustments keep the cheaper async notify. `applyScrollAdjustment` now reports whether it wrote `scrollTop` this tick to drive that decision. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
piecyk
force-pushed
the
damian/fix/up-scroll-compensation-flash
branch
from
July 22, 2026 11:26
54bb501 to
a8a35b1
Compare
Merged
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Fixes #1227 — the viewport flashes/jumps for one frame when above-viewport rows resize while the user scrolls up (dynamic measurement, real heights differ from
estimateSize).Diagnosis
The reporter's escape hatch (assigning
shouldAdjustScrollPositionOnItemSizeChangeon the instance) works — the callback fires for every backward re-measure and the compensation branch runs. Instrumenting the repro showed the compensation is also numerically correct:skew = dom − tracked = 0on every fire →scrollTowrites off the correct live base (no stale-offset bug).deltais applied once, right direction.overflow-anchor: nonechanges nothing → not native browser scroll anchoring.What remains is a single-frame paint flash.
resizeItemwritesscrollTopsynchronously inside the ResizeObserver callback (applyScrollAdjustment), but then notified asynchronously — the grown item transforms commit on a later render. ResizeObserver fires right before paint, so the browser can paint one frame with the newscrollTopand the old transforms: content jerks bydeltaand snaps back on the next commit. This is the inverse of #1237 (grow the container before syncing scroll); pre-3.16 didn't decouple the two.Fix
When a compensation actually moves the scroll position, notify synchronously so the transform commit lands in the same ResizeObserver callback as the
scrollTopwrite — the browser paints once, consistently.applyScrollAdjustmentnow returns whether it wrotescrollTopthis tick; resizes that move nothing (below-fold measurements) and iOS-deferred adjustments keep the cheaper async notify.Tests
notify(sync=true); no-op resize →notify(sync=false).applyScrollAdjustmentfold/direction tests and the fix(virtual-core): viewport drifts when above-viewport rows resize over multiple frames #1212 multi-frame reflow invariant), react-virtual 7 passed, typecheck clean.Note
The synchronous flush relies on the React adapter's
useFlushSync(defaulttrue). Consumers who setuseFlushSync: falseopt out of synchronous flushing, so the flash can return for them — left as-is rather than overriding an explicit choice.🤖 Generated with Claude Code
Summary by CodeRabbit