[Bug] Modal hardcodes aria-labelledby and aria-describedby pointing to nonexistent element IDs
维护者通常 1 天内回复
评估
这个 Issue 还没有评估数据。
描述
Current Behavior
In Sistent's Modal component (src/custom/Modal/index.tsx, lines 182–183), the underlying StyledDialog hardcodes:
aria-labelledby="alert-dialog-slide-title"aria-describedby="alert-dialog-slide-description"
However:
- The rendered title element (
<Typography data-testid="modal-title">{title}</Typography>) does not carryid="alert-dialog-slide-title". - There is no element rendered with
id="alert-dialog-slide-description". - Because these IDs are static strings rather than dynamically generated (e.g., via
React.useId()), any future attempt to attach static IDs would also produce duplicate-ID DOM collisions when multiple modals exist in the component tree. - Screen readers and automated accessibility audits (e.g., axe, Lighthouse) flag
aria-labelledbyandaria-describedbyreferencing nonexistent element IDs.
Currently, consumers must rely on conditional mounting ({isOpen && <Modal ... />}) as a workaround to avoid tree-level accessibility collisions.
Expected Behavior
aria-labelledbyshould reference the ID of the modal's rendered title component.- The ID should be unique per modal instance (using
React.useId()or an overridableid/aria-labelledbyprop) so multiple dialogs do not collide in the DOM. - If no description element is rendered,
aria-describedbyshould not be attached by default unless explicitly supplied by consumer props.
Screenshots/Logs
Environment
Contributor Guides and Resources
- 🛠 Meshery Build & Release Strategy
- 📚 Instructions for contributing to documentation
- 🎨 Wireframes and designs for Sistent site in Figma (open invite)
- 🙋🏾🙋🏼 Questions: Layer5 Discussion Forum and Layer5 Community Slack
- 主要语言
- TypeScript
- 星标
- 140
- 派生
- 243
- 平均合并
- 6 天 23 小时
- 30 天内合并 PR
- 13
环境准备
- 没有 Dockerfile 或 Docker Compose 文件
- 有 Pull Request 模板
- 阅读贡献指南
从这里开始
- 先读完整个 Issue，再读项目的贡献指南。
- 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
- Fork 仓库，在一个分支上完成修改。
- 提交 Pull Request，并在描述里引用这个 Issue 编号。
layer5io/sistent 的其他 Issue
-
InfoTooltip is not keyboard reachable and has no accessible name可能重新可做 关联的 PR 已关闭且未合并。 未关闭
难度 2/5 1-3 小时 新手友好度 84/100
维护者通常 1 天内回复
-
[UI] Permission Shield tooltip uses fixed `placement="top"` instead of adaptive placement可能已有人在做 @dhruveshmishra 于 72 天前认领。 未关闭component/ui help wanted kind/enhancement
难度 2/5 1-3 小时 新手友好度 68/100
layer5io/sistent#1772 · 5 条评论 ·
维护者通常 1 天内回复
-
Barrel re-exports DateTimePickerProps from the optional peer @mui/x-date-pickers, so the type is `any` for consumers who skip it可能已有人在做 @Valyrian-Code 于 82 天前认领。 未关闭
难度 2/5 1-3 小时 新手友好度 82/100
layer5io/sistent#1749 · 1 条评论 ·
维护者通常 1 天内回复
-
ESM build is not loadable by Node: extensionless 'lodash/debounce' specifier in dist/index.mjs可能重新可做 @Salmaan-M 于 86 天前认领，目前没有进行中的 PR。 未关闭
难度 2/5 1-3 小时 新手友好度 70/100
layer5io/sistent#1739 · 1 条评论 ·
维护者通常 1 天内回复
-
难度 3/5 半天 新手友好度 65/100
维护者通常 1 天内回复
相似的 Issue
-
bug engine
难度 2/5 1-3 小时 新手友好度 86/100
frostney/GocciaScript#1746 ·
维护者通常 1 天内回复
-
难度 2/5 1-3 小时 新手友好度 67/100
agilepathway/label-checker#739 · 4 条评论 ·
维护者通常 1 天内回复
-
难度 1/5 1 小时以内 新手友好度 68/100
CopilotKit/OpenBot#800 ·
维护者通常 1 天内回复
-
Endpoint links in the tag operations list are below the 24px target size可能已有人在做 @AdzerKI 今天认领。 未关闭
难度 2/5 1-3 小时 新手友好度 78/100
维护者通常 1 天内回复
-
难度 2/5 1-3 小时 新手友好度 79/100
ehmpathy/rhachet-roles-bhuild#471 ·
维护者通常 1 天内回复