ant-design / ant-design

An enterprise-class UI design language and React UI library
https://ant.design
MIT License
92.26k stars 49.44k forks source link

Table sort buttons `aria-label` is [object Object] #38155

Closed jmatelowski closed 2 years ago

jmatelowski commented 2 years ago

Reproduction link

Edit on CodeSandbox

Steps to reproduce

  1. Open demo
  2. Change any column title to ReactNode (name column already changed)
  3. Inspect th aria-label prop

What is expected?

aria-label="name sortable"

What is actually happening?

aria-label="[object Object] sortable" image

Environment Info
antd 4.23.6
React 16.14
System macOS
Browser Chrome, Firefox

Table columns documentation says that column.title supports ReactNode but unfortunatelly, if we provide the ReactNode instead of string the aria-label value is broken. It impede to table header cell accessibility. For example: it is difficult to get element by role in React Testing Library.

Added in https://github.com/ant-design/ant-design/pull/37167

github-actions[bot] commented 2 years ago

Hello @jmatelowski. We totally like your proposal/feedback, welcome to send us a Pull Request for it. Please send your Pull Request to proper branch (feature branch for the new feature, master for bugfix and other changes), fill the Pull Request Template here, provide changelog/TypeScript/documentation/test cases if needed and make sure CI passed, we will review it soon. We appreciate your effort in advance and looking forward to your contribution!

你好 @jmatelowski,我们完全同意你的提议/反馈,欢迎直接在此仓库 创建一个 Pull Request 来解决这个问题。请将 Pull Request 发到正确的分支(新特性发到 feature 分支,其他发到 master 分支),务必填写 Pull Request 内的预设模板,提供改动所需相应的 changelog、TypeScript 定义、测试用例、文档等,并确保 CI 通过,我们会尽快进行 Review,提前感谢和期待您的贡献。

giphy

kiner-tang commented 2 years ago

May i work on it?

dgreene1 commented 1 year ago

@kiner-tang your change introduced this bug https://github.com/ant-design/ant-design/issues/39410 so if you can kindly please test your changes in a screen reader (like NVDA, VoiceOver, etc) that would help prevent regressions for non-visual users.

cc @mellis481