update(slider): improve disabled attribute validation

Improved the `disabled` attribute validation by only observing the attribute instead of using a getter function - as same as done in the `autocomplete` Closes #7310
angular · Mar 1, 2016 · fc07353 · fc07353
1 parent 6d39c21
commit fc07353
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 22 deletions.
diff --git a/src/components/slider/slider.js b/src/components/slider/slider.js
@@ -96,12 +96,12 @@ function SliderDirective($$rAF, $window, $mdAria, $mdUtil, $mdConstant, $mdThemi
       $viewChangeListeners: []
     };
 
-    var isDisabledGetter = angular.noop;
-    if (attr.disabled != null) {
-      isDisabledGetter = function() { return true; };
-    } else if (attr.ngDisabled) {
-      isDisabledGetter = angular.bind(null, $parse(attr.ngDisabled), scope.$parent);
-    }
+    var isDisabled = false;
+
+    attr.$observe('disabled', function (value) {
+      isDisabled = $mdUtil.parseAttributeBoolean(value, false);
+      updateAriaDisabled();
+    });
 
     var thumb = angular.element(element[0].querySelector('._md-thumb'));
     var thumbText = angular.element(element[0].querySelector('._md-thumb-text'));
@@ -116,14 +116,6 @@ function SliderDirective($$rAF, $window, $mdAria, $mdUtil, $mdConstant, $mdThemi
     angular.isDefined(attr.max) ? attr.$observe('max', updateMax) : updateMax(100);
     angular.isDefined(attr.step)? attr.$observe('step', updateStep) : updateStep(1);
 
-    // We have to manually stop the $watch on ngDisabled because it exists
-    // on the parent scope, and won't be automatically destroyed when
-    // the component is destroyed.
-    var stopDisabledWatch = angular.noop;
-    if (attr.ngDisabled) {
-      stopDisabledWatch = scope.$parent.$watch(attr.ngDisabled, updateAriaDisabled);
-    }
-
     $mdGesture.register(element, 'drag');
 
     element
@@ -147,7 +139,6 @@ function SliderDirective($$rAF, $window, $mdAria, $mdUtil, $mdConstant, $mdThemi
 
     scope.$on('$destroy', function() {
       angular.element($window).off('resize', debouncedUpdateAll);
-      stopDisabledWatch();
     });
 
     ngModelCtrl.$render = ngModelRender;
@@ -175,7 +166,7 @@ function SliderDirective($$rAF, $window, $mdAria, $mdUtil, $mdConstant, $mdThemi
       step = parseFloat(value);
       redrawTicks();
     }
-    function updateAriaDisabled(isDisabled) {
+    function updateAriaDisabled() {
       element.attr('aria-disabled', !!isDisabled);
     }
 
@@ -232,9 +223,7 @@ function SliderDirective($$rAF, $window, $mdAria, $mdUtil, $mdConstant, $mdThemi
      * left/right arrow listener
      */
     function keydownListener(ev) {
-      if(element[0].hasAttribute('disabled')) {
-        return;
-      }
+      if (isDisabled) return;
 
       var changeAmount;
       if (ev.keyCode === $mdConstant.KEY_CODE.LEFT_ARROW) {
@@ -309,7 +298,7 @@ function SliderDirective($$rAF, $window, $mdAria, $mdUtil, $mdConstant, $mdThemi
     var isDiscrete = angular.isDefined(attr.mdDiscrete);
 
     function onPressDown(ev) {
-      if (isDisabledGetter()) return;
+      if (isDisabled) return;
 
       element.addClass('_md-active');
       element[0].focus();
@@ -323,7 +312,7 @@ function SliderDirective($$rAF, $window, $mdAria, $mdUtil, $mdConstant, $mdThemi
       });
     }
     function onPressUp(ev) {
-      if (isDisabledGetter()) return;
+      if (isDisabled) return;
 
       element.removeClass('_md-dragging _md-active');
 
@@ -335,7 +324,7 @@ function SliderDirective($$rAF, $window, $mdAria, $mdUtil, $mdConstant, $mdThemi
       });
     }
     function onDragStart(ev) {
-      if (isDisabledGetter()) return;
+      if (isDisabled) return;
       isDragging = true;
       ev.stopPropagation();
 

diff --git a/src/components/slider/slider.spec.js b/src/components/slider/slider.spec.js
@@ -183,6 +183,8 @@ describe('md-slider', function() {
     pageScope.isDisabled = true;
     var slider = setup('ng-disabled="isDisabled"');
 
+    pageScope.$digest();
+
     // Doesn't add active class on pressdown when disabled
     slider.triggerHandler({
       type: '$md.pressdown',
@@ -202,6 +204,8 @@ describe('md-slider', function() {
   it('should disable via the `disabled` attribute', function() {
     var slider = setup('disabled');
 
+    pageScope.$digest();
+
     // Check for disabled state by triggering the pressdown handler and asserting that
     // the slider is not active.
     slider.triggerHandler({