Page Automatically Scrolling After Refresh or When Adding Components

Hi everyone,

I’m running into a strange behavior in Retool. Whenever some data on the page refreshes, or I add/edit a component in the editor, the page automatically scrolls up or down without any user interaction.

This happens on edit mode and also in the live version of the app. Several people on my team have reported the same issue, so it’s not limited to just my account or browser.

Has anyone experienced this or knows what might be causing this automatic scrolling?

1 Like

Hey @Bruna_Tourinho, thanks so much for reporting this, I have a few quick questions to help with the investigation:

  1. Are you on Retool Cloud or self hosted? If self hosted, which version are you running?
  2. About when did you first notice this behavior? Did it start after a specific update or change?
  3. Are there any particular components that seem to trigger the scrolling more often than others?
  4. When you have a chance, could you please share a screen recording of the behavior?

Thank you so much, this will really help us narrow things down! :+1:t3:

Hey happy new year @Bruna_Tourinho :star_struck: Just checking in to see how you’re doing. Were you able to take a look at my response above? Let me know if you need more help!

This is also happening to my project.

  1. Cloud

  2. Noticed it this week while devving in a project I haven’t touched in a while

  3. I’m having an issue with a drawer, when it shows, its scrolled all the way to the bottom. Then when I close the drawer, it scrolls the parent page up to the same spot on the page each time.

    Chrome, incognito window at the moment while using a spare user account that i use to see what clients see. I cannot reproduce the issue using the preview function from my main admin account.

Can’t get you a recording due to private data issue, but will provide anything else I notice. And I’d be curious when/if anybody isolates the issue.

After much trial and error attempting to reduce the issue:

Things I noticed and tried

  • I noticed issue was not affecting my other drawer on the same app page
  • Other possibly similar issues suggested I try adjusting fixed vs auto. I did not get any improvements by adjusting “fixed” vs “auto” height on any components or the many containers present
  • Tried different combinations of containers and sub-elements such as titles “fixed” vs “auto”
  • I have other drawers in other apps that dynamically load data based on queries, that can have a wide variety of auto sizes after loading and they appear to be unaffected

What appears to have worked

  • At the last hour I removed a table that was in the drawer, and that appears to have removed the issue
  • This issue is also happening on the page itself, where there is a table.
  • This was the only drawer that had a table, which could explain why no other drawers were affected, but the issue where when I close the drawer and the page scrolls to the top of one of the tables I will need to see if its the same issue

Further verification is needed, but because I may not get back to this project for a couple of weeks I wanted to provide this update in case helpful to others that may have the issue. I realize video would be better to help here but I was unable to get a sanitized capture…

Hello there @jfd welcome back to the Community, it's been awhile! :smiling_face_with_sunglasses:
I wasn’t able to reproduce this bug on my end. Could you share a JSON export of your app so I can take a closer look?
If you’d feel more comfortable, you can also DM me the JSON export or a quick screen recording showing the behavior, either works! Or even better, if you could send me both, that would be super helpful thank you :pray:

Hey there @jfd, how is it going? Do you still need help?