Skip to content

Conversation

@joenunezb
Copy link
Contributor

@joenunezb joenunezb commented Oct 21, 2024

Addresses a bug causing inconsistent resizing of the send message textarea when the window width is small, and preventing it from returning to its minimum height after sending a message.

Problem:

The original textarea resizing logic relied on scrollHeight to determine the necessary height. However, this approach failed to account for how changes in window width affected the text wrapping and subsequent scrollHeight calculation. After sending a message and clearing the textarea's content, the scrollHeight often retained a value larger than the actual minimum height, preventing the textarea from shrinking as expected. This was particularly noticeable at smaller widths where text wrapping significantly impacts scrollHeight.

Solution:

This PR resolves the issue by explicitly resetting the textarea height to 1px before recalculating scrollHeight. This ensures that the browser computes the height based on the currently visible text as not doing so could lead to potentially caching stale scrolHeight after content cleared. The new calculation, using only sendTextArea.scrollHeight, is simpler and more accurate.

This change provides more reliable and consistent resizing behavior, ensuring the textarea shrinks correctly to its minimum height after sending a message, regardless of window width changes or previous text wrapping states.

Tests:

Before:

Excuse the potato quality as I can't upload more than 10MB. Just notice the size of the text area, here's a picture to show the px height:
image

textarea_width_bug_480p.mp4

After:

Chrome:

textarea_width_fix.mp4

Firefox:

textarea_width_fix_firefox.mp4

Checklist:

@joenunezb joenunezb requested a review from Cohee1207 November 18, 2024 02:39
Copy link
Member

@Cohee1207 Cohee1207 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good, thanks. Tested in Chrome and FF, including narrowed views.

@Cohee1207 Cohee1207 merged commit 7aad053 into SillyTavern:staging Nov 18, 2024
@Wolfsblvt Wolfsblvt added 🦋 Bug Fix [PR] Code includes bug fixes 🌟 UX [ISSUE][PR] Directly relates to User Experience 🟩 ⬤○○○○ [PR][🎯Auto-applied] [XS] <20 lines changed labels Mar 22, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

🦋 Bug Fix [PR] Code includes bug fixes 🌟 UX [ISSUE][PR] Directly relates to User Experience 🟩 ⬤○○○○ [PR][🎯Auto-applied] [XS] <20 lines changed

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants