I've got a scrollerWrapper, filled with an aura:iteration of items. I'm using the scrollTo("bottom") function in an afterRender handler so that when the page is new, it appears already scrolled to the bottom. That part works well.

BUT when I add a new item (think adding a new message to the text feed), the scrollTo("bottom") takes me to the OLD bottom. Each time I add a new message, it redefines bottom, but it's always one behind.

I'm thinking that instead of using "bottom", I could give it a specific Y value, but I don't know how to access the height of the contents of the scrollerWrapper. I've tried clientHeight and scrollHeight, with no luck. Not sure what else to try.

Any ideas?

1 Answer 1


The issue is the code executes before the messages are rendered. So, I used an Renderer.js that fires a component event after render of the last message, telling the scrollwrapper component to scrollBottom. Works great.

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .