Table component auto-size bouncing/flickering

I currently have an issue where every now and then a table in my app will expand and contract by a few pixels (~20-50px) at the bottom of the table. It looks like it's trying to load another row at the bottom and then realizes there's no row to load and contracts again. This will happen quickly so it looks like it's flickering/wobbling.

This happens most frequently when I have a table that has auto height (instead of fixed) and the table is in a container or modal popup.

The problem is intermittent so it's hard to provide an example to work from but it does happen in multiple apps and for multiple users, so it's not a me or an app issue.

Is anyone else having the same issue?

1 Like

@jleem if this behavior is still showing for you, would you be able to capture a gif to share here so we can see what you're seeing? I know you mentioned it's intermittent so could be hard to grab.

Would also be interested to hear from anyone else who's seeing this so we can gather more details and reproduce it, bringing this to a more actionable state. Thanks so much for letting us know about it!

@kbn Just found it. It seems to be an issue with the auto-sizing when one of the column types is set to 'Image'. This combination seems to be problematic:

column settings -> appearance -> width = fill
table settings -> appearance -> row height = dynamic

Changing to any other combination stops the issue.

Screen Recording 2024-03-01 at 10.27.34 AM

Hi @jleem, thank you for uploading the gif and sharing the table/column configurations. I was able to reproduce it. We made a bug report for it, we'll keep you posted with any news from our devs. :slightly_smiling_face:

+1 I am facing a similar issue while I expand the row. please suggest some solution to this
retool-flickering-issue

Hi @Makarand, thank you for the gif and welcome to the forum! :wave:
I added your experience to the bug report and included the screen recording.

+1 here. Changing the number of columns or setting automatic column width did not help.

Hi @Milan_Kalem, I added your +1! :slightly_smiling_face:
Could you share your current settings? :face_with_monocle:

Sure @Paulo
Height - Auto
Row height - Medium
Automatic column width enabled

thank you!

I don't see the UI bug on the newest cloud version 3.40.0.
Are we still having this issue? :eyes:

I'm experiencing this flickering as well. I've seen it both in modals and in tables. Here is a recording of my table flickering after adding a row: table-flickering-after-adding-row.webm

My table in the video has the following settings:

  • Height: auto
  • Row Height: dynamic

@sgodoshian, thank you for the video!
Is this only happening to you when you add a new row to the table? Our devs are tracking all cases for when this happens.

@Paulo I've also experienced it when I select the table component and when I select components inside a modal (for example selecting a form in a modal body). I'll try to get more videos as it comes up. I see it in both app edit mode and app view/preview mode.

Thank you! All feedback is appreciated. :slightly_smiling_face:

1 Like

@Paulo here is a video example of the form component flickering in a modal body when the modal is set to "expand content to fit". flickering-form-in-modal-body-with-modal-expand-content-to-fit.webm
if you watch the whole video you'll see when I check/uncheck the flicker starts/stops, so it seems to be related to "expand content to fit" at least for the modal.

Thank you all for looking into this! :crossed_fingers:

1 Like

I experience this when using tables in modals in full screen with expanded content to fit width. Occurs regardless of number of columns, rows or data types (based on some testing).

Edit: I've noticed this happens specifically when I select the table component. If I cmd + click to unselect the component, the wiggling ceases.

Edit: Above is not consistent... wiggling seems increasingly random.

1 Like

i'm also able to unfortunately reproduce this and the client isn't thrilled with the near stroke it gave them. LOL

anyway, mine is happening with a table inside another table. it's the child table(s) that start dancing. mine is now doing that if the table is on fixed as well as always when it's set to auto. i can share a video if you'd like

1 Like

please share the video, I'm happy to add it to the report. :memo:

okay, i'll do that later tonight. i can tell my gummy just kicked in because i found an idea that might be a hack - if i load the child table as auto, then change it to fixed (manually, with my mouse), the result seems to be what i want (auto) without the dance. i'm unsure if that's do-able with a simple script, but i'll give it a shot