Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Allow role=combobox for button and input type=button

See original GitHub issue

ARIA in HTML is planning to allow role=combobox on a button and input type=button element.

button role=combobox test case

Additionally, the ARIA in HTML PR adds role=checkbox as an allowed role for input type=button to match the button element allowances. This was an oversight in the spec which this PR will help correct.

Issue Analytics

State:
Created 2 years ago
Reactions:4
Comments:7 (3 by maintainers)

Top GitHub Comments

3reactions

strakercommented, Nov 15, 2022

For a workaround you can configure the standards object to allow it, similar to what the pr is doing

axe.configure({
  standards: {
    htmlElms: {
      button: {
        allowedRoles: [
          'checkbox',
          'combobox',
          'link',
          'menuitem',
          'menuitemcheckbox',
          'menuitemradio',
          'option',
          'radio',
          'switch',
          'tab'
        ]
      }
    }
  }
})

@scottaohara I think this might have fallen through the cracks (as well as a few other of your prs). I’ll go back and look into them.

1reaction

strakercommented, Dec 1, 2022

@adcortes We are planning a release later this month which should include this change. After axe-core releases, it’ll probably be another couple of weeks or so before it is released into the extension.

Top Results From Across the Web

ARIA: combobox role - Accessibility - MDN Web Docs - Mozilla

The combobox role identifies an element as an input that controls another element, such as a listbox or grid, that can dynamically pop...

Do I need role="button" on a <button>?

So, setting role="button" is "not recommended", but allowed. ... A submit button that submits the form when clicked ( type = submit )....

Select-Only Combobox Example | APG | WAI

Date Picker Combobox: An editable date input combobox that opens a dialog containing a calendar grid and buttons for navigating by month and ......

Creating Accessible Combo Boxes – Blog

This will allow screen readers to refer to the list element as the ... <input id="combo-input" role="combobox" type="text" /> <button ...

Button group

For button groups, this would be role="group" , while toolbars should have a ... </div> <input type="text" class="form-control" placeholder="Input group ...