重复问题

• 我已搜索现有的问题

最新版本

• 我已测试了最新版本

重现问题的步骤 🕹

链接到实时示例：
https://codesandbox.io/s/youthful-artem-ycvxvf?file=/src/App.tsx
步骤：

1. 启用屏幕阅读器(我使用的是NVDA)
2. 切换到按钮
3. 按Enter键打开弹出窗口
4. 弹出窗口内容未被读取

当前行为 😯

目前，当你打开一个弹出窗口时，它的内容不会被屏幕阅读器读取。

预期行为 🤔

弹出窗口的内容应该在打开时被屏幕阅读器读取。

上下文 🔦

我正在构建一个弹出帮助模态框，但我不想使用全屏模态框。弹出窗口似乎应该是正确的选择，它的行为大致如下：

• 打开时聚焦其内容
• 从内部按下 Escape 可以关闭它
• 按tab键可以在弹出窗口内循环切换元素

然而，屏幕阅读器没有正确地读取其内容。当对话框打开时，没有屏幕阅读器反馈，所以你不知道对话框已经打开或者你的焦点已经移动到其中。
我花了超过2个小时试图弄清楚原因，最后我发现这是因为弹出窗口的角色是 generic 而不是 dialog 。通过将角色设置为 dialog ,打开弹出窗口时会宣布为对话框并且内容会被读取。