Skip to content
This repository has been archived by the owner on Sep 5, 2024. It is now read-only.

update(slider): improve disabled attribute validation #7310

Closed
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
33 changes: 11 additions & 22 deletions src/components/slider/slider.js
Original file line number Diff line number Diff line change
Expand Up @@ -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'));
Expand All @@ -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
Expand All @@ -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;
Expand Down Expand Up @@ -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);
}

Expand Down Expand Up @@ -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) {
Expand Down Expand Up @@ -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();
Expand All @@ -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');

Expand All @@ -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();

Expand Down
4 changes: 4 additions & 0 deletions src/components/slider/slider.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -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',
Expand All @@ -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({
Expand Down