github-starred/open-webui
2
0
Fork 0
mirror of https://github.com/open-webui/open-webui.git synced 2026-05-07 11:28:35 -05:00
Code Issues 1.3k Packages Projects Releases 126 Wiki Activity

[PR #21706] [MERGED] fix(a11y): improve model selector accessibility with proper listbox/option pattern #49272

New Issue
Closed
opened 2026-04-30 01:35:25 -05:00 by GiteaMirror · 0 comments
GiteaMirror commented 2026-04-30 01:35:25 -05:00
Owner
Copy Link

📋 Pull Request Information

Original PR: https://github.com/open-webui/open-webui/pull/21706
Author: @Classic298
Created: 2/21/2026
Status: ✅ Merged
Merged: 2/21/2026
Merged by: @tjbck

Base: dev ← Head: a11y/model-selector-combobox

📝 Commits (1)

  • 78705c5 fix(a11y): improve model selector accessibility with proper listbox/option pattern

📊 Changes

2 files changed (+9 additions, -4 deletions)

View changed files

📝 src/lib/components/chat/ModelSelector/ModelItem.svelte (+5 -3)
📝 src/lib/components/chat/ModelSelector/Selector.svelte (+4 -1)

📄 Description

  • Replace incorrect aria-roledescription='model-item' with role='option' and aria-selected on ModelItem.svelte. The previous attribute was not a valid ARIA role description and provided no useful information to screen readers.

  • Add contextual aria-label to each model item button (e.g. 'Select GPT-4 model') instead of just the raw model name, making the action clear to screen reader users.

  • Add role='listbox' and aria-label='Available models' to the scrollable model list container in Selector.svelte so screen readers announce the container's purpose and navigate items correctly.

  • Make the model selector trigger button's aria-label dynamic: it now announces 'Selected model: GPT-4' when a model is selected, falling back to 'Select a model' when nothing is selected.

  • Add aria-label to the eject (unload) button in ModelItem.svelte so screen readers announce its purpose.

  • Add aria-label to the cancel download button in Selector.svelte with the specific model name being canceled.

  • Improve model profile image alt text from generic 'Model' to contextual '{{modelName}} profile image'.

Contributor License Agreement

By submitting this pull request, I confirm that I have read and fully agree to the Contributor License Agreement (CLA), and I am providing my contributions under its terms.

Note

Deleting the CLA section will lead to immediate closure of your PR and it will not be merged in.

🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.

## 📋 Pull Request Information **Original PR:** https://github.com/open-webui/open-webui/pull/21706 **Author:** [@Classic298](https://github.com/Classic298) **Created:** 2/21/2026 **Status:** ✅ Merged **Merged:** 2/21/2026 **Merged by:** [@tjbck](https://github.com/tjbck) **Base:** `dev` ← **Head:** `a11y/model-selector-combobox` --- ### 📝 Commits (1) - [`78705c5`](https://github.com/open-webui/open-webui/commit/78705c56117f60925bd507438774575c800bb1f9) fix(a11y): improve model selector accessibility with proper listbox/option pattern ### 📊 Changes **2 files changed** (+9 additions, -4 deletions) <details> <summary>View changed files</summary> 📝 `src/lib/components/chat/ModelSelector/ModelItem.svelte` (+5 -3) 📝 `src/lib/components/chat/ModelSelector/Selector.svelte` (+4 -1) </details> ### 📄 Description - Replace incorrect aria-roledescription='model-item' with role='option' and aria-selected on ModelItem.svelte. The previous attribute was not a valid ARIA role description and provided no useful information to screen readers. - Add contextual aria-label to each model item button (e.g. 'Select GPT-4 model') instead of just the raw model name, making the action clear to screen reader users. - Add role='listbox' and aria-label='Available models' to the scrollable model list container in Selector.svelte so screen readers announce the container's purpose and navigate items correctly. - Make the model selector trigger button's aria-label dynamic: it now announces 'Selected model: GPT-4' when a model is selected, falling back to 'Select a model' when nothing is selected. - Add aria-label to the eject (unload) button in ModelItem.svelte so screen readers announce its purpose. - Add aria-label to the cancel download button in Selector.svelte with the specific model name being canceled. - Improve model profile image alt text from generic 'Model' to contextual '{{modelName}} profile image'. ### Contributor License Agreement <!-- 🚨 DO NOT DELETE THE TEXT BELOW 🚨 Keep the "Contributor License Agreement" confirmation text intact. Deleting it will trigger the CLA-Bot to INVALIDATE your PR. --> By submitting this pull request, I confirm that I have read and fully agree to the [Contributor License Agreement (CLA)](https://github.com/open-webui/open-webui/blob/main/CONTRIBUTOR_LICENSE_AGREEMENT), and I am providing my contributions under its terms. > [!NOTE] > Deleting the CLA section will lead to immediate closure of your PR and it will not be merged in. --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
GiteaMirror added the pull-request label 2026-04-30 01:35:25 -05:00
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
bug
confirmed
confirmed issue
core
documentation
enhancement
good first issue
help wanted
non-core
pull-request
Mirrored from GitHub Pull Request
 python
question
testing wanted
No Label pull-request
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
GiteaMirror ninjasurge
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github-starred/open-webui#49272
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?