空表格单元格的可访问性

Question

我们正在使用ax来测试辅助功能。

当表格单元格为空时，Ax会发出以下问题：

  

具有role = columnheader / rowheader的所有元素和元素必须是它描述的数据单元

如果我们为空表格单元格执行此操作：

<td><span style={{ visibility: 'hidden' }}>empty</span>

问题消失了，但这有点黑客。有人知道最好的解决方法吗？

值得知道这不能解决问题：

<td><span style={{ visibility: 'hidden' }}>&nbsp;</span>

我们正在React环境中工作，因此是React样式标记。

Answer 1

在WCAG中没有这个限制。

数据单元格可以为空。 cell元素具有td角色和this role does not require an accessible name。

根据axe unit tests，此错误仅显示何时与th无关联的非空th。您应该有两个解决方案：将td替换为aria-label="No value"或添加可访问的名称（例如，使用$("textarea").val().length属性）