Editable tabs: add and remove buttons owned by role=tablist keep aria-required-children firing
@A-RYAN-1 已经在做这个了。
开始于 2026年10月2日。
评估
- 难度
- 4/5
- 预计耗时
- 3-5 天
- 新手友好度
- 65/100
- Issue 类型
- 缺陷
- 描述清晰度
- 基本清楚
- 活跃度
- 活跃
- 技术栈
- react, typescript
调研方向
Start in src/TabNavList/index.tsx and src/TabNavList/AddButton.tsx, then trace the remove button alongside each role="tab" node. Check how innerAddButtonRef feeds overflow measurement and inspect the related CSS on the antd side. Re-run the editable Tabs example through axe-core 4.13; done means add and remove buttons no longer trigger aria-required-children while overflow sizing still works.
由索引模型根据 Issue 内容生成。
描述
After #1024 moves role="tablist" to .rc-tabs-nav-list, aria-required-children still fires for editable tabs: the add button (src/TabNavList/AddButton.tsx, rendered inside the nav list next to the tab nodes in src/TabNavList/index.tsx) is a button owned by the tablist, and a tablist may only own tab elements. axe-core flags it critical: "Element has children which are not allowed: button".
The remove button is the same class of problem, pre-existing: it renders as a sibling of the role="tab" node inside each tab wrapper, so the tablist owns it too.
Repro: <Tabs editable={{ onChange: ... }} items={...} /> through axe-core 4.13 flags the add button node with aria-required-children (critical). The same check on a non-editable Tabs is clean with #1024 applied, which is why this is carved out of that PR's scope.
What a fix likely needs:
- relocate the add button outside
[role=tablist](or restructure so the tablist owns only tab nodes) while keeping theinnerAddButtonRefsize measurement working, it participates in the overflow calculation - move the remove button inside each
role="tab"element, or give it the same restructuring - matching CSS on the antd side for both moves
Context: remaining scope of the aria-required-children failure reported in ant-design/ant-design#49502; antd currently carries a waiting for fix exemption in the tabs a11y test (ant-design/ant-design#53584) that covers this.
- 主要语言
- TypeScript
- 星标
- 572
- 派生
- 242
- 平均合并
- 12 小时 6 分钟
- 30 天内合并 PR
- 2
环境准备
这个项目没有提供开发容器、Dockerfile 或贡献指南,环境需要你自己搭建:先看它的 README,通用步骤见我们的新手贡献指南。
从这里开始
- 先读完整个 Issue,再读项目的贡献指南。
- 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
- Fork 仓库,在一个分支上完成修改。
- 提交 Pull Request,并在描述里引用这个 Issue 编号。
react-component/tabs 的其他 Issue
-
难度 2/5 1-3 小时 新手友好度 72/100
react-component/tabs#865 · 1 条评论 ·
-
难度 2/5 1-3 小时 新手友好度 72/100
react-component/tabs#809 · 1 条评论 ·
-
[Accessibility] tabBarExtraContent is owned by role="tablist"可能重新可做 关联的 PR 已关闭且未合并。 未关闭
难度 4/5 3-5 天 新手友好度 64/100
react-component/tabs#1013 · 1 条评论 ·
-
难度 2/5 1-3 小时 新手友好度 48/100
react-component/tabs#777 · 1 个 reaction ·
-
难度 3/5 1-2 天 新手友好度 25/100
react-component/tabs#726 ·
查看 react-component/tabs 的全部 Issue
相似的 Issue
-
bug DUP Reservations
难度 2/5 1-3 小时 新手友好度 62/100
bcgov/reserve-rec-public#952 ·
维护者通常 1 天内回复
-
难度 2/5 1-3 小时 新手友好度 68/100
daufderheide/racecoordinator_ai#948 ·
维护者通常 1 天内回复
-
Bug pulumi/pulumi
难度 2/5 1-3 小时 新手友好度 72/100
维护者通常 1 天内回复
-
bug priority:high
难度 2/5 1-3 小时 新手友好度 82/100
维护者通常 1 天内回复
-
api bug claude
难度 2/5 1-3 小时 新手友好度 84/100
diegosouzapw/OmniRoute#15764 ·
维护者通常 2 天内回复