tab component keyboard accessibility

未关闭 适合新手
#775 0 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看

维护者通常 1 天内回复

还没有人认领这个 Issue。

评估

难度
2/5
预计耗时
1-3 小时
新手友好度
68/100
Issue 类型
功能
描述清晰度
基本清楚
活跃度
活跃
技术栈
react, typescript

调研方向

先找到标签页组件及其键盘交互测试,然后将当前行为与 issue 中链接的 WAI-ARIA 标签页键盘交互指南进行比较。添加通过方向键、Home 和 End 在标签页之间导航的功能。完成标准是键盘用户可以用这些按键访问每个标签页,且现有的标签页行为仍然正常工作。

由索引模型根据 Issue 内容生成。

描述

accessibility bug

According to https://www.w3.org/WAI/ARIA/apg/patterns/tabs/#keyboardinteraction we should be able to use arrows and Home / End to navigate between individual tabs.

Currently that is not possible.

It sais on the same page that:

Don't use tabs for site navigation. If each "tab" loads a different page or route, it's a navigation menu. Mark it up as

with links and put aria-current="page" on the current one. Screen reader users expect tab semantics to mean switching content in place.

But I don't think we should worry about it. On the component level we have no way how to detect it and in the context of SPA the concept of a page is blurry anyway.

主要语言
TypeScript
星标
23
派生
10
平均合并
5 天 12 小时
30 天内合并 PR
9

环境准备

在 Codespaces 中打开

在浏览器里用你自己的 GitHub 账号启动这个项目的开发容器。

  • 没有 Dockerfile 或 Docker Compose 文件
  • 没有 Pull Request 模板
  • 没有贡献指南

从这里开始

  1. 先读完整个 Issue,再读项目的贡献指南。
  2. 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
  3. Fork 仓库,在一个分支上完成修改。
  4. 提交 Pull Request,并在描述里引用这个 Issue 编号。

react-ui-org/react-ui 的其他 Issue

查看 react-ui-org/react-ui 的全部 Issue

相似的 Issue

更多 TypeScript Issue

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。