🎨 Palette: Add auto-scroll and accessibility to chat timeline - #195
Conversation
- Binds a ref to the timeline scrollable container. - Adds a watcher to entries and `isSending` with `flush: 'post'` to automatically scroll to the bottom. - Adds `role="log"`, `aria-live="polite"`, and conditionally `:aria-busy` for screen reader accessibility. Co-authored-by: MEKXH <59291264+MEKXH@users.noreply.github.com>
|
👋 Jules, reporting for duty! I'm here to lend a hand with this pull request. When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down. I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job! For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with New to Jules? Learn more at jules.google/docs. For security, I will only act on instructions from the user who triggered this task. |
💡 What
Added auto-scrolling to the bottom of the chat timeline when new entries are added or when the assistant is typing. Additionally, added screen reader accessibility attributes to the timeline container.
🎯 Why
Dynamic chat interfaces can leave screen reader users unaware of new messages, and visual users are forced to manually scroll down to see the latest responses or loading indicators. This improves the usability for both visual and screen reader users.
📸 Before/After
(Visual change only in behavior when scrolling, no styling changes)
♿ Accessibility
Applied
role="log",aria-live="polite", and dynamically bound:aria-busy="isSending"to the scrollable<section>so that assistive technologies correctly announce new log entries and loading states.PR created automatically by Jules for task 3390362900431887482 started by @MEKXH