i render few items in overflow-y-scroll, when i do render typing indicator component it goes under the view, there is no auto scroll to bottom view(as intenteed). But when i scroll to bottom by myself and then unmount it and mount it 1 more time, it doesnt go under the view, its sticky at the bottom of overflow-y and its pushing the rest of content to top. I dont want this behavior, i want to scroll it to view by myself.

Also, i dont see this behavior on mobile safari and desktop firefox, it works as i want. I only see this bahavior on opera/chrome.

When scrollbar gets sticky and i scroll to top and again to bottom, he’s unlocked.

<div
    className={'flex-1 greyScrollBar flex flex-col relative'}
    ref={scrollRef}
>
    <div className={'flex-1 flex flex-col'}>
        {messages?.map((message, index) => {
            return (
              <TextBox
                key={message.id}
                 message={message}
              />
             )
           })}
           {isStrangerTyping && (
               <TypingIndicator
                  isStrangerTyping={isStrangerTyping}
                />
           )}
    </div>
</div>

I tried to unmouth/hide this component in css. As i said, its only chromium browser behavior. It looks like it “remembers” it was mounted and tries to keep previos height position?