test_nested_gesture_recognizers.js 4.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167
  1. var parent,
  2. child,
  3. hammerChild,
  4. hammerParent;
  5. module('Nested gesture recognizers (Tap Child + Pan Parent)', {
  6. setup: function() {
  7. parent = document.createElement('div');
  8. child = document.createElement('div');
  9. document.getElementById('qunit-fixture').appendChild(parent);
  10. parent.appendChild(child);
  11. hammerParent = new Hammer.Manager(parent, {
  12. touchAction: 'none'
  13. });
  14. hammerChild = new Hammer.Manager(child, {
  15. touchAction: 'none'
  16. });
  17. hammerChild.add(new Hammer.Tap());
  18. hammerParent.add(new Hammer.Pan({threshold: 5, pointers: 1}));
  19. },
  20. teardown: function() {
  21. hammerChild.destroy();
  22. hammerParent.destroy();
  23. }
  24. });
  25. test('Tap on the child', function() {
  26. expect(1);
  27. hammerChild.on('tap', function() {
  28. ok(true);
  29. });
  30. hammerParent.on('tap', function() {
  31. throw new Error('tap should not fire on parent');
  32. });
  33. utils.dispatchTouchEvent(child, 'start', 0, 10);
  34. utils.dispatchTouchEvent(child, 'end', 0, 10);
  35. });
  36. test('Panning on the child should fire parent pan and should not fire child tap event', function() {
  37. expect(1);
  38. hammerChild.on('tap', function() {
  39. throw new Error('tap should not fire on parent');
  40. });
  41. hammerParent.on('panend', function() {
  42. ok(true);
  43. });
  44. utils.dispatchTouchEvent(child, 'start', 10, 0);
  45. utils.dispatchTouchEvent(child, 'move', 20, 0);
  46. utils.dispatchTouchEvent(child, 'end', 30, 0);
  47. });
  48. /*
  49. // test (optional pointers validation)
  50. test('Panning with one finger down on child, other on parent', function () {
  51. expect(1);
  52. var event,
  53. touches;
  54. hammerParent.on('panend', function () {
  55. ok(true);
  56. });
  57. // one finger one child
  58. utils.dispatchTouchEvent(child, 'start', 10, 0, 0);
  59. utils.dispatchTouchEvent(parent, 'start', 12, 0, 1);
  60. touches = [
  61. {clientX: 20, clientY: 0, identifier: 0 },
  62. {clientX: 20, clientY: 0, identifier: 1 }
  63. ];
  64. event = document.createEvent('Event');
  65. event.initEvent('touchmove', true, true);
  66. event.touches = touches;
  67. event.changedTouches = touches;
  68. parent.dispatchEvent(event);
  69. touches = [
  70. {clientX: 30, clientY: 0, identifier: 0 },
  71. {clientX: 30, clientY: 0, identifier: 1 }
  72. ];
  73. event = document.createEvent('Event');
  74. event.initEvent('touchend', true, true);
  75. event.touches = touches;
  76. event.changedTouches = touches;
  77. parent.dispatchEvent(event);
  78. });
  79. */
  80. var pressPeriod = 600;
  81. module('Nested gesture recognizers (Press Child + Pan Parent)', {
  82. setup: function() {
  83. parent = document.createElement('div');
  84. child = document.createElement('div');
  85. document.getElementById('qunit-fixture').appendChild(parent);
  86. parent.appendChild(child);
  87. hammerParent = new Hammer.Manager(parent, {
  88. touchAction: 'none'
  89. });
  90. hammerChild = new Hammer.Manager(child, {
  91. touchAction: 'none'
  92. });
  93. hammerChild.add(new Hammer.Press({time: pressPeriod}));
  94. hammerParent.add(new Hammer.Pan({threshold: 5, pointers: 1}));
  95. },
  96. teardown: function() {
  97. hammerChild.destroy();
  98. hammerParent.destroy();
  99. }
  100. });
  101. test('Press on the child', function() {
  102. expect(1);
  103. hammerChild.on('press', function() {
  104. ok(true);
  105. });
  106. hammerParent.on('press', function() {
  107. throw new Error('press should not fire on parent');
  108. });
  109. utils.dispatchTouchEvent(child, 'start', 0, 10);
  110. stop();
  111. setTimeout(function() {
  112. start();
  113. }, pressPeriod);
  114. });
  115. test('When Press is followed by Pan on the same element, both gestures are recognized', function() {
  116. expect(2);
  117. hammerChild.on('press', function() {
  118. ok(true);
  119. });
  120. hammerParent.on('panend', function() {
  121. ok(true);
  122. });
  123. utils.dispatchTouchEvent(child, 'start', 0, 10);
  124. stop();
  125. setTimeout(function() {
  126. start();
  127. utils.dispatchTouchEvent(child, 'move', 10, 10);
  128. utils.dispatchTouchEvent(child, 'move', 20, 10);
  129. utils.dispatchTouchEvent(child, 'move', 30, 10);
  130. utils.dispatchTouchEvent(child, 'end', 30, 10);
  131. }, pressPeriod);
  132. });