Product

axe-core

Product Version

4.9.1

Latest Version

• I have tested the issue with the latest version of the product

Issue Description

Note: I was only allowed to select one product, but this was observed both in axe-core running in our Ember integration tests and in the extension in Chrome. I thought that a fix to axe-core may also make its way into the extension, but wanted to call this out to be sure.

Expectation

The expectation is that the inner text of a button with role="combobox" would still be considered when checking for "discernible text".

Actual

Currently when a button has role="combobox" axe scans fail with the error "Buttons must have discernible text". The list of potential issues states in the first bullet point "Element does not have inner text that is visible to screen readers". This is not actually true; the button has text contents.

How to Reproduce

The issue can be observed here: https://codepen.io/rgallagherab/pen/JjqKKpE

This is a non-functional example, but the markup includes all required ARIA attributes and elements for combobox role, and no other failures relevant to the example markup (although there are 2 issues observed in the Codepen layout elements).

Additional context

From what I can gather it appears that while the element should be assessed as a combobox role two things are true:

1. It is still being considered a button to some extent considering the "Buttons must have discernible text" error is presented.
2. More importantly: axe-core is not considering the inner text of the element as described under the "fix at least (1) of the following" list. I assume this is likely some sort of conflict in how the combination of button and combobox is being handled.

As far as I can tell button should be a valid element to use role="combobox" on. If this was not the case I'd expect to see a failure for combobox not being an allowed role.