'Tizen Wearable Web App: Rotary event cancelling touch events?

I'm developing for a gear s2, and I have an app where I would like the user to be able to hold their finger on the screen while also rotating the bezel (concurrent rotary + touch events); however it appears that the rotary event handler overrides the touch event handler and triggers the endTouchHandler.

Rotary event handler added as follows:

var rotaryEventHandler = function(e)
{
   if (e.detail.direction === "CW")
   {
       console.log("Rotate CW");
   }
   else if (e.detail.direction === "CCW") 
   {
       console.log("Rotate CCW");
   }
}

document.addEventListener("rotarydetent", rotaryEventHandler,false);

Touch event handlers added as follows (code for handling touches is pretty much the same as examples online):

page.addEventListener('touchstart', multiTouchHandler, false);
page.addEventListener('touchmove', moveTouchHandler, false);
page.addEventListener('touchcancel', cancelTouchHandler, false)
page.addEventListener('touchend', endTouchHandler, false);

Looking into some log outputs, the rotary event doesn't cancel the touch event, it triggers the endTouchHandler.

No ideas on workarounds despite a bunch of tinkering... any suggestions appreciated.



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source