Ionic-framework: bug: Placeholder hidden within autoGrow textarea

[rich186]

Bug Report

Ionic version:


4.4.2

Current behavior:
Placeholders on <ion-textarea> elements with autoGrow set to true get clipped when pristine. Once dirty the placeholder will be fully visible.

Expected behavior:
Placeholders within autoGrow textareas should be fully visible.

[liamdebeasi]

Hi there,

Thanks for the issue! Are you able to create a code reproduction of this? I am not seeing this behavior on my end when testing with the latest version of Ionic.

Thanks!

[JamieWritesCode]

Hi @liamdebeasi I have also noticed this behaviour, specifically when loading an ion-textarea inside a modal. See this pen:

https://codepen.io/JamieWritesCode/pen/ZdYKNr

Is there a way to trigger the runAutoGrow() method manually, as a temporary workaround?

[liamdebeasi]

Hi everyone,

I am able to reproduce this issue. We will look into it.

In the meantime, you can set autoGrow="false" and run the auto grow code manually from your app: https://github.com/ionic-team/ionic/blob/master/core/src/components/textarea/textarea.tsx#L197

You will need to have access to the native input (the textarea element).

Thanks!

[anagstef]

Hello everyone! I also experience this issue. Is this getting any priority for a fix?

[brandyscarney]

Hello, does anyone have a reproducible project for this with latest? I was able to reproduce it using the Codepen in comment https://github.com/ionic-team/ionic-framework/issues/18367#issuecomment-501103196, but since it uses old syntax and points to @ionic/core@latest I had to set it to an old version, so I set it to 4.5.0 which allowed me to reproduce.

Then, I took the code and added it with the latest syntax here: https://codepen.io/brandyscarney/pen/LYNbRbO?editors=1011 and I no longer see the bug. If this is still a problem in latest please let us know how we can reproduce, thanks!

[ionitron-bot[bot]]

Thanks for the issue! This issue has been labeled as needs reproduction. This label is added to issues that need a code reproduction.

Please provide a reproduction with the minimum amount of code required to reproduce the issue. Without a reliable code reproduction, it is unlikely we will be able to resolve the issue, leading to it being closed.

For a guide on how to create a good reproduction, see our Contributing Guide.

[liamdebeasi]

Thanks for the issue! This issue is being closed due to the lack of a code reproduction. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.

Thank you for using Ionic!