aria- *属性无效或拼写错误

Question

我通常是在Chrome审核中使用Lighthouse测试网站的可访问性。

我偶然发现了这个警告：

  

aria- *属性无效或拼写错误。

这是失败的元素：

<a class="issue-title muted-link" href="#" data-bi-name="issue-expander" aria-role="button" aria-expanded="false" aria-controls="issue-26732-body issue-26732-comments issue-26732-reactions issue-26732-reactions-menu" aria-label="Toggle issue">

这是任何人感兴趣的链接。 Azure load balancer Feedback Section

在我看来，aria- *名称和值是有效的。

• aria-role =“ button”似乎正确。
• aria-expanded =“ false”似乎是正确的。
• aria-label似乎是正确的
• aria-controls =“ ...”似乎包含一个ID列表，所有这些ID在DOM中都存在（尽管我不确定，如果它在DOM中不存在，则可访问性检查应该失败并动态添加）

此操作失败的原因可能是什么？

Answer 1

正确的拼写不是aria-role，而是role。另请参见HTML5.2中的ARIA Role Attribute。

aria-expanded，aria-controls和aria-label是正确的。

我承认错误消息可能更清楚，例如通过指出aria-role无效。