issue(a11y): the sources of a web search can’t be opened from the keyboard

该问题出现在 Open WebUI 回复消息中的“Searched N sites”状态行上:用 Tab 键无法聚焦该行,因此网页搜索来源无法通过键盘展开或打开。优先检查前端组件 ResponseMessage/WebSearchResults.svelte 与 ResponseMessage/St

快速结论:该问题出现在 Open WebUI 回复消息中的“Searched N sites”状态行上:用 Tab 键无法聚焦该行,因此网页搜索来源无法通过键盘展开或打开。优先检查前端组件 ResponseMessage/WebSearchResults.svelte 与 ResponseMessage/StatusHistory.svelte 的可访问性实现。

适用环境:Open WebUI 的 dev 分支(提交 feefe03bf);Linux;Firefox;Ollama v0.40.13;Git Clone 安装;默认设置。

最快修复方案:暂无确认的一步修复方案。Issue 正文只给出了根因定位,尚未提供已验证的补丁或配置项。

注意事项:复现依赖两个前置条件:需将 Function Calling 设为 Legacy(只有该模式下才显示状态行),并在消息框的 Integrations 中开启 Web Search。修改前端组件属于代码级修复,需要自行验证键盘操作与屏幕阅读器播报效果,Issue 中未给出官方修复版本。

问题场景

在 Open WebUI 中开启 Web Search 后,当一条回复使用了网页搜索,其状态历史里会出现“Searched N sites”一行,点击可展开该次搜索引用的站点。用户从键盘按 Tab 键时,焦点会跳过这一行直接落到回复的 Edit 等按钮上,导致来源列表完全无法用键盘打开。

按 Issue 的复现步骤:先在 Admin Panel > Settings > Web Search 开启 Web Search 并选择引擎(DuckDuckGo 无需密钥)后保存;再在新对话的 Controls > Advanced Params 中将 Function Calling 设为 Legacy;然后在消息框 Integrations 中开启 Web Search,发送一个需要搜索的问题;回复完成后 Tab 到上方的“Toggle status history”并回车展开历史,再按 Tab,焦点会越过“Searched N sites”。

报错原文

issue(a11y): the sources of a web search can't be opened from the keyboard

Tab goes past "Searched N sites" to the reply's buttons, so only a mouse can open the sources.

原因分析

根据 Issue 正文对代码的定位,可能原因如下:

  • ResponseMessage/WebSearchResults.svelte 在把该行交给 common/Collapsible.svelte 时没有传入 title。缺少 title 时,Collapsible 渲染的是一个可点击的 <div>,没有 role、没有 tabindex,也没有键盘事件处理,因此 Tab 无法聚焦,键盘也无法触发展开。
  • 该元素不是 button,屏幕阅读器不会被告知它可以打开内容,也不会播报其展开/收起状态。
  • 在 ResponseMessage/StatusHistory.svelte 中,最新的状态被渲染在“Toggle status history”的 <button> 内部;当“Searched N sites”恰好是最新状态时,就会出现一个交互控件嵌套在另一个按钮内部的结构问题。

环境排查

  • 确认 Open WebUI 版本:Issue 报告在最新 release 与当前 dev 分支(feefe03bf)上均可复现。
  • 确认操作系统与浏览器:Issue 使用 Linux + Firefox;其他浏览器表现未在 Issue 中确认。
  • 确认 Ollama 版本:v0.40.13(与前端可访问性问题可能无直接关系,仅供环境对照)。
  • 确认 Function Calling 已设为 Legacy,否则状态行不会显示。
  • 确认已开启 Web Search 且所用引擎可用。
  • 确认安装方式为 Git Clone,便于直接定位和修改前端源码。

解决步骤

  1. 按上述复现步骤稳定复现问题,确认 Tab 会越过“Searched N sites”。
  2. 右键该行选择 Inspect Accessibility Properties,确认其没有 button role、没有 expanded 状态,作为修复前的基线记录。
  3. 检查 ResponseMessage/WebSearchResults.svelte:确认调用 common/Collapsible.svelte 时是否缺少 title,这是 Issue 指出的直接成因。
  4. 检查 ResponseMessage/StatusHistory.svelte:确认最新状态是否被渲染在“Toggle status history”按钮内部,避免交互控件嵌套。
  5. 可优先尝试的修复方向:让来源行具备可聚焦与键盘触发能力(例如具备 button role、tabindex 与 Enter 键处理),并向辅助技术暴露展开/收起状态;同时调整结构,避免嵌套在另一个按钮中。具体实现 Issue 未给出,需自行编写并验证。

验证方法

修复后按 Issue 的预期行为检查:按 Tab 能到达“Searched N sites”,按 Enter 可以展开和收起站点列表,屏幕阅读器将其播报为一个可展开/收起的按钮;再次通过 Inspect Accessibility Properties 确认其具有 button role 与 expanded 状态,且不再嵌套于“Toggle status history”按钮内。

参考来源

open-webui/open-webui #33446

GamsGo AI

AI 工具推荐

想把多个 AI 模型放在一个入口?

GamsGo AI 集成 ChatGPT、DeepSeek、Gemini、Claude、Midjourney、Veo 等常用模型,适合写作、绘图、视频和日常 AI 工作流。

了解 GamsGo AI

推广链接:通过此链接购买,我可能获得佣金,不影响你的价格。

这个方案解决了吗?

celebrityanime
celebrityanime
文章: 31602

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注