Post textbox is not limited in height

[renchap]

Steps to reproduce the problem

Write a large status on mastodon.social, with many new lines.

Expected behaviour

The text input does not grow infinitely

Actual behaviour

The text input height can be larger than the available space

Detailed description

Specifications

Mastodon edge, Safari macOS

[ManVTish]

Hi @renchap , not sure why it happened for you, it's definitely not reproducible on my end. I'm using mastodon.social on edge browser. The box became scrollable after certain threshold rather than growing infinitely.

[65dBnoise]

Same problem here. on Firefox 112.0.2. Apparently the problem is caused by the having its height variable (set by javascript?) depending on text content instead of the size of screen or something (height: 438px !important;). Disabling this CSS rule for the text area cures the problem, but leaves a rather short text box.</p> <p>Also problematic is hiding the Y scrollbar, (overflow-y). See images:</p> <p><img src="https://user-images.githubusercontent.com/105503824/235982880-5929dc0a-c5bf-439b-acb8-25691bf4db66.jpg" alt="Screenshot_20230503_193400" /></p> <p>Debugger screenshot:</p> <p><img src="https://user-images.githubusercontent.com/105503824/235982925-78390ad9-4ea9-451c-9ac8-63f1c3fc021c.jpg" alt="Screenshot_20230503_193443" /></p> </div> </div> <div class="comment"> <div class="user"> <a rel="noreferrer nofollow" target="_blank" href="https://github.com/supernovae"><img src="https://avatars.githubusercontent.com/u/1461719?v=4" />supernovae</a> commented <strong> 1 year ago</strong> </div> <div class="markdown-body"> <p>Replicated on universeodon.com and mastodon.social - the scroll bar doesn't appear and box expands into infinity if you just keep hitting enter</p> </div> </div> <div class="comment"> <div class="user"> <a rel="noreferrer nofollow" target="_blank" href="https://github.com/65dBnoise"><img src="https://avatars.githubusercontent.com/u/105503824?v=4" />65dBnoise</a> commented <strong> 1 year ago</strong> </div> <div class="markdown-body"> <p>This is an serious bug. I'm unable to post anything lengthier than a few lines in the textarea. Uploading an image makes things worse. A workaround for me is to inject this CSS into the page: </p> <pre><code>.compose-form__autosuggest-wrapper { height: 360px; }</code></pre> <p>using Greasemonkey.</p> </div> </div> <div class="comment"> <div class="user"> <a rel="noreferrer nofollow" target="_blank" href="https://github.com/zuck3r"><img src="https://avatars.githubusercontent.com/u/30688090?v=4" />zuck3r</a> commented <strong> 1 year ago</strong> </div> <div class="markdown-body"> <p>When I'm NOT using "Erweitertes Webinterface verwenden" with mastodon.social the textarea-field is not scrolling any more, so I can not send or update status of a longer toot.</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>