Permalink
Browse files

Rangeslider: Allow enabling after disabling

Fixes gh-7547
Closes gh-7621

(cherry picked from commit fc0acb5)
  • Loading branch information...
1 parent 2cc4285 commit a3b0f79d20d471133e2e7de49adb1d9b0bde2e90 @cgack cgack committed with arschmitz Aug 14, 2014
Showing with 49 additions and 0 deletions.
  1. +10 −0 js/widgets/forms/rangeslider.js
  2. +4 −0 tests/unit/rangeslider/index.html
  3. +35 −0 tests/unit/rangeslider/rangeslider_core.js
@@ -144,6 +144,11 @@ define( [ "jquery",
if ( options.highlight !== undefined ) {
this._setHighlight( options.highlight );
}
+
+ if ( options.disabled !== undefined ) {
+ this._setDisabled( options.disabled );
+ }
+
this._super( options );
this.refresh();
},
@@ -250,6 +255,11 @@ define( [ "jquery",
this._inputLast.slider( "option", "highlight", value );
},
+ _setDisabled: function( value ) {
+ this._inputFirst.prop( "disabled", value );
+ this._inputLast.prop( "disabled", value );
+ },
+
_destroy: function() {
this._label.prependTo( this.element );
this.element.removeClass( "ui-rangeslider ui-mini" );
@@ -58,6 +58,10 @@
<input type="range" name="rangeslider-last" id="rangeslider-startstop-last" value="100" min="0" max="100" data-nstest-theme="b" data-nstest-track-theme="a" />
</div>
</div>
+ <div data-nstest-role="rangeslider" id="disable-rangeslider">
+ <input name="range-disabled-first" id="range-disabled-first" min="0" max="100" value="0" type="range">
+ <input name="range-disabled-last" id="range-disabled-last" min="0" max="100" value="100" type="range">
+ </div>
</form>
</div>
@@ -129,5 +129,40 @@
], 50)
});
+ test( " Rangeslider is enabled/disabled correctly ", function() {
+ var rangeslider = $( "#disable-rangeslider" ),
+ inputFirst = $( "#range-disabled-first" ),
+ inputLast = $( "#range-disabled-last" ),
+ sliderFirst = rangeslider.find( ".ui-slider-track" ).first(),
+ sliderLast = rangeslider.find( ".ui-slider-track" ).first();
+
+ rangeslider.rangeslider( { disabled: true } );
+
+ ok( !!inputFirst.attr( "disabled" ), "first input is disabled" );
+ ok( inputFirst.hasClass( "mobile-slider-disabled"),
+ "first input gets mobile-slider-disabled" );
+ ok( !!sliderFirst.attr( "aria-disabled" ), "first slider is aria-disabled" );
+ ok( sliderFirst.hasClass( "ui-state-disabled"), "first slider has ui-state-disabled" );
+ ok( !!inputLast.attr( "disabled" ), "last input is disabled" );
+ ok( inputLast.hasClass( "mobile-slider-disabled"),
+ "last input gets mobile-slider-disabled" );
+ ok( !!sliderLast.attr( "aria-disabled" ), "last slider is aria-disabled" );
+ ok( sliderLast.hasClass( "ui-state-disabled"), "last slider has ui-state-disabled" );
+
+ rangeslider.rangeslider( {disabled: false } );
+
+ deepEqual( !!inputFirst.attr( "disabled" ), false, "first input is enabled" );
+ ok( !inputFirst.hasClass( "mobile-slider-disabled"),
+ "first input gets mobile-slider-disabled" );
+ deepEqual( sliderFirst.attr( "aria-disabled" ), "false",
+ "first slider aria-disabled is false" );
+ ok( !sliderFirst.hasClass( "ui-state-disabled"), "first slider ui-state-disabled removed" );
+ deepEqual( !!inputLast.attr( "disabled" ), false, "last input is enabled" );
+ ok( !inputLast.hasClass( "mobile-slider-disabled"),
+ "last input gets mobile-slider-disabled" );
+ deepEqual( sliderLast.attr( "aria-disabled" ), "false",
+ "last slider aria-disabled is false" );
+ ok( !sliderLast.hasClass( "ui-state-disabled"), "last slider ui-state-disabled removed" );
+ });
})( jQuery );

0 comments on commit a3b0f79

Please sign in to comment.