How can I disable scrolling by touch on xterm.js?
I have a touchmove event on term.element that simulates cursor keys by swiping the appropriate direction. This works great in applications such as Midnight Commander that use the "alternate screen buffer", but in the default screen buffer that has scrollback (i.e. lynx or bash, for example), it scrolls the terminal (as it normally would) in addition to sending the ansi codes for the arrow keys.
I need to override this behaviour so scrolling does not happen when you swipe, without preventing scrolling by other means such as the mouse-wheel or the scrollbar, or interfering with other mouse events (and possibly touch events).
Tried preventDefault() on the event, even tried attaching it to various elements within the terminal, parentNode, and its parentNode. Same behaviour. Also tried position: absolute with bottom: 0px, but the way xterm.js simulates a terminal makes for abberant results.
Any ideas?
Ok. The solution is: add event.stopPropagation() at the top of the handler for the touchmove event. Attach it to the terminal element (i.e. term.element). Forget the overlay, pointer-events: none, etc. Works perfect. No additional garbage. I left in event.preventDefault() for another reason, but I think just the stopPropagation stands alone for this particular question.
I would like to add, if you just want to disable touch scrolling on the terminal all you need is:
term.addEventListener('touchmove',function(e){e.stopPropagation()});
Assuming your terminal object's name is 'term'.