Dropdown has incorrectly nested <ul> and <li> elements.

[danielck]

Expected Behavior or Possible Solution

The Dropdown component contains a ul with role="listbox". The expectation for the native HTML element is that direct descendants of the element should be li elements. The expectation for the listbox role is that direct descendants should have role="option".

Actual Behavior and Screenshots

Current structure has an additional div within the hierarchy:

<ul role="listbox">
   <div>
      <li role="option">

Specifications

• https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/listbox_role

Suggested fix

Remove the extra div. Also semantically the use of ul and li have no meaning because they are overridden using the role attribute, so an alternative option is to move the role=listbox to the offending div.