We previously resolved to focus the currently selected option when the datalist popover dropdown thing is opened, and that works great when invoking the popup with a keyboard but I'm not sure it is the best when clicking the invoker button with a mouse to open it because we don't render a focus ring on the newly focused option because the browser sort of thinks we are in mouse focus mode.
@una gave me feedback that it looked weird when focus is set to an option after clicking the invoker button but there is no focus ring on the newly selected option.
I see a few remedies to this problem:
Make the browser set focus to the newly selected option in a way that emulates keyboard focus which forces it to give a focus ring.
Don't focus the an option when the user clicks the invoker button with a mouse, as opposed to using the keyboard. What should be the active element in this case though...? the button? the body element? the popover element?
Keep it the way it is already if this is the right thing?
We previously resolved to focus the currently selected option when the datalist popover dropdown thing is opened, and that works great when invoking the popup with a keyboard but I'm not sure it is the best when clicking the invoker button with a mouse to open it because we don't render a focus ring on the newly focused option because the browser sort of thinks we are in mouse focus mode.
@una gave me feedback that it looked weird when focus is set to an option after clicking the invoker button but there is no focus ring on the newly selected option.
I see a few remedies to this problem:
Any thoughts? @scottaohara