The format list should be an ARIA menu and other a11y improvements

[afercia]

The format list with paragraph format and headings level should work like the DropDown component:

• should use role="menu" and role="menuitem"
• should use arrows navigation
• all the items are <span> elements: with role="menuitem" their semantic would be OK but worth considering to use a natively interactive element (button?) to simplify the JS part
• not sure why it is using aria-hidden="true" on the items
• the toggle button needs a focus style, see for example the style used on the similar block switcher toggle button:

Todo: consider to re-use the DropdownMenu component

[afercia]

I think this has been refactored and now uses the DropDown. However seems keyboard navigation wit arrows doesn't work as expected, needs to be tested again.

[afercia]

Seems to me at the moment this dropdown list of formats is used only in the "Classic Text" block.

[afercia]

See #2989

[jeffpaul]

This ticket was mentioned in Slack in #core-editor by jeffpaul. View the logs.

[afercia]

I think this can be closed now. Since July 2017 many things have changed and blocks don't use this "dropdown" any longer. The only block that uses something similar is the "Classic" one, which is powered by TinyMCE.