WebAIM - Web Accessibility In Mind

E-mail List Archives

List of buttons triggers MENU role

for

From: Isabel Holdsworth
Date: Oct 24, 2018 4:12AM

Hi all,

I'm creating a drag-and-drop scenario, in which items across the top
of the screen can be dragged to one of two or three areas underneath.

I wanted to mark up the draggable items as buttons so screenreader
users know they need to be pressed for something to happen. But when I
encapsulate the buttons in a <ul> or <div role="group"> either JAWS or
the browser (not sure which) seems to assign a MENU role to the whole
group, which is something I don't want.

I can mark up the items as links, in which case the component works
beautifully. But that would be semantically incorrect and I'd like to
avoid this if possible.

Does anyone know how to disable this annoying automatic role assignment?

Thanks as always, Isabel