Skip to content

fix(text area): fix initial flicker in rendering#5842

Merged
willmcgugan merged 3 commits into
Textualize:mainfrom
TomJGooding:fix-text-area-fix-initial-flicker
Jun 7, 2025
Merged

fix(text area): fix initial flicker in rendering#5842
willmcgugan merged 3 commits into
Textualize:mainfrom
TomJGooding:fix-text-area-fix-initial-flicker

Conversation

@TomJGooding

@TomJGooding TomJGooding commented Jun 4, 2025

Copy link
Copy Markdown
Contributor

Fix initial flicker in the TextArea, where for a brief moment each character is rendered on a new line before the size is settled.

The width for the WrappedDocument is slightly confusing where zero means no wrapping, but the current negative wrap width looks like the bug.

Fixes #5841

Please review the following checklist.

  • Docstrings on all new or modified functions / classes
  • Updated documentation
  • Updated CHANGELOG.md (where appropriate)

Fix initial flicker in the `TextArea`, where for a brief moment each
character is rendered on a new line before the size is settled.

The width for the `WrappedDocument` is _slightly_ confusing where zero
means no wrapping, but the current negative wrap width looks like the
bug.

Fixes #5841
@TomJGooding

Copy link
Copy Markdown
Contributor Author

I've tested manually obviously with the examples in the linked issue, but I'm not sure it's possible to add a regression test for this flicker.

@lyovushka

Copy link
Copy Markdown
Contributor

I think there is still a flickering even when soft_wrap=False.

@TomJGooding

TomJGooding commented Jun 5, 2025

Copy link
Copy Markdown
Contributor Author

I think there is still a flickering even when soft_wrap=False.

Strange, I don't see the same flicker with this change. Do you mean a different kind of flicker, or do you have an example to demonstrate?

Running your example with some debug logs, here's extracts from the console before and after this change.

Before

[15:02:19] DEBUG                                              screen.py:1027
Button() was focused
────────────────────────────────────────────────────────────────────────────
[15:02:20] DEBUG                                          _text_area.py:1309
render_line(0): L                                                           
[15:02:20] DEBUG                                          _text_area.py:1309
render_line(1): o                                                           
[15:02:20] DEBUG                                          _text_area.py:1309
render_line(2): r                                                           

...

[15:02:20] DEBUG                                          _text_area.py:1309
render_line(27): m                                                          
[15:02:20] DEBUG                                          _text_area.py:1309
render_line(28): e                                                          
[15:02:20] DEBUG                                          _text_area.py:1309
render_line(29): t                                                          
[15:02:20] DEBUG                                          _text_area.py:1309
render_line(0): Lorem ipsum dolor sit amet                                  
────────────────────────────────────────────────────────────────────────────

After

[15:12:00] DEBUG                                              screen.py:1027
Button() was focused
────────────────────────────────────────────────────────────────────────────
[15:12:02] DEBUG                                          _text_area.py:1309
render_line(0): Lorem ipsum dolor sit amet                                  
────────────────────────────────────────────────────────────────────────────

@lyovushka

Copy link
Copy Markdown
Contributor

No the letters don't appear to be rendered individually with soft_wrap=False. But there is still a flicker. I've attached a screencast (this is without soft_wrap). The TextArea initially has a larger height before snapping to a single line. It also makes the vertical scroll visible momentarily.

Screencast.From.2025-06-05.15-36-55.mp4

@TomJGooding

TomJGooding commented Jun 5, 2025

Copy link
Copy Markdown
Contributor Author

Sorry I think I understand what you mean now - you've not tested with this change but just setting soft_wrap to False?

Good catch - it looks like the wrap_width is being called before this is set!

Ensure `TextArea.__init__()` assigns attributes like
`soft_wrap` *before* calling the `_set_document()` method.

Currently if you create a `TextArea` with `soft_wrap=False`, the
document is first wrapped with the default `soft_wrap=True`, causing an
initial flicker.
@TomJGooding

TomJGooding commented Jun 5, 2025

Copy link
Copy Markdown
Contributor Author

Fixed in 4653f30 by ensuring the attribute is assigned before trying to wrap the document.

Again tested manually but don't think it's possible to add a regression test for this.

@TomJGooding TomJGooding marked this pull request as ready for review June 5, 2025 16:18

@willmcgugan willmcgugan left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

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

LGTM.

@willmcgugan willmcgugan merged commit f704ba9 into Textualize:main Jun 7, 2025
23 checks passed
@TomJGooding TomJGooding deleted the fix-text-area-fix-initial-flicker branch June 7, 2025 16:26
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

TextArea has initial flicker with each character on a new line

3 participants