Textarea: AutoResize not working if the value is changed while textarea is not visible

[jozefnad]

Describe the bug

Autoresizing of the TextArea does not function correctly under two specific conditions:

When the TextArea is displayed after its value has been assigned, the autoresize feature fails to work as expected.

If the TextArea is located outside the viewport and its content is programmatically changed, the resizing behavior does not function correctly.

To illustrate this issue, consider the following example:

https://stackblitz.com/edit/gvf5ux?file=src%2FApp.vue

<template>
  <div class="card flex justify-content-center">
    <span v-show="show === true" class="w-20rem">
      <Textarea id="xxx" v-model="text" autoResize rows="1" class="w-full" />
    </span>
  </div>
</template>

<script setup>
import { ref, onMounted } from 'vue';

const show = ref(false);

const text = ref(`fsdfsdfsd dsfsdgsdd 
  gsdfsdg  sdgsdgsdgsd  
  sgdsdfgsdg sdgsdgsd 
  sdgsdfgs gsdgsdg 
  sdgsdgsdgsd gsdsdgsdg`);

setTimeout(() => {
  show.value = true;
}, 10);
</script>

Reproducer

https://stackblitz.com/edit/gvf5ux?file=src%2FApp.vue

PrimeVue version

3.34.1

Vue version

3.x

Language

TypeScript

Build / Runtime

Vue CLI App

Browser(s)

No response

Steps to reproduce the behavior

1. assign text value to textarea, which is hidden
2. make textarea visible

Expected behavior

I expect the autoresize functionality of the textarea to work correctly as soon as it is displayed or changed.