The size of a textarea is reset on every update in a live component

[FrancoisPog]

When a text area is used in a live form, its size is reset every time the model is updated, whether its value changes or not.

Exemple

Original field:

<textarea id="profile_edition_form_shortBiography"
    name="profile_edition_form[shortBiography]" 
    required="required" 
    placeholder="profile.form.shortBiography.placeholder" 
    aria-describedby="profile_edition_form_shortBiography_help">
</textarea>

Resized:

<textarea id="profile_edition_form_shortBiography" 
    name="profile_edition_form[shortBiography]" 
    required="required" 
    placeholder="profile.form.shortBiography.placeholder"
    aria-describedby="profile_edition_form_shortBiography_help" 
    style="width: 339px; height: 104px;">
</textarea>

[weaverryan]

I understand better now - I hadn't ever realized that when you resize a textbox, your browser adds the style tag with width and height automatically.

The simplest way to fix this would be to, during "re-render", add special logic to "keep" the width/height styles on an element. That would, however, open an edge bug where if your component actually rendered these attributes in Twig (e.g. style="width: {{ width} }}px") and that changed on re-render, that new width would be ignored. Though, this edge case could likely be closed by overriding width/height IF those are present in the re-rendered HTML.

So the logical tree would be for this to happen on re-render:

A) If NO width/height style is found on the NEW (from the Ajax call) HTML, then keep the width/height from the current HTML B) IF width/height style IS found on the NEW (from the Ajax call) HTML, then use that new width/height.

And I think (?) this only applies to textarea elements?

If I'm correct that this would solve the issue, then it shouldn't be too hard. We would add code to onBeforeElUpdated. If we find this situation, then we would "copy" the width/height from the current element (fromEl) onto toEl. This may seem backwards, but what we're doing here is making the toEl look how we want so that when morphdom transforms (right after this function) fromEl to look like toEl, toEl already has the style attributes we want.

[carsonbot]

Thank you for this issue. There has not been a lot of activity here for a while. Has this been resolved?

[carsonbot]

Friendly reminder that this issue exists. If I don't hear anything I'll close this.

[carsonbot]

Hey,

I didn't hear anything so I'm going to close it. Feel free to comment if this is still relevant, I can always reopen!