Skip to content

Issue with focus / click on component #783

Closed
@PhiLhoSoft

Description

@PhiLhoSoft

I am aware of the Call for Maintainers, let say I create the issue for the record, for tracking purpose.
I hope I can submit a PR, or perhaps somebody else can take a look (if I fail or it I take too much time...).

I can reproduce the error in the demo page, on the Country Selector example: single selection, not editable.

If I click on the blank area, the drop down appears as expected.
If I click again, it disappears and the control is focused to input a search string.
So far, it works as expected...

First issue: if I click on the placeholder, ie. on the underlying text input control, the drop down doesn't appear. Looks like the control eats the event which doesn't bubble up. Not sure if that's easy to fix, but it is annoying.
Of course, if you click on the blank area, the drop down appears.

The problem is worse if we set the openOnFocus parameter to false. In this case, I have to click twice in the blank area to get the drop down (once to set the focus, another to get the drop down), and it is even more confusing if I clicked on the placeholder (see above...).
I do that because the the combo is the first control of a form in a dialog box and I don't want the drop down to hide other components. Others (see #730) might want to use it to avoid tabbing twice to exit the component while navigating with the keyboard.

I think the parameter should distinguish getting focus with the keyboard (or with autofocus / tab order) from getting focus from a click.
Or, just always show the drop down when we click on the component, whatever the value of this parameter. It isn't made for this case.

Side note: I had a quick look at the tests of the projects, as I don't plan to give an untested PR!
I see they simulate a click on the component, but I am not sure if it can distinguish click on the blank area vs. click on the placeholder... 😄 Will take a look at the doc of the library.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions