Open erber014 opened 10 months ago
When using with pInputTextArea and [autoResize]=true in a sidebar with a scrollbar there is an issue where the sidebar will get scrolled when the textarea is interacted with and a user tries to interact with other elements in the sidebar. See reproducer below.</p> <h3>Environment</h3> <p>Using windows 10 and latest version of Firefox.</p> <h3>Reproducer</h3> <p><a rel="noreferrer nofollow" target="_blank" href="https://stackblitz.com/edit/mffv5p?file=src%2Fapp%2Fdemo%2Finput-textarea-auto-resize-demo.html">https://stackblitz.com/edit/mffv5p?file=src%2Fapp%2Fdemo%2Finput-textarea-auto-resize-demo.html</a></p> <h3>Angular version</h3> <p>16.2.0</p> <h3>PrimeNG version</h3> <p>16.5.1</p> <h3>Build / Runtime</h3> <p>Angular CLI App</p> <h3>Language</h3> <p>TypeScript</p> <h3>Node version (for AoT issues node --version)</h3> <p>18.18.0</p> <h3>Browser(s)</h3> <p><em>No response</em></p> <h3>Steps to reproduce the behavior</h3> <p>Go to reproducer stackblitz.</p> <ol> <li>Open sidebar.</li> <li>Put focus on the textarea or button in sidebar.</li> <li>Scroll down and try clicking on the button at the bottom. The button will not be clicked and we will instead scroll up in the sidebar. User will need to scroll down manually and then click the button one more time which is annoying</li> </ol> <h3>Expected behavior</h3> <p>I expect to be able to interact with page elements in sidebar with a textarea even when textarea is focused.</p> </div> </div> <div class="comment"> <div class="user"> <a rel="noreferrer nofollow" target="_blank" href="https://github.com/sandrotonon"><img src="https://avatars.githubusercontent.com/u/3889326?v=4" />sandrotonon</a> commented <strong> 9 months ago</strong> </div> <div class="markdown-body"> <p>Also reproducable with Version 16.6.0.</p> </div> </div> <div class="comment"> <div class="user"> <a rel="noreferrer nofollow" target="_blank" href="https://github.com/stephanebouget"><img src="https://avatars.githubusercontent.com/u/13203455?v=4" />stephanebouget</a> commented <strong> 8 months ago</strong> </div> <div class="markdown-body"> <p>waiting for a fix, this lib do the job : <a href="https://www.npmjs.com/package/ngx-autosize">https://www.npmjs.com/package/ngx-autosize</a></p> </div> </div> <div class="comment"> <div class="user"> <a rel="noreferrer nofollow" target="_blank" href="https://github.com/javierjsp"><img src="https://avatars.githubusercontent.com/u/52291227?v=4" />javierjsp</a> commented <strong> 7 months ago</strong> </div> <div class="markdown-body"> <p>Still Reproducible in Version 16.9.1</p> </div> </div> <div class="comment"> <div class="user"> <a rel="noreferrer nofollow" target="_blank" href="https://github.com/Metal079"><img src="https://avatars.githubusercontent.com/u/7731400?v=4" />Metal079</a> commented <strong> 3 weeks ago</strong> </div> <div class="markdown-body"> <p>This issue seems fixed with the latest version</p> </div> </div> <div class="page-bar-simple"> </div> <div class="footer"> <ul class="body"> <li>© <script> document.write(new Date().getFullYear()) </script> Githubissues.</li> <li>Githubissues is a development platform for aggregating issues.</li> </ul> </div> <script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.min.js"></script> <script src="/githubissues/assets/js.js"></script> <script src="/githubissues/assets/markdown.js"></script> <script src="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.4.0/build/highlight.min.js"></script> <script src="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.4.0/build/languages/go.min.js"></script> <script> hljs.highlightAll(); </script> </body> </html>
Describe the bug
When using