← anomalyco/opencode

#18540 · @ndaemy · opened Mar 21, 2026 at 5:03 PM UTC · last updated Mar 21, 2026 at 5:03 PM UTC

fix(app): prevent scroll jump during history backfill

appfix
74
+3−51 files

Score breakdown

Impact

9.0

Clarity

9.0

Urgency

7.0

Ease Of Review

10.0

Guidelines

10.0

Readiness

9.0

Size

10.0

Trust

5.0

Traction

2.0

Summary

This PR fixes a chat history scroll jump bug caused by stale scrollTop values during backfill. The solution changes scroll restoration from absolute to relative adjustment, reading scrollTop at the moment of restoration. Verification includes both Playwright tests and manual QA with a custom scroll monitor.

Open in GitHub

Description

Issue for this PR

Fixes #17996

Type of change

  • [x] Bug fix
  • [ ] New feature
  • [ ] Refactor / code improvement
  • [ ] Documentation

What does this PR do?

When scrolling up quickly through chat history, the viewport jumps because preserveScroll captures scrollTop before the DOM update but restores it inside requestAnimationFrame. Native scroll events that fire between the capture and the rAF callback make the captured value stale, so the viewport snaps to a wrong position.

This change switches from absolute scroll restoration (scrollTop = beforeTop + delta) to relative adjustment (scrollTop += delta). Reading scrollTop at rAF time instead of capture time keeps the value fresh regardless of user scrolling in the interim.

How did you verify your code works?

  • Playwright test with synthetic scrollable container — confirmed 0px visual shift with both overflow-anchor: auto and overflow-anchor: none
  • Manual QA in headed Chromium connected to a live sidecar with real session data — injected a scroll monitor overlay that tracked every scrollHeight change and flagged jumps above 80px threshold. 0 jumps detected across multiple backfill cycles.

Checklist

  • [x] I have tested my changes locally
  • [x] I have not included unrelated changes in this PR

Linked Issues

#17996 [BUG] Desktop app chat scroll jumps/skips content during fast upward scrolling

View issue

Comments

No comments.

Changed Files

packages/app/src/pages/session.tsx

+3−5
@@ -132,13 +132,11 @@ function createSessionHistoryWindow(input: SessionHistoryWindowInput) {
fn()
return
}
const beforeTop = el.scrollTop
const beforeHeight = el.scrollHeight
const height = el.scrollHeight
fn()
requestAnimationFrame(() => {
const delta = el.scrollHeight - beforeHeight
if (!delta) return
el.scrollTop = beforeTop + delta
const delta = el.scrollHeight - height
if (delta) el.scrollTop += delta
})
}