chat-ui-kit-react icon indicating copy to clipboard operation
chat-ui-kit-react copied to clipboard

MessageList scroll doesn't work on mobile

Open Anjum48 opened this issue 1 year ago • 1 comments

I've having trouble with <MessageList> not scrolling on mobile/touch screen. In a browser, with a mobile device selected I can scroll with a mouse wheel, but the click & drag doesn't work.

I've tracked the issue down to touch-action: none in CSS which I can't seem to override, since it is set in an element that is created inside MessageList (scrollbar-container cs-message-list__scroll-wrapper ps).

Searching for touch-action finds this README from 4 years ago which mentions this was added to fix some strange behaviour: https://github.com/chatscope/chat-ui-kit-react/blob/master/src/components/Scroll/README.md

Which I think refers to this: https://github.com/chatscope/chat-ui-kit-react/blob/89f6208011ab0ec304796fb085aa510f850c29e2/src/components/MessageList/MessageList.jsx#L298

Any ideas on how I can set this to auto?

Anjum48 avatar Sep 25 '24 20:09 Anjum48

I'm a bit late, but you can solve it this way: .cs-message-list__scroll-wrapper { touch-action: auto !important; }

sizuf avatar Mar 30 '25 17:03 sizuf