Skip to content

Form.Control autoResize not triggered on controlled value change #4319

Description

@samuelallan72

When using a Form.Control element as a textarea with autoResize, it does not auto resize when the controlled value is changed.

To reproduce:

  • Create a Form.Control element like:
<Form.Control
  rows={1}
  as="textarea"
  autoResize
  value={value}
  onChange={onChange}
/>
  • manually enter 3 lines of text, so the text area auto resizes to fit the 3 lines
  • trigger something that sets the controlled value to an empty string
  • note that the textarea remains at 3 lines high
  • manually type in the textarea again
  • note that the textarea immediately auto-resizes to the new content

Expected behaviour is for the autoResize to trigger when the controlled value changes as well.

A possible fix could be to add props.value to the dependencies of this effect?

useEffect(() => {
handleResize();
}, [handleResize]);

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions