[combo-box] Clicking inside the bounding-box but outside of the actual combobox triggers the dropdown

[ankon]

Description

When clicking onto the adjacent label or the area next to it the combobox still triggers the dropdown.
When hovering over the adjacent label or the area next to it the combobox still gets hover effects.

Expected outcome

I would expect that the dropdown is only triggered when the user clicks on the actual input. Similarly the hover effects should only trigger when one actually hovers over the input.

Actual outcome

When clicking onto the adjacent label or the area next to it the combobox still triggers the dropdown.
When hovering over the adjacent label or the area next to it the combobox still gets hover effects.

Live Demo

https://friendly-glasses.glitch.me/ (standard demo with a label and a border to show the area)

Steps to reproduce

1. Put a vaadin-combo-box element in the page.
2. Open the page in a web browser.
3. Hover over and click the area outside of the input of vaadin-combo-box element.

Browsers Affected

• Chrome
• Firefox
• Safari
• Edge
• IE 11
• iOS Safari
• Android Chrome
  (didn't test the other ones)

[Haprog]

I see your point, but I think it probably works as intended so far. We could discuss if we want to change that behaviour.

I do think it's slightly weird as it is now. I might personally prefer if by clicking the label it would only focus the text field of the combo box (in the same way as if you keyboard navigate to it via tab) and so that the hover styles for combo box would only show when hovering over the text field (not label or surrounding area).

@jouni What do you think about this? Is it working as intended atm. and/or would we want to change it?

[jouni]

I have considered the hover styles in the past as well, that it would be nicer to show those only when hovering over the input field.

Though, the label has its own hover style as well, so that should then probably only be applied when hovering over the label.

Not sure about changing the dropdown behavior. I think it might be confusing if it behaves differently depending on if you click the label of the field itself. But I think it would be a good experiment to try, see how it feels.

I might even go as far as only opening the dropdown when typing in the field or clicking the toggle button explicitly (more traditional combo box behavior).

[web-padawan]

This should be covered by #3402 where the logic was changed to only open dropdown on clicking label or input field, but not helper text / error message. Closing.