GreenPolyProducts/polymer
5
0
Fork 0
mirror of https://github.com/Polymer/polymer.git synced 2025-02-25 18:55:30 -06:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #3407 from Polymer/fix-nested-track-tap

Browse Source 
Disable tap gesture when track gesture is firing for ancestor node
This commit is contained in:
Kevin Schaaf 2016-02-16 14:39:31 -08:00
commit fdd49418c3
3 changed files with 124 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/standard/gestures.html
View File

@ -230,7 +230,8 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
Gestures.handleTouchAction(ev);
}
}
if (type === 'touchend') {
// disable synth mouse events, unless this event is itself simulated
if (type === 'touchend' && !ev.__polymerSimulatedTouch) {
POINTERSTATE.mouse.target = Polymer.dom(ev).rootTarget;
// ignore syntethic mouse events after a touch
ignoreMouse(true);
@ -247,10 +248,8 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
for (var i = 0, r; i < recognizers.length; i++) {
r = recognizers[i];
if (gs[r.name] && !handled[r.name]) {
if (r.flow && r.flow.start.indexOf(ev.type) > -1) {
if (r.reset) {
r.reset();
}
if (r.flow && r.flow.start.indexOf(ev.type) > -1 && r.reset) {
r.reset();
}
}
}
@ -525,6 +524,10 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
if (self.hasMovedEnough(x, y)) {
// first move is 'start', subsequent moves are 'move', mouseup is 'end'
self.info.state = self.info.started ? (e.type === 'mouseup' ? 'end' : 'track') : 'start';
if (self.info.state === 'start') {
// iff tracking, always prevent tap
Gestures.prevent('tap');
}
self.info.addMove({x: x, y: y});
if (!hasLeftMouseButton(e)) {
// always fire "end"
@ -537,7 +540,6 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
};
var upfn = function upfn(e) {
if (self.info.started) {
Gestures.prevent('tap');
movefn(e);
}
@ -561,6 +563,10 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
var ct = e.changedTouches[0];
var x = ct.clientX, y = ct.clientY;
if (this.hasMovedEnough(x, y)) {
if (this.info.state === 'start') {
// iff tracking, always prevent tap
Gestures.prevent('tap');
}
this.info.addMove({x: x, y: y});
this.fire(t, ct);
this.info.state = 'track';
@ -573,8 +579,6 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
var ct = e.changedTouches[0];
// only trackend if track was started and not aborted
if (this.info.started) {
// iff tracking, always prevent tap
Gestures.prevent('tap');
// reset started state on up
this.info.state = 'end';
this.info.addMove({x: ct.clientX, y: ct.clientY});

91
test/unit/gestures-elements.html
View File

@ -94,6 +94,22 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
</script>
</dom-module>
<script>
var EventCaptureBehavior = {
properties: {
stream: {
type: Array,
value: function() {
return [];
}
}
},
handle: function(e) {
this.stream.push(e);
}
};
</script>
<dom-module id="x-prevent">
<script>
Polymer({
@ -103,13 +119,8 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
'tap': 'handle',
'track': 'handle'
},
behaviors: [EventCaptureBehavior],
is: 'x-prevent',
created: function() {
this.stream = [];
},
handle: function(e) {
this.stream.push(e);
},
prevent: function(e, detail) {
detail.prevent('tap');
detail.prevent('track');
@ -130,12 +141,7 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
'tap': 'handle',
'track': 'handle'
},
created: function() {
this.stream = [];
},
handle: function(e) {
this.stream.push(e);
}
behaviors: [EventCaptureBehavior]
});
</script>
</dom-module>
@ -144,23 +150,58 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
<script>
Polymer({
is: 'x-document-listener',
properties: {
stream: {
type: Array,
value: function() {
return [];
}
}
},
setup: function() {
this.listen(document, 'down', 'handler');
this.listen(document, 'down', 'handle');
},
teardown: function() {
this.unlisten(document, 'down', 'handler');
this.unlisten(document, 'down', 'handle');
},
handler: function(e) {
this.stream.push(e);
}
behaviors: [EventCaptureBehavior]
});
</script>
</dom-module>
<dom-module id="x-nested-child-prevent">
<script>
Polymer({
is: 'x-nested-child-prevent',
listeners: {
tap: 'handle'
},
behaviors: [EventCaptureBehavior]
});
</script>
</dom-module>
<dom-module id="x-nested-prevent">
<template>
<style>
:host {
position: absolute;
display: block;
background: orange;
height: 100px;
width: 100px;
}
#child {
position: relative;
display: block;
background: blue;
height: 50px;
width: 50px;
margin-top: 25px;
margin-left: 25px;
}
</style>
<x-nested-child-prevent id="child"></x-nested-child-prevent>
</template>
<script>
Polymer({
is: 'x-nested-prevent',
listeners: {
track: 'handle'
},
behaviors: [EventCaptureBehavior]
});
</script>
</dom-module>

46
test/unit/gestures.html
View File

@ -291,6 +291,52 @@ subject to an additional IP rights grant found at http://polymer.github.io/PATEN
assert.equal(el.stream[0].defaultPrevented, true, 'down was prevented');
assert.equal(el.stream[1].type, 'up', 'up was found');
});
test('nested track and tap with touch', function() {
el.parentNode.removeChild(el);
el = document.createElement('x-nested-prevent');
var child = el.$.child;
document.body.appendChild(el);
var options = {bubbles: true, cancelable: true};
var bgr = el.getBoundingClientRect();
var clientX = bgr.left + (bgr.width / 2);
var clientY = bgr.top + (bgr.bottom / 2);
var ev = new CustomEvent('touchstart', options);
ev.touches = ev.changedTouches = [
{
clientX: clientX,
clientY: clientY,
identifier: 1,
target: child
}
];
ev.clientX = clientX;
ev.clientY = clientY;
ev.__polymerSimulatedTouch = true;
child.dispatchEvent(ev);
for (var i = 0; i < 10; i++) {
clientX += 1;
ev = new CustomEvent(i === 9 ? 'touchend' : 'touchmove', options);
ev.touches = ev.changedTouches = [
{
clientX: clientX,
clientY: clientY,
identifier: 1,
target: child
}
];
ev.clientX = clientX;
ev.clientY = clientY;
// tell gestures to not turn off mouse events
ev.__polymerSimulatedTouch = true;
child.dispatchEvent(ev);
}
assert.equal(child.stream.length, 0, 'expected no taps on the child');
assert.notEqual(el.stream.length, 0, 'expected some tracks on the parent');
});
});
suite('Buttons', function() {