Report case sensitivity issues

Saw a question come up today about:

<ul role="list">
  <li role="listItem">...</li>
</ul>

The problem is that capital letter “I” in “listItem”. There are two possible issues there:

1. I’m not so sure this should be case sensitive, we should test our ARIA rules to figure out where case sensitivity matters and where it doesn’t. If it followed the specs, it should be case insensitive in HTML and case sensitive in XHTML.

2. In such cases, it would be good for axe-core to explicitly call out that the item was failed because of case sensitivity.

3. It would be nice to report this particular case as needs review instead of a fail, because the implicit role here is the correct role. This is a false positive.

[straker]

@dan-tripp Alright. Talked with @WilcoFiers and we decided that we just want to deal with informing users of the case sensitivity problem and deal with axe-core being case insensitive in a separate issue.

So what we’ll want to do is update the invalidrole check to call toLowerCase on the role before it passes it to isValidRole (that will stop aria-roles from failing on the roles). We’ll then want to add a new check to the aria-roles rule that specifically looks for roles that are not all lower case and flag them as Needs Review (i.e. returns undefined) and informs the user that roles that are not all lower case are not widely supported.

[jnurthen]

Just confirmed with @mfairchild365 that dragon is case sensitive. The following does not work in Dragon

<div role="Button">Capital B</div>
<div role="BUTTON">All caps</div>

• Dragon does this via document.querySelectorAll (case sensitive attribute values by default) but apparently this would work if Nuance decided to finally update their code… document.querySelectorAll(“[role=button i]”)
• Dragon will discover the element if it has an onclick attribute and then parse out that it is a button no matter what case was used (this threw me through a loop at first because I tested by adding onclick to all the buttons and it somehow worked)

Looking at the code this looks correct. I was only looking at the clickable code branch not the non-clickable code branch previously.