mirror of
https://github.com/MBombeck/HealthLog.git
synced 2026-11-13 22:32:04 +00:00
a11y(coach): announce streaming assistant text to screen readers
The streaming assistant bubble updated in place as the SSE tokens landed but had no aria-live region — sighted users saw live text while screen-reader users heard silence. Wrap the in-flight bubble in role=log + aria-live=polite + aria-relevant=additions text so the assistant prose announces progressively (matches the daily-briefing pattern that already uses aria-live for its loading state). Fixes Design-HIGH-3. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
1 parent
3c353fe012
commit
8479e05a20
1 file changed
+6
@@ -115,6 +115,11 @@ export function MessageThread({
|
|||||||
/>
|
/>
|
||||||
))}
|
))}
|
||||||
{streamingActive && streaming && (
|
{streamingActive && streaming && (
|
||||||
|
// role=log + aria-live=polite so screen-reader users hear the
|
||||||
|
// assistant prose announce as tokens land. aria-relevant=text
|
||||||
|
// limits announcements to the streamed content; additions
|
||||||
|
// covers the bubble-mount edge case.
|
||||||
|
<div role="log" aria-live="polite" aria-relevant="additions text">
|
||||||
<ChatBubble
|
<ChatBubble
|
||||||
role="assistant"
|
role="assistant"
|
||||||
content={streaming.content}
|
content={streaming.content}
|
||||||
@@ -123,6 +128,7 @@ export function MessageThread({
|
|||||||
inProgress={streaming.inProgress}
|
inProgress={streaming.inProgress}
|
||||||
errorCode={streaming.errorCode}
|
errorCode={streaming.errorCode}
|
||||||
/>
|
/>
|
||||||
|
</div>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
Reference in new issue
Block a user