onehilltech / ember-cli-mdc

ember-cli addon for material-components-web
Apache License 2.0
44 stars 15 forks source link

mdc-textfield label overlaps dynamic text #6

Closed jamesstaub closed 5 years ago

jamesstaub commented 5 years ago

It appears that mdc-floating-label's .float method gets called when the textfield is focused, but not when content is dynamically added to the rendered component.

textfield-bug

Perhaps the textarea could re-render the mdc-floating-label when it's value changes from undefined to defined?

hilljh82 commented 5 years ago

@jamesstaub Although this is a bug, I'm just curious about the use case for this functionality. Why would only edit field be used to updated the values of another text field, unless the one being updated is readonly/disabled? Just my curiosity.

jamesstaub commented 5 years ago

I should have mentioned that the actual use case is an async model loading after the component has been rendered. The second input is just an easy way to demonstrate the behavior.

Another quick way to simulate the behavior is to set the value of the textfield to a model property, then use the ember inspector to manually update the model property after the component is rendered on the page.

hilljh82 commented 5 years ago

@jamesstaub I have created a fix for this bug. The bug was also present in mdc-textarea. I created a fix for that one as well. I also added an optimization to only apply the fix when the input or textarea is not in focus. When the input or textarea are in focus, then the textfield component behaves as expected.

v. 0.74.15 has the fix.

jamesstaub commented 5 years ago

Amazing, thank you very much