test_simultaneous_recognition.js 6.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234
  1. var el,
  2. hammer;
  3. module('Simultaenous recognition', {
  4. setup: function() {
  5. el = utils.createHitArea()
  6. },
  7. teardown: function() {
  8. hammer && hammer.destroy();
  9. }
  10. });
  11. asyncTest('should pinch and pan simultaneously be recognized when enabled', function() {
  12. expect(4);
  13. var panCount = 0,
  14. pinchCount = 0;
  15. hammer = new Hammer.Manager(el, {
  16. touchAction: 'none'
  17. });
  18. hammer.add(new Hammer.Pan({threshold: 5, pointers: 2}));
  19. var pinch = new Hammer.Pinch({ threshold: 0, pointers: 2});
  20. hammer.add(pinch);
  21. pinch.recognizeWith(hammer.get('pan'));
  22. hammer.on('panend', function() {
  23. panCount++;
  24. });
  25. hammer.on('pinchend', function() {
  26. pinchCount++;
  27. });
  28. var executeGesture = function(cb) {
  29. var event, touches;
  30. touches = [
  31. {clientX: 0, clientY: 10, identifier: 0, target: el },
  32. {clientX: 10, clientY: 10, identifier: 1, target: el }
  33. ];
  34. event = document.createEvent('Event');
  35. event.initEvent('touchstart', true, true);
  36. event.touches = touches;
  37. event.targetTouches = touches;
  38. event.changedTouches = touches;
  39. el.dispatchEvent(event);
  40. setTimeout(function() {
  41. touches = [
  42. {clientX: 10, clientY: 20, identifier: 0, target: el },
  43. {clientX: 20, clientY: 20, identifier: 1, target: el }
  44. ];
  45. event = document.createEvent('Event');
  46. event.initEvent('touchmove', true, true);
  47. event.touches = touches;
  48. event.targetTouches = touches;
  49. event.changedTouches = touches;
  50. el.dispatchEvent(event);
  51. }, 100);
  52. setTimeout(function() {
  53. touches = [
  54. {clientX: 20, clientY: 30, identifier: 0, target: el },
  55. {clientX: 40, clientY: 30, identifier: 1, target: el }
  56. ];
  57. event = document.createEvent('Event');
  58. event.initEvent('touchmove', true, true);
  59. event.touches = touches;
  60. event.targetTouches = touches;
  61. event.changedTouches = touches;
  62. el.dispatchEvent(event);
  63. event = document.createEvent('Event');
  64. event.initEvent('touchend', true, true);
  65. event.touches = touches;
  66. event.targetTouches = touches;
  67. event.changedTouches = touches;
  68. el.dispatchEvent(event);
  69. cb();
  70. }, 200);
  71. };
  72. // 2 gesture will be recognized
  73. executeGesture(function() {
  74. equal(panCount, 1);
  75. equal(pinchCount, 1);
  76. pinch.dropRecognizeWith(hammer.get('pan'));
  77. // only the pan gesture will be recognized
  78. executeGesture(function() {
  79. equal(panCount, 2);
  80. equal(pinchCount, 1);
  81. start();
  82. });
  83. });
  84. });
  85. test('the first gesture should block the following gestures (Tap & DoubleTap)', function() {
  86. expect(4);
  87. var tapCount = 0,
  88. doubleTapCount = 0;
  89. hammer = new Hammer.Manager(el, {
  90. touchAction: 'none'
  91. });
  92. var tap = new Hammer.Tap();
  93. var doubleTap = new Hammer.Tap({event: 'doubletap', taps: 2});
  94. hammer.add(tap);
  95. hammer.add(doubleTap);
  96. hammer.on('tap', function() {
  97. tapCount++;
  98. });
  99. hammer.on('doubletap', function() {
  100. doubleTapCount++;
  101. });
  102. utils.dispatchTouchEvent(el, 'start', 0, 10);
  103. utils.dispatchTouchEvent(el, 'end', 0, 10);
  104. utils.dispatchTouchEvent(el, 'start', 0, 10);
  105. utils.dispatchTouchEvent(el, 'end', 0, 10);
  106. equal(tapCount, 2, 'on a double tap gesture, the tap gesture is recognized twice');
  107. equal(doubleTapCount, 0, 'double tap gesture is not recognized because the prior tap gesture does not recognize it simultaneously');
  108. doubleTap.recognizeWith(hammer.get('tap'));
  109. utils.dispatchTouchEvent(el, 'start', 0, 10);
  110. utils.dispatchTouchEvent(el, 'end', 0, 10);
  111. utils.dispatchTouchEvent(el, 'start', 0, 10);
  112. utils.dispatchTouchEvent(el, 'end', 0, 10);
  113. equal(tapCount, 4);
  114. equal(doubleTapCount, 1, 'when the tap gesture is configured to work simultaneously, tap & doubleTap can be recognized simultaneously');
  115. });
  116. test('when disabled, the first gesture should not block gestures (Tap & DoubleTap )', function() {
  117. expect(4);
  118. var tapCount = 0,
  119. doubleTapCount = 0;
  120. hammer = new Hammer.Manager(el, {
  121. touchAction: 'none'
  122. });
  123. var tap = new Hammer.Tap();
  124. var doubleTap = new Hammer.Tap({event: 'doubletap', taps: 2});
  125. hammer.add(tap);
  126. hammer.add(doubleTap);
  127. hammer.on('tap', function() {
  128. tapCount++;
  129. });
  130. hammer.on('doubletap', function() {
  131. doubleTapCount++;
  132. });
  133. utils.dispatchTouchEvent(el, 'start', 0, 10);
  134. utils.dispatchTouchEvent(el, 'end', 0, 10);
  135. utils.dispatchTouchEvent(el, 'start', 0, 10);
  136. utils.dispatchTouchEvent(el, 'end', 0, 10);
  137. equal(tapCount, 2, 'on a double tap gesture, the tap gesture is recognized twice');
  138. equal(doubleTapCount, 0, 'double tap gesture is not recognized because the prior tap gesture does not recognize it simultaneously');
  139. hammer.get('tap').set({ enable: false });
  140. utils.dispatchTouchEvent(el, 'start', 0, 10);
  141. utils.dispatchTouchEvent(el, 'end', 0, 10);
  142. utils.dispatchTouchEvent(el, 'start', 0, 10);
  143. utils.dispatchTouchEvent(el, 'end', 0, 10);
  144. equal(tapCount, 2, 'tap gesture should not be recognized when the recognizer is disabled');
  145. equal(doubleTapCount, 1, 'when the tap gesture is disabled, doubleTap can be recognized');
  146. });
  147. test('the first gesture should block the following gestures (DoubleTap & Tap)', function() {
  148. expect(4);
  149. var tapCount = 0,
  150. doubleTapCount = 0;
  151. hammer = new Hammer.Manager(el, {
  152. touchAction: 'none'
  153. });
  154. var tap = new Hammer.Tap();
  155. var doubleTap = new Hammer.Tap({event: 'doubletap', taps: 2});
  156. hammer.add(doubleTap);
  157. hammer.add(tap);
  158. hammer.on('tap', function() {
  159. tapCount++;
  160. });
  161. hammer.on('doubletap', function() {
  162. doubleTapCount++;
  163. });
  164. utils.dispatchTouchEvent(el, 'start', 0, 10);
  165. utils.dispatchTouchEvent(el, 'end', 0, 10);
  166. utils.dispatchTouchEvent(el, 'start', 0, 10);
  167. utils.dispatchTouchEvent(el, 'end', 0, 10);
  168. equal(doubleTapCount, 1, 'double tap is recognized');
  169. equal(tapCount, 1, 'tap is detected, the doubletap is only catched by the doubletap recognizer');
  170. // doubletap and tap together
  171. doubleTap.recognizeWith(hammer.get('tap'));
  172. doubleTapCount = 0;
  173. tapCount = 0;
  174. utils.dispatchTouchEvent(el, 'start', 0, 10);
  175. utils.dispatchTouchEvent(el, 'end', 0, 10);
  176. utils.dispatchTouchEvent(el, 'start', 0, 10);
  177. utils.dispatchTouchEvent(el, 'end', 0, 10);
  178. equal(doubleTapCount, 1);
  179. equal(tapCount, 2, 'when the tap gesture is configured to work simultaneously, tap & doubleTap can be recognized simultaneously');
  180. });