[SOLVED] Suddenly have an issue with touch events

I’ve been using the same touch input controller for a long time - almost a year, I think. It goes like this:

// add start drag to specific element, and use flags to handle later events
entity.element.on(pc.EVENT_TOUCHSTART, this._startDrag, this);

// add this globally, controlled by touch start flag, also I subscibe to
// other touch events, but does not matter in this concrete case
this.app.touch.on(pc.EVENT_TOUCHMOVE, this._moveDrag, this);

// later

TouchInput.prototype._startDrag = function(e) {
    if (this.dragging) return

    this.anchorTouch = e.touches[0]

    this.dragging = true
    var touch = e.touches[0]
    this.pointer.set(touch.x, touch.y)

TouchInput.prototype._moveDrag = function(e) {
    if (!this.dragging) return;

    var touch = e.touches[0]
    this.pointer.set(touch.x, touch.y)

I’ve been away from my pet project for a week, returned, and encountered 2 issues.

  • I can’t do preventDefault on EVENT_TOUCHSTART any more - there is an error
    Unable to preventDefault inside passive event listener invocation.

  • Event objects in TOUCHSTART and TOUCHMOVE now have different interfaces
    In TOUCHSTART I’m having object ElementTouchEvent:
    which does not have {x,y} in touch object

In TOUCHMOVE I’m having object TouchEvent:
which has {x,y} in touch object, and also a touch object like in TOUCHSTART event

something changed in PC? will future or similar changes/bugs can affect app that’s already released?

something changed in chrome? those events was the same before, I’m sure of it, I use to work with touch events and object interface was like in TOUCHMOVE case.


Hi @nikita_osyak,

That’s quite strange indeed, the team makes sure to not introduce changes that break existing projects.

There was a PR about it but that’s been over a year:

@yaustar do you know anything?

I think the preventDefault part could arise from the fact that I actually have some new event object with TOUCHSTART event, so that could be some another event?

My biggest question is what happend to event objects and why they are different now.

Can you provide a simple repro project that we can see the issue and test against please?

@yaustar sure.


swiping on the image (on mobile) you should see in your log console that the event types coming in handlers are different (though I use TOUCHSTART on element, but other touch events on the app itself, maybe it counts. but it used to be the same)

1 Like

I’ve tried this with an older version of the engine (1.28.0) and it has the same issue. I assume there has been a browser change somewhere


@yaustar agreed, seems like a plausable cause.

To solve the issue, I just changed touch query to clientX\Y instead of just x\y (for TOUCHSTART), works fine.

Good morning @nikita_osyak ,

I just tested the pc.ElementDragHelper on Chrome and Firefox mobile, and it appears to still work. You might want to give it a try in the meantime.

I just put this._handleDragHelper = new pc.ElementDragHelper(this.entity.element); in my initialize function and then use event callbacks for any logic other than the drag.

I hope this is helpful.