fix(reorder): item click handlers dont fire when tapping on reorder icon

ionic-team · Aug 19, 2014 · cc18a64 · cc18a64
1 parent d18f0f7
commit cc18a64
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 0 deletions.
diff --git a/js/angular/directive/itemReorderButton.js b/js/angular/directive/itemReorderButton.js
@@ -67,6 +67,11 @@ IonicModule
           });
         };
 
+        // prevent clicks from bubbling up to the item
+        if(!$attr['ngClick'] && !$attr['onClick'] && !$attr['onclick']){
+          $element[0].onclick = function(e){e.stopPropagation(); return false;};
+        }
+
         var container = jqLite(ITEM_TPL_REORDER_BUTTON);
         container.append($element);
         itemCtrl.$element.append(container).addClass('item-right-editable');

diff --git a/test/unit/angular/directive/item.unit.js b/test/unit/angular/directive/item.unit.js
@@ -114,6 +114,23 @@ describe('ionReorderButton directive', function() {
     expect(reorderContainer.hasClass('visible')).toBe(true);
     expect(reorderContainer.hasClass('active')).toBe(true);
   }));
+  it('should allow click handlers, but not bubble up to item\'s click event', inject(function($compile, $rootScope) {
+    $rootScope.click = jasmine.createSpy('click');;
+
+    var el = angular.element('<ion-item ng-click="click()"><ion-reorder-button></ion-reorder-button></ion-item>');
+    $compile(el)($rootScope);
+    $rootScope.$apply();
+    var reorderContainer = angular.element(el[0].querySelector('ion-reorder-button'));
+    reorderContainer.triggerHandler('click');
+    expect($rootScope.click).not.toHaveBeenCalled();
+
+    var el = angular.element('<ion-item><ion-reorder-button  ng-click="click()"></ion-reorder-button></ion-item>');
+    $compile(el)($rootScope);
+    $rootScope.$apply();
+    var reorderContainer = angular.element(el[0].querySelector('ion-reorder-button'));
+    reorderContainer.triggerHandler('click');
+    expect($rootScope.click).toHaveBeenCalled();
+  }));
 });
 
 describe('ionOptionButton directive', function() {