在移动端视图中,在各种模态框中添加用户非常困难

:bug: 概述

移动端视图下,用于添加用户的下拉列表模态框经常出现在屏幕可视区域之外,导致尝试向下滑动查看时操作失败。

我在安全模式下复现此问题的一些场景包括:

  • 在群组页面将用户添加到群组
  • 将主题或帖子分配给用户(例如:从主题扳手菜单或帖子管理扳手菜单)
  • 邀请另一位用户加入私信(PM)
  • 将用户添加到忽略列表 /my/preferences/users(静音功能正常,因为下拉菜单没有模态框)

偶尔,在尝试轻轻向下滑动几次后,我可以使模态框保持在可视区域内,但这非常不稳定,且经常直接关闭。另外值得注意的是,我使用的是大屏幕手机(iPhone 15 Pro Max),因此该问题在更小的移动设备型号上可能更为严重。

:woman_walking: 复现步骤

以下是尝试填写下拉列表以将用户添加到群组时失败的一个示例:

  1. 以管理员身份进入群组页面,点击“+ 添加用户”按钮
  2. 在屏幕底部看到带有搜索字段的模态框
  3. 点击搜索字段输入内容,此时模态框会移至视口上方
  4. 尝试向下拖动模态框以便在字段中输入
  5. 失败 - 模态框自动关闭并返回到群组成员页面。

:white_check_mark: 预期结果

模态框应保持在可视区域内。请注意,从帖子管理菜单更改帖子所有权的类似模态框按预期工作:

:cross_mark: 实际结果

如上所述:由于模态框在视口中位置过高,导致用户搜索输入字段不可见。

:books: 附加信息

  • 我使用的是 iPhone 15 Pro Max,并在安全模式下使用最新的 Safari、Chrome 和 Firefox(以及 PWA)复现了上述问题。但在 iPad 上(无论是横屏还是竖屏)未复现。尚未确认 Android 移动端的情况。
  • 在桌面浏览器开发工具中使用移动模式无法复现此问题;我只能在移动设备上复现。
  • 我不确定这是 Discourse 的问题还是 iOS 的问题(我倾向于认为是 Discourse,因为更改帖子所有权的模态框似乎按预期工作)。
2 个赞