Join GitHub today
GitHub is home to over 50 million developers working together to host and review code, manage projects, and build software together.
Sign up[Autocomplete] Unclickable area between text input and endAdornment #22166
Comments
|
@FlorisWarmenhoven How do you reproduce the issue? |
|
Sorry for the delay. As you can see in the above GIF, I am clicking from left to right (continuously clicking). There is an area that does not show/hide the popup. |
|
As a workaround, I found that with openOnFocus enabled you will get the behaviour you desire. |
|
@Waynetron Thank you. That's a perfect workaround for my usecase. |
|
@oliviertassinari @FlorisWarmenhoven I have committed the change to fix this issue, I have followed contributing guide but still if you can let me know about the changes(correct or not).after that I will raise the PR |
|
@hkurra sorry for the late response. The proposed change looks good to me, feel free to open a PR if you would like to. |
|
@mnajdova Sure will do asap, I have raised it earlier but it has some problem, related to test case, will look into that and raise the PR again. I have found I need to consider other things like commit message format etc. |
|
shouldn't anywhere on the border, not just the input itself, respond to a click? |
|
@jedwards1211 I'm not sure about the conflict it will create with the other element inside the combo box, like the icons, clear icon or the tags. |
|
@oliviertassinari for sure it would be a bit of a challenge...actually the simplest way would be for the root listener to only activate if the target is the input or one of its ancestors, since that would exclude the icons and tags. It kinda reminds me of an annoying little quirk in the old CircleCI UI, they had an gear icon button for project settings, but for a long time only the icon itself was clickable, not the button :) |
Current Behavior😯
When using the Autocomplete in combination with the TextField, there is a small 'deadzone' where clicking will not trigger the list of options to appear. This deadzone is located between the label text and the end adornment ('arrow down').
Expected Behavior🤔
I expect the user to be able to click anywhere within the border/outline of the textfield to open the list of selectable options.
Steps to Reproduce🕹
Steps:
Context🔦
Users of our application report that sometimes the menu won't show. That's because they're clicking in the deadzone.
Your Environment🌎
Live environment on the MUI Docs page.
Additional
I'm not an expert developer, but perhaps the solution would be as simple as wrapping both the adornment and the text input in a div and putting the onClick handler on there. Then again, I don't know what the component structure looks like so feel free to disregard.