fix(ngMobile): prevent ngClick when item disabled

- the ngClick attribute was always triggered, regardless the ngDisabled/disabled attributes - we now check the DOM disabled status before triggering the original click event Closes #3124 Closes #3132
angular · Jul 24, 2013 · e034024 · e034024
1 parent 52b8211
commit e034024
Show file tree

Hide file tree

Showing 2 changed files with 53 additions and 4 deletions.
diff --git a/src/ngMobile/directive/ngClick.js b/src/ngMobile/directive/ngClick.js
@@ -232,10 +232,11 @@ ngMobile.directive('ngClick', ['$parse', '$timeout', '$rootElement',
           tapElement.blur();
         }
 
-        scope.$apply(function() {
-          // TODO(braden): This is sending the touchend, not a tap or click. Is that kosher?
-          clickHandler(scope, {$event: event});
-        });
+        if (!angular.isDefined(attr.disabled) || attr.disabled === false) {
+          scope.$apply(function() {
+            clickHandler(scope, {$event: event});
+          });
+        }
       }
 
       resetState();

diff --git a/test/ngMobile/directive/ngClickSpec.js b/test/ngMobile/directive/ngClickSpec.js
@@ -310,4 +310,52 @@ describe('ngClick (mobile)', function() {
   });
 
 
+  describe('disabled state', function() {
+    it('should not trigger click if ngDisabled is true', inject(function($rootScope, $compile) {
+      element = $compile('<div ng-click="event = $event" ng-disabled="disabled"></div>')($rootScope);
+      $rootScope.disabled = true;
+      $rootScope.$digest();
+
+      browserTrigger(element, 'touchstart', [], 10, 10);
+      browserTrigger(element, 'touchend', [], 10, 10);
+
+      expect($rootScope.event).toBeUndefined();
+    }));
+    it('should trigger click if ngDisabled is false', inject(function($rootScope, $compile) {
+      element = $compile('<div ng-click="event = $event" ng-disabled="disabled"></div>')($rootScope);
+      $rootScope.disabled = false;
+      $rootScope.$digest();
+
+      browserTrigger(element, 'touchstart', [], 10, 10);
+      browserTrigger(element, 'touchend', [], 10, 10);
+
+      expect($rootScope.event).toBeDefined();
+    }));
+    it('should not trigger click if regular disabled is true', inject(function($rootScope, $compile) {
+      element = $compile('<div ng-click="event = $event" disabled="true"></div>')($rootScope);
+
+      browserTrigger(element, 'touchstart', [], 10, 10);
+      browserTrigger(element, 'touchend', [], 10, 10);
+
+      expect($rootScope.event).toBeUndefined();
+    }));
+    it('should not trigger click if regular disabled is present', inject(function($rootScope, $compile) {
+      element = $compile('<button ng-click="event = $event" disabled ></button>')($rootScope);
+
+      browserTrigger(element, 'touchstart', [], 10, 10);
+      browserTrigger(element, 'touchend', [], 10, 10);
+
+      expect($rootScope.event).toBeUndefined();
+    }));
+    it('should trigger click if regular disabled is not present', inject(function($rootScope, $compile) {
+      element = $compile('<div ng-click="event = $event" ></div>')($rootScope);
+
+      browserTrigger(element, 'touchstart', [], 10, 10);
+      browserTrigger(element, 'touchend', [], 10, 10);
+
+      expect($rootScope.event).toBeDefined();
+    }));
+  });
+
+
 });