[EuiComboBox] Rebuild with EuiSelectable #2841
Comments
myasonik
changed the title
cchaos
changed the title
|
As part of this work, also mark |
JasonStoltz
changed the title
…153808) ## Summary Related to #27749 While the [EuiComboBox rebuild](elastic/eui#2841) is in progress, this PR addresses missing aria properties and fixes option announcements for the `run as user` combo. It additionally adds an aria-label for the Spaces Navigation EuiSelectable that I found was missing. ### Testing - Add all sample data - Edit a non-reserved role - Turn on a screen reader (NVDA is recommended, but VoiceOver will do) - Tab through the controls on the Edit role screen. When you arrive in a combo box you may or may not hear an announcement declaring the name of the combo box (this is expected, especially with VoiceOver). - With focus in a combo box press the down arrow key. Verify the options are announced as you traverse them with the down and up arrow keys. - If there was success in option announcement, press escape key and verify that the name of the combo box is announced. You may have to press escape twice when using NVDA. Note: It seems to be the consensus that this is best we can do with the existing implementation of EuiComboBox, which is partly why it is being rebuilt with the EuiSelectable component.
cee-chen
changed the title
|
To add more requested context, EuiSelectable has the best built-in accessibility by far (semantic HTML, keyboard navigation, screen reader announcements) and we should dogfood that a11y instead of rewriting it for the 4+ selection components we use. In this case, EuiComboBox has several reported a11y and perf issues (in the github mentions history - see above) that would likely be resolved by this refactor. |
|
👋 Hi there - this issue hasn't had any activity in 6 months. If the EUI team has not explicitly expressed that this is something on our roadmap, it's unlikely that we'll pick this issue up. We would sincerely appreciate a PR/community contribution if this is something that matters to you! If not, and there is no further activity on this issue for another 6 months (i.e. it's stale for over a year), the issue will be auto-closed. |
|
Just a quick update. We're putting a 3 month window on completing this issue. I believe it should also solve the following issues: #7289 EDIT: I think we'll be targeting 8.16 for this one. |
JasonStoltz
modified the milestones:
FY 2025 - Q1 (May thru July),
FY 2024 - Q4 (Feb thru Apr),
FY 2025 - Q2 (August thru October)
Hey @JasonStoltz, is a target of 8.16 still the goal for this issue? |
The existing EuiComboBox has a few a11y shortcomings and differs in implementation from EuiSelectable which has been crowned as the future implementation of dropdown-like things. To consolidate implementations of similar components, fix the a11y problems, and unify the UX, EuiComboBox should be rewritten using EuiSelectable.
On top of EuiSelectable, EuiComboBox largely provides:
Picture example
(should be 4.5:1)Which currently has a minor a11y issue associated with it (Remove EuiComboBox down arrow button from tab order #5024)
Popup indicator should be excluded from focus order (Under "Keyboard Interaction" for Combobox)I think the EUI team prefers to keep the EuiComoboBox component and to wrap EuiSelectable within it but another implementation option is to add a "renderAs" prop (or something along those lines) to EuiSelectable to adjust styling.
This replaces Kibana issues #42988 and #39357
The text was updated successfully, but these errors were encountered: