artifacts on terminal resize

[dh185221]

Hi, thanks for the great library!

I've noticed that when using flex columns if I resize my terminal then some table artifacts appear on the screen. Any idea on how to clear this out when the terminal window resizes?

After a screen resize:

[Evertras]

Hello! Sorry about a very slow response, I missed the notification for this.

This is caused because of the ordering of events/draws. The screen is resized, and the view is redrawn -- but the view is being redrawn before the screen resize event is received/processed. I don't know if this is deeper in Bubble Tea itself or if it's something in your code, but I've had troubles with screen resizes as well. The easiest fix is to use the 'full screen' mode with the alternate buffer as in this example: https://github.com/charmbracelet/bubbletea/blob/master/examples/fullscreen/main.go#L19

I'm not sure if there's a deeper fix that can be done on the Bubble Table side.

[Evertras]

Potentially related: https://github.com/charmbracelet/bubbletea/issues/377

[dh185221]

Hi, thanks for the response. Could this also be related to flex columns? When I run the bubble-table flex example I can see the screen artifacts even when using teat.WithAltScreen()

[Evertras]

Odd... I can definitely reproduce the artifacts when I run it without the alt screen, but I cannot reproduce with the alt screen. 🤔

I can reproduce the artifacts generally if I do this:

func (m Model) View() string {
   return "Helloooooooooooooooooooooooooooooooooooooooooooooooooooooooo"
}

Then resizing the window until the width is smaller than the text creates artifacts the same as the table. So unfortunately I'm not sure if this is something that the table itself can fix.

[PrimalPimmy]

Hmmm it still seems like an issue

I'll try to look into this if I get the time

[PrimalPimmy]

https://github.com/Evertras/bubble-table/blob/7701b149a29bd6df06cb70c63bb0db1cd5f192b5/examples/flex/main.go#L93-L95

Maybe if we could have a rigid height of the table as well like how width is done there? Something that is comparable to msg.Height of bubbletea I suppose

[Evertras]

It's less about the height of the table in this case, and more about how Bubble Tea itself renders text wrapping and leaves behind artifacts when it tries to redraw outside of the alt screen. Having a target height of the table would still leave the artifacts, since nothing about the actual text rendering would be changing.

After checking the link above it looks like this was actually fixed on their end: https://github.com/charmbracelet/bubbletea/issues/297 + https://github.com/charmbracelet/bubbletea/pull/533

So maybe there's some updates that need to happen here to incorporate the change. I'll have to play a bit when I get some time.

[PrimalPimmy]

I seem to have the workaround by making a lipgloss style like lipgloss.NewStyle().Height(m.height).MaxHeight(m.height) and then rendering the table and now it doesn't seem to break for me :D