patternfly / patternfly/patternfly-react
Bug - Table - several variants don't allow customizing aria labeling
还没有人认领这个 Issue。
- 主要语言
- TypeScript
- 星标
- 862
- 派生
- 392
- 平均合并
- 4 天 8 小时
- 30 天内合并 PR
- 9
描述
[Edited by @thatblindgeye 11/7/2025]
This issue should involve fixing the following (we should try to prioritize the first 2 items, as they are affecting the new Compass demos):
-
The action buttons in the ActionsColumn should allow customizing the aria-label and aria-labelledby on MenuToggle, rather than hardcoding them as "Kebab toggle"
-
For selectable with checkbox/radio, we need to allow customizing the aria-label and aria-labelledby for the inputs, and also update the default values to be
index + 1(currently the first row will read "Select row 0", which makes sense from an index persepective but from a user perspective it should probably be "Select row 1") -
The Table sort functionality should allow passing some SR text to help identify what order the column is sorted.
- If we have any implementations where a sort button is standalone without any text, we should allow passing an aria-label and aria-labelledby to those as well
-
The Favorite button in FavoritesCell should allow customizing the aria-label and aria-labelledby (props are being spread in this file, but would need to check if how it's actually used with decorators if it's possible to override the default hardcoded values and pass in aria-labelledby)
-
DraggableCell default value should omit the word "button" in its default aria-label at the very least. Ideally we either wouldn't have a default value or the default would be able to be more unique as its used (right now every row will default to the same exact label which isn't good)
- We should also check if it's actually possible to override the default labels, and add the ability to use aria-labelledby
After these are completed, we want to open followup issues/PRs in Org to update any new Compass demos using a Table with any of the above functionality
[Original ticket below]
Describe the problem
It's not possible to add aria-label in Table sorts, so I can't use semantic syntax. If I'm a user who needs a screen reader to sort some data by name, for example, I just listen "name button" and not something with a better description.
Expected behavior
If I'm a user who needs a screen reader, when clicking in a button I should listen to a descriptive message about the functionality of the button, for accessibility purpose. So, when I have data inside a Table and I want to sort that data, I need to listen to a clear message.
Is this issue blocking you?
No
What is your environment?
- RHEL 8.6
- Browser Chrome
What is your product and what release date are you targeting?
consoledot
Jira Issue: PF-136
贡献指南
从这里开始
- 先读完整个 Issue,再读项目的贡献指南。
- 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
- Fork 仓库,在一个分支上完成修改。
- 提交 Pull Request,并在描述里引用这个 Issue 编号。
调研方向
从 Table 组件及 issue 中列出的 ActionsColumn、selectable checkbox/radio inputs、sort controls、FavoritesCell 和 DraggableCell 变体开始。检查它们当前的 aria labels 是如何设置的,并验证列出的每项自定义和默认值要求,包括 sort 和 standalone-button 的情况。完成意味着受影响的 Table 变体支持所请求的可访问标签,并已准备好进行后续的 Compass demo 更新。
由索引模型根据 Issue 内容生成。
评估
- 技术栈
- react, typescript
- 领域
- accessibility, frontend
- Issue 类型
- 缺陷
- 难度
- 4/5
- 预计耗时
- 3-5 天
- 活跃度
- 冷清
- 描述清晰度
- 基本清楚
- 新手友好度
- 45/100