search

vaadin / web-components

A set of high-quality standards based web components for enterprise web applications. Part of Vaadin 20+
https://vaadin.com/docs/latest/components
474 stars 83 forks source link

vaadin-select in v14 has unexpected behavior when using material theme #2089

Open epricer opened 3 years ago

epricer commented 3 years ago

(Note that this is not a problem in v20 or v19) When a vaadin-select component with no value selected is rendered, the label immediately floats (animation is present). This results in an inconsistent user experience and is a distraction.

This is caused by styling associated to the "has-value" attribute on the :host (vaadin-select-text-field) of the label. That element is getting the attribute applied immediately, regardless of whether there is a value in the field. This attribute is not applied in v20 or v19 - I have not checked other versions.

image

web-padawan commented 3 years ago

As this problem happens in V14, added a corresponding label. Here is the code which looks relevant.