useScrollToBottom (user-message-anchor) undershoots on thread load — lands several messages before the last user message
メンテナーはふだん 1 日以内に返信
@abhithesys がすでに取り組んでいます。
2026年3月28日 から。
評価
この issue はまだ評価されていません。
説明
Bug Report: useScrollToBottom with user-message-anchor doesn't reach the last user message on thread load
Package versions
@openuidev/react-ui:0.9.20@openuidev/react-headless:0.7.11- React:
19.2.4
Describe the bug
When loading a thread with many messages (via loadThread), the scroll
position lands several messages before the last user message instead of
placing it at the top of the viewport. The user must manually scroll down
to reach the end of the conversation.
The desired behavior — last user message pinned to the top of the
viewport — is correct; it's just not being achieved.
AI Analysis
The user-message-anchor branch in useScrollToBottom (lines 76-89)
does the right thing in principle:
const lastUserMessageDiv = Array.from(
element.querySelectorAll(userMessageSelector)
).pop();
const scrollPosition =
lastUserMessageDiv.getBoundingClientRect().top -
element.getBoundingClientRect().top +
element.scrollTop;
element.scrollTo({ top: scrollPosition, behavior: "smooth" });
The scroll fires in the useEffect on line 93-103 the moment isLoadingMessages flips to false. The issue is that at that point the message components haven't finished laying out — complex content like OpenUI components, Markdown blocks, tool-call accordions, and images are still mounting and expanding. As a result:
getBoundingClientRect() returns stale geometry — the positions are based on partially-rendered content, so the calculated scrollPosition is too low (too far up in the chat).
behavior: "smooth" locks in the stale target — the animated scroll commits to the position computed at call time. As content continues to expand below the measurement point the target becomes increasingly wrong, but smooth scroll doesn't re-evaluate.
Together these cause the scroll to land several messages short of the actual last user message.
Steps to reproduce
- Use Shell.ScrollArea with the default scrollVariant ("user-message-anchor").
- Have a thread with ~20+ messages, ideally containing assistant responses with rich content (OpenUI Renderer output, Markdown with code blocks, tool calls).
- Load the thread (click it in the sidebar → loadThread).
Observe: the viewport lands a few messages above the last user message. Scrolling down manually reveals the remaining messages.
Expected behavior
The last user message should be positioned at the top of the viewport after the thread finishes loading.
- 主要言語
- TypeScript
- スター
- 10k
- フォーク
- 698
- 平均マージ
- 1日 3時間
- マージ済み PR（30日）
- 133
環境構築
このプロジェクトには開発コンテナ、Dockerfile、コントリビューションガイドがありません。まず README を読み、一般的な手順ははじめてのコントリビューションガイドを参照してください。
はじめの一歩
- issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
- 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
- リポジトリをフォークし、ブランチを切って変更します。
- issue 番号を参照したプルリクエストを送ります。
thesysdev/openui のほかの issue
-
難易度 2/5 1〜3時間 初心者へのやさしさ 62/100
メンテナーはふだん 1 日以内に返信
-
難易度 2/5 1〜3時間 初心者へのやさしさ 70/100
メンテナーはふだん 1 日以内に返信
-
難易度 2/5 1〜3時間 初心者へのやさしさ 78/100
thesysdev/openui#1445 · コメント 2 件 ·
メンテナーはふだん 1 日以内に返信
-
Add dataInvention flag to PromptOptions to disable the 'generate realistic/plausible data' ruleオープン
難易度 2/5 1〜3時間 初心者へのやさしさ 76/100
thesysdev/openui#959 · コメント 1 件 ·
メンテナーはふだん 1 日以内に返信
-
難易度 1/5 1時間未満 初心者へのやさしさ 18/100
thesysdev/openui#1528 · リアクション 1 件 ·
メンテナーはふだん 1 日以内に返信
thesysdev/openui の issue をすべて見る
似ている issue
-
mobile-app
難易度 2/5 1〜3時間 初心者へのやさしさ 74/100
Open-Locker/Open-Locker#352 ·
メンテナーはふだん 1 日以内に返信
-
難易度 2/5 1〜3時間 初心者へのやさしさ 62/100
leanprover-community/lean4game#589 ·
メンテナーはふだん 2 日以内に返信
-
Add: CS Action BGオープンcheck:passed streams:add
難易度 1/5 1時間未満 初心者へのやさしさ 68/100
メンテナーはふだん 1 日以内に返信
-
難易度 2/5 1〜3時間 初心者へのやさしさ 72/100
メンテナーはふだん 1 日以内に返信
-
難易度 1/5 1時間未満 初心者へのやさしさ 82/100
unocss/unocss#5421 · コメント 1 件 ·
メンテナーはふだん 1 日以内に返信