search

stuyam / pressure

:point_down::boom: JavaScript library for handling Force Touch, 3D Touch, and Pointer Pressure.
https://pressurejs.com
MIT License
2.92k stars 97 forks source link

Error on handling multi touch events #59

Closed Legohuman closed 7 years ago

Legohuman commented 7 years ago

I have the following error when I try to zoom with pinch, swipe or make any other multi touch event on element that Pressure is applied to.

TypeError: undefined is not an object (evaluating 'this.selectTouch(e).force')

in line this._changePress(this.selectTouch(e).force, e))

It`s probably in pressure/dist/pressure.js:316 or pressure/src/adapters/adapter_3d_touch.js:25

The code that uses Pressure

Pressure.set(self.slotsContainer, { //DOM node startDeepPress: function (event) { //handle event } });

Device is a 2016 IPhone 6S Plus MN2W2RU/A Operating system is iOS 10.2.1 Browser is Safari 10.0

Legohuman commented 7 years ago

The root of issue is likely in the line if (event.touches[i].target === this.el) // /pressure/dist/pressure.js:377

In my issue target of touch event is child element of slotsContainer

stuyam commented 7 years ago

Hmm, looks like I should be checking for that and return or something if there is no touches object on an event. Will look into it and get back to you. Thank you for reporting this 😄

stuyam commented 7 years ago

@Legohuman do you have more information on this bug? Do you have a codepen or something that could be tested?

I have tried a few scenarios and have not been able to reproduce the error that you were encountering.

Legohuman commented 7 years ago

Here you are. https://jsfiddle.net/05t7f6ja/2/ Scenario is simple. Just pinch over the slots to zoom in or zoom out.

stuyam commented 7 years ago

Awesome @Legohuman thank you for the example. Update to the most recent v2.1.0, it is fixed in that version. No more errors.

https://jsfiddle.net/yamartino/05t7f6ja/3/

However when you try to do multitouch with child elements like that it also doesn't give a pressure reading because the element you are clicking isn't the element it is attached to. But because of bubbling it does trigger pressure to run but fails to select the correct element. My hunch is that for that to work with child elements like that while doing multitouch pressure would have to traverse the elements child elements to see if any of those match.

Legohuman commented 7 years ago

Thank you! Now it works nice, so I`m closing the issue.