快速结论:在 Open WebUI 的聊天或频道中打开全屏图片查看器后,键盘焦点仍停留在查看器背后的图片或聊天按钮上,因此按 Tab 会在被黑色遮罩挡住的聊天控件间移动。优先排查 common/ImagePreview.svelte 是否缺少 dialog 角色、可访问名称和焦点陷阱。
适用环境:Open WebUI dev 分支(提交 feefe03bf);Linux;Firefox;Ollama v0.40.13;Git Clone 安装;默认设置。
最快修复方案:暂无确认的一步修复方案,Issue 未提供已验证的补丁或配置项。
注意事项:该问题标记为 bug、confirmed issue、a11y;涉及组件为 common/ImagePreview.svelte,聊天与频道中的图片均通过 common/Image.svelte 调用同一查看器。若自行修改,需同时处理打开时聚焦、Tab 焦点限制在 Close/Download 按钮、关闭后焦点回到原图片,以及 dialog 角色与名称,单纯调整 CSS 或 z-index 无法解决。
问题场景
用户在 Open WebUI 的聊天中点击图片,或按 Tab 聚焦到消息中的图片后按 Enter,触发全屏黑色图片查看器(含 Close 与 Download 按钮)。随后按 Tab,焦点并未进入查看器,而是落到查看器背后、被遮罩挡住的聊天消息 Edit 和 Copy 按钮上;此时按 Escape 可能需要两次才能关闭查看器,首次 Escape 只隐藏了背后 Copy 按钮的 tooltip,关闭后焦点也不会回到原图片。该查看器由 common/ImagePreview.svelte 实现,聊天和频道中的图片都通过 common/Image.svelte 打开它。
报错原文
issue(a11y): the full-size image viewer doesn't take focus, so Tab moves through the chat hidden behind it
原因分析
根据 Issue 描述,最可能的原因是 common/ImagePreview.svelte 打开时仅把自身 <div> 移动到页面末尾,但未设置 role 或可访问名称、未把焦点移入查看器、也未实现焦点陷阱。因此键盘焦点留在遮罩后方的图片和聊天按钮上,屏幕阅读器也无法感知查看器已打开。同一份报告指出,基于 common/Modal.svelte 的窗口(如 Settings)已使用焦点陷阱,可作为对照实现。
环境排查
- 确认 Open WebUI 版本是否为 dev 分支(报告中为 feefe03bf),并确认是否也在最新 release 上复现。
- 确认安装方式为 Git Clone,避免容器或打包版本中的静态资源未更新导致观察结果偏差。
- 确认操作系统为 Linux、浏览器为 Firefox,并分别测试鼠标点击图片与 Tab+Enter 打开查看器两种入口。
- 检查 Ollama 版本(报告中为 v0.40.13),但该问题属于前端可访问性,客户端 Ollama 版本通常不是直接原因。
- 确认设置保持默认,避免自定义主题或浏览器扩展干扰焦点行为。
解决步骤
- 在浏览器中复现:发送带图片的消息,按 Tab 聚焦图片并 Enter 打开查看器,连续按 Tab 两次,记录焦点是否落到查看器背后的 Edit、Copy 按钮。
- 用开发者工具检查查看器节点,确认其是否缺少 dialog 角色和可访问名称;Issue 中通过“检查辅助功能属性”观察到 role 与 name 均为空。
- 定位
common/ImagePreview.svelte,对照common/Modal.svelte已有的焦点陷阱实现,可优先尝试补上角色与名称、打开时移入焦点、限制 Tab 在 Close/Download 按钮之间循环、关闭时把焦点还给触发图片。 - 同时检查聊天和频道两类入口,因为两者都经由
common/Image.svelte调用同一个查看器,修复应覆盖组件层而非单个页面。 - 验证 Escape 行为:打开查看器后按一次 Escape 应关闭查看器,不应先只隐藏背后按钮的 tooltip。
验证方法
重新打开图片查看器后,焦点应立即落在查看器内;连续按 Tab 时焦点只在 Close 和 Download 按钮间移动,不会进入遮罩背后的聊天内容;屏幕阅读器应能识别到带有名称的 dialog;按一次 Escape 即可关闭,且关闭后焦点回到打开查看器的那张图片。同时确认通过鼠标点击和键盘 Enter 两种方式打开时行为一致。
参考来源
AI 工具推荐
想把多个 AI 模型放在一个入口?
GamsGo AI 集成 ChatGPT、DeepSeek、Gemini、Claude、Midjourney、Veo 等常用模型,适合写作、绘图、视频和日常 AI 工作流。
推广链接:通过此链接购买,我可能获得佣金,不影响你的价格。
这个方案解决了吗?
可以继续搜索完整报错,或查看同一工具的其他排查指南。


![[Bug]: MinerU 3.x /file_parse upload ignores the pipeline context and stays open after the run is cancelled](https://www.chat-gpts.plus/wp-content/uploads/2026/10/21572-82f3bc14-768x403.jpg)