La barra de desplazamiento no realiza un seguimiento cuando se ingresa un párrafo largo. La barra de desplazamiento debe ir hacia abajo y permanecer así mientras el usuario envía mensajes.

Este es el div principal y el div de feed de chat:

 <div className="flex flex-col justify-between h-full" data-cy="chatThread"> <div className="sticky top-0 bg-primaryBg"> <SidePanelHeader onDismiss={handleChatToggle} alignChildren="left"> <button className="flex items-center pl-2" onClick={showActiveChats}> <span className="mr-1"> <Icon svg={LeftArrow} size={10} color="accentText" /> </span> Back to All chats </button> </SidePanelHeader> <ChatGroups chatId={chatId} isMyParty={isMyParty} isTeamMeeting={meeting?.type?.key === 'team-meeting'} chatGroupParties={chatGroupParties} dmParticipant={dmParticipant ? dmParticipant[0] : undefined} /> </div> </div>

 {/* Chat Feed*/} <div className={classNames('flex flex-auto flex-col overflow-y-auto p-3', { 'bg-red-100': !isMyParty && meeting?.type?.key !== 'team-meeting', })} data-cy="chatThread-feed" > {mergedMessagesAndParticipantsInThread().map((chatBubble, index) => ( <ChatBubble participants={allParticipantsFlat} prevBubble={getMessages()[index - 1]} bubble={chatBubble} index={index} key={chatBubble.ts} ref={scrollToRef} /> ))} </div>

Aquí hay una captura de pantalla de la barra de desplazamiento que no rastrea cuando se ingresa un gran bloque de texto.