Skip to content

fix: auto-scroll to bottom when new messages arrive in chat view#1276

Open
MaHaoHao-ch wants to merge 1 commit into
EKKOLearnAI:mainfrom
MaHaoHao-ch:fix/37811-chat-autoscroll
Open

fix: auto-scroll to bottom when new messages arrive in chat view#1276
MaHaoHao-ch wants to merge 1 commit into
EKKOLearnAI:mainfrom
MaHaoHao-ch:fix/37811-chat-autoscroll

Conversation

@MaHaoHao-ch

Copy link
Copy Markdown

Summary

Fixes #37811 - Chat view auto-scrolls up / fails to follow latest message during multi-turn conversations.

Problem

During a conversation session in the Desktop App GUI, the chat view frequently scrolls upward automatically, failing to stay pinned to the latest message. Users have to manually scroll down to see new content.

Root Cause

The VirtualMessageList component did not auto-scroll to bottom when new messages arrived. It only synced viewport position, causing the view to "jump away" from the latest message as the list grew.

Solution

  • Add autoScroll and autoScrollThreshold props to VirtualMessageList (both enabled by default)
  • Auto-scroll to bottom when new messages arrive if user is near bottom (within 200px)
  • This matches standard chat app behavior where the view follows the latest message unless the user manually scrolls up

Changes

  • packages/client/src/components/hermes/chat/VirtualMessageList.vue:
    • Added autoScroll prop (default: true)
    • Added autoScrollThreshold prop (default: 200px)
    • Enhanced watch(messageKeys) to auto-scroll when new messages are added and user is near bottom

Testing

  • Verified that when new messages arrive and the user is near the bottom, the view auto-scrolls to show the latest message
  • Verified that when the user has scrolled up (away from bottom), the view stays at current position
  • Verified that existing functionality (scroll to message, scroll to anchor, etc.) continues to work correctly

When new messages are added to the chat view and the user is already near the bottom, automatically scroll to the latest message. This fixes the issue where the chat view would scroll upward and fail to follow the latest message during multi-turn conversations.

Changes:
- Add  and  props to VirtualMessageList
- Auto-scroll to bottom when new messages arrive if user is near bottom
- Default threshold is 200px to match standard chat app behavior

Closes #37811
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant