Skip to content

Commit

Permalink
Widget: Stop setting ui-state-disabled and aria by default on setting…
Browse files Browse the repository at this point in the history 
… disabled option.

Fixes #5973 - Resizable: disabled should not have the ui-state-disabled class or aria attribute aria-disabled
Fixes #5974 - Draggable: disabled should not have the ui-state-disabled class or aria attribute aria-disabled
Fixes #6039 - Droppable : disabled should not have ui-state-disabled
  • Loading branch information
@mikesherov
mikesherov committed Mar 12, 2013
1 parent 4f95a0f commit 4d67f4f
Show file tree
Hide file tree
Showing 23 changed files with 174 additions and 106 deletions.
7 changes: 6 additions & 1 deletion tests/unit/accordion/accordion_methods.js
View file
Original file line number Original file line Diff line number Diff line change
Expand Up @@ -14,10 +14,15 @@ test( "destroy", function() {
}); });


test( "enable/disable", function() { test( "enable/disable", function() {
expect( 4 ); expect( 7 );
var element = $( "#list1" ).accordion(); var element = $( "#list1" ).accordion();
state( element, 1, 0, 0 ); state( element, 1, 0, 0 );
element.accordion( "disable" ); element.accordion( "disable" );

ok( element.hasClass( "ui-state-disabled" ), "element gets ui-state-disabled" );
equal( element.attr( "aria-disabled" ), "true", "element gets aria-disabled" );
ok( element.hasClass( "ui-accordion-disabled" ), "element gets ui-accordion-disabled" );

// event does nothing // event does nothing
element.find( ".ui-accordion-header" ).eq( 1 ).trigger( "click" ); element.find( ".ui-accordion-header" ).eq( 1 ).trigger( "click" );
state( element, 1, 0, 0 ); state( element, 1, 0, 0 );
Expand Down
11 changes: 7 additions & 4 deletions tests/unit/autocomplete/autocomplete_options.js
View file
Original file line number Original file line Diff line number Diff line change
Expand Up @@ -88,17 +88,20 @@ asyncTest( "delay", function() {
}); });


asyncTest( "disabled", function() { asyncTest( "disabled", function() {
expect( 2 ); expect( 5 );
var element = $( "#autocomplete" ).autocomplete({ var element = $( "#autocomplete" ).autocomplete({
source: data, source: data,
delay: 0, delay: 0
disabled: true
}), }),
menu = element.autocomplete( "widget" ); menu = element.autocomplete( "disable" ).autocomplete( "widget" );
element.val( "ja" ).keydown(); element.val( "ja" ).keydown();


ok( menu.is( ":hidden" ) ); ok( menu.is( ":hidden" ) );


ok( !element.is( ".ui-state-disabled" ), "element doesn't get ui-state-disabled" );
ok( !element.attr( "aria-disabled" ), "element doesn't get aria-disabled" );
ok( menu.is( ".ui-autocomplete-disabled" ), "element gets ui-autocomplete-disabled" );

setTimeout(function() { setTimeout(function() {
ok( menu.is( ":hidden" ) ); ok( menu.is( ":hidden" ) );
start(); start();
Expand Down
29 changes: 18 additions & 11 deletions tests/unit/button/button_options.js
View file
Original file line number Original file line Diff line number Diff line change
Expand Up @@ -3,19 +3,26 @@
*/ */
(function($) { (function($) {


module("button: options"); module( "button: options" );


test("disabled, explicit value", function() { test( "disabled, explicit value", function() {
expect( 4 ); expect( 9 );
$("#radio01").button({ disabled: false });
deepEqual(false, $("#radio01").button("option", "disabled"),
"disabled option set to false");
deepEqual(false, $("#radio01").prop("disabled"), "element is disabled");


$("#radio02").button({ disabled: true }); var element = $( "#radio01" ).button({ disabled: false });
deepEqual(true, $("#radio02").button("option", "disabled"), deepEqual( element.button( "option", "disabled" ), false, "disabled option set to false" );
"disabled option set to true"); deepEqual( element.prop( "disabled" ), false, "element is disabled" );
deepEqual(true, $("#radio02").prop("disabled"), "element is not disabled");
ok( !element.button( "widget" ).hasClass( "ui-state-disabled" ), "element gets ui-state-disabled" );
ok( !element.button( "widget" ).hasClass( "ui-button-disabled" ), "element gets ui-button-disabled" );

element = $( "#radio02" ).button({ disabled: true });

ok( element.button( "widget" ).hasClass( "ui-state-disabled" ), "element gets ui-state-disabled" );
ok( !element.button( "widget" ).attr( "aria-disabled" ), "element does not get aria-disabled" );
ok( element.button( "widget" ).hasClass( "ui-button-disabled" ), "element gets ui-button-disabled" );

deepEqual( element.button( "option", "disabled" ), true, "disabled option set to true" );
deepEqual( element.prop( "disabled" ), true, "element is not disabled" );
}); });


test("disabled, null", function() { test("disabled, null", function() {
Expand Down
4 changes: 3 additions & 1 deletion tests/unit/dialog/dialog_methods.js
View file
Original file line number Original file line Diff line number Diff line change
Expand Up @@ -101,11 +101,13 @@ test("#4980: Destroy should place element back in original DOM position", functi
}); });


test( "enable/disable disabled", function() { test( "enable/disable disabled", function() {
expect( 2 ); expect( 4 );
var element = $( "<div></div>" ).dialog(); var element = $( "<div></div>" ).dialog();
element.dialog( "disable" ); element.dialog( "disable" );
equal(element.dialog( "option", "disabled" ), false, "disable method doesn't do anything" ); equal(element.dialog( "option", "disabled" ), false, "disable method doesn't do anything" );
ok( !element.dialog( "widget" ).hasClass( "ui-dialog-disabled" ), "disable method doesn't add ui-dialog-disabled class" ); ok( !element.dialog( "widget" ).hasClass( "ui-dialog-disabled" ), "disable method doesn't add ui-dialog-disabled class" );
ok( !element.dialog( "widget" ).hasClass( "ui-state-disabled" ), "disable method doesn't add ui-state-disabled class" );
ok( !element.dialog( "widget" ).attr( "aria-disabled" ), "disable method doesn't add aria-disabled" );
}); });


test("close", function() { test("close", function() {
Expand Down
14 changes: 9 additions & 5 deletions tests/unit/draggable/draggable_methods.js
View file
Original file line number Original file line Diff line number Diff line change
Expand Up @@ -74,25 +74,29 @@ test( "enable", function() {
}); });


test( "disable", function() { test( "disable", function() {
expect( 7 ); expect( 10 );


element = $("#draggable2").draggable({ disabled: false }); element = $( "#draggable2" ).draggable({ disabled: false });
TestHelpers.draggable.shouldMove( element, ".draggable({ disabled: false })" ); TestHelpers.draggable.shouldMove( element, ".draggable({ disabled: false })" );


element.draggable("disable"); element.draggable( "disable" );
TestHelpers.draggable.shouldNotMove( element, ".draggable('disable')" ); TestHelpers.draggable.shouldNotMove( element, ".draggable('disable')" );
equal( element.draggable( "option", "disabled" ), true, "disabled option getter" ); equal( element.draggable( "option", "disabled" ), true, "disabled option getter" );


element.draggable("destroy"); element.draggable( "destroy" );
element.draggable({ disabled: false }); element.draggable({ disabled: false });
TestHelpers.draggable.shouldMove( element, ".draggable({ disabled: false })" ); TestHelpers.draggable.shouldMove( element, ".draggable({ disabled: false })" );


element.draggable( "option", "disabled", true ); element.draggable( "option", "disabled", true );
equal( element.draggable( "option", "disabled" ), true, "disabled option setter" ); equal( element.draggable( "option", "disabled" ), true, "disabled option setter" );
TestHelpers.draggable.shouldNotMove( element, ".draggable('option', 'disabled', true)" ); TestHelpers.draggable.shouldNotMove( element, ".draggable('option', 'disabled', true)" );


ok( !element.draggable( "widget" ).hasClass( "ui-state-disabled" ), "element does not get ui-state-disabled" );
ok( !element.draggable( "widget" ).attr( "aria-disabled" ), "element does not get aria-disabled" );
ok( element.draggable( "widget" ).hasClass( "ui-draggable-disabled" ), "element gets ui-draggable-disabled" );

var expected = element.draggable(), var expected = element.draggable(),
actual = expected.draggable("disable"); actual = expected.draggable( "disable" );
equal( actual, expected, "disable is chainable" ); equal( actual, expected, "disable is chainable" );
}); });


Expand Down
29 changes: 16 additions & 13 deletions tests/unit/droppable/droppable_methods.js
View file
Original file line number Original file line Diff line number Diff line change
Expand Up @@ -63,26 +63,29 @@ test("enable", function() {
equal(actual, expected, "enable is chainable"); equal(actual, expected, "enable is chainable");
}); });


test("disable", function() { test( "disable", function() {
expect(7); expect( 10 );


var el, actual, expected; var actual, expected,
element = $( "#droppable1" ).droppable({ disabled: false });


el = $("#droppable1").droppable({ disabled: false });
TestHelpers.droppable.shouldDrop(); TestHelpers.droppable.shouldDrop();
el.droppable("disable"); element.droppable( "disable" );
TestHelpers.droppable.shouldNotDrop(); TestHelpers.droppable.shouldNotDrop();
equal(el.droppable("option", "disabled"), true, "disabled option getter"); equal( element.droppable( "option", "disabled" ), true, "disabled option getter" );
el.droppable("destroy"); element.droppable( "destroy" );
el.droppable({ disabled: false }); element.droppable({ disabled: false });
TestHelpers.droppable.shouldDrop(); TestHelpers.droppable.shouldDrop();
el.droppable("option", "disabled", true); element.droppable( "option", "disabled", true );
equal(el.droppable("option", "disabled"), true, "disabled option setter"); ok( !element.droppable( "widget" ).hasClass( "ui-state-disabled" ), "element does not get ui-state-disabled" );
ok( !element.droppable( "widget" ).attr( "aria-disabled" ), "element does not get aria-disabled" );
ok( element.droppable( "widget" ).hasClass( "ui-droppable-disabled" ), "element gets ui-droppable-disabled" );
equal( element.droppable( "option", "disabled" ), true, "disabled option setter" );
TestHelpers.droppable.shouldNotDrop(); TestHelpers.droppable.shouldNotDrop();


expected = $("<div></div>").droppable(), expected = $( "<div></div>" ).droppable();
actual = expected.droppable("disable"); actual = expected.droppable( "disable" );
equal(actual, expected, "disable is chainable"); equal( actual, expected, "disable is chainable" );
}); });


})(jQuery); })(jQuery);
10 changes: 10 additions & 0 deletions tests/unit/progressbar/progressbar_methods.js
View file
Original file line number Original file line Diff line number Diff line change
Expand Up @@ -7,6 +7,16 @@ test( "destroy", function() {
}); });
}); });


test( "disable", function() {
expect( 3 );

var element = $( "#progressbar" ).progressbar().progressbar( "disable" );

ok( element.progressbar( "widget" ).hasClass( "ui-state-disabled" ), "element gets ui-state-disabled" );
ok( element.progressbar( "widget" ).attr( "aria-disabled" ), "element gets aria-disabled" );
ok( element.progressbar( "widget" ).hasClass( "ui-progressbar-disabled" ), "element gets ui-progressbar-disabled" );
});

test( "value", function() { test( "value", function() {
expect( 3 ); expect( 3 );


Expand Down
17 changes: 13 additions & 4 deletions tests/unit/resizable/resizable_methods.js
View file
Original file line number Original file line Diff line number Diff line change
Expand Up @@ -3,10 +3,19 @@
*/ */
(function($) { (function($) {


module("resizable: methods"); module( "resizable: methods" );


// this is here to make JSHint pass "unused", and we don't want to test( "disable", function() {
// remove the parameter for when we finally implement expect( 5 );
$.noop();
var element = $( "#resizable1" ).resizable({ disabled: false }),
chainable = element.resizable( "disable" );

ok( !element.resizable( "widget" ).hasClass( "ui-state-disabled" ), "element does not get ui-state-disabled" );
ok( !element.resizable( "widget" ).attr( "aria-disabled" ), "element does not get aria-disabled" );
ok( element.resizable( "widget" ).hasClass( "ui-resizable-disabled" ), "element gets ui-resizable-disabled" );
equal( element.resizable( "option", "disabled" ), true, "disabled option setter" );
equal( chainable, element, "disable is chainable" );
});


})(jQuery); })(jQuery);
36 changes: 21 additions & 15 deletions tests/unit/selectable/selectable_methods.js
View file
Original file line number Original file line Diff line number Diff line change
Expand Up @@ -71,34 +71,40 @@ test("enable", function() {
equal(actual, expected, "enable is chainable"); equal(actual, expected, "enable is chainable");
}); });


test("disable", function() { test( "disable", function() {
expect(3); expect( 6 );
var expected, actual, var chainable,
fired = false, fired = false,
el = $("#selectable1"); element = $( "#selectable1" );


el.selectable({ element.selectable({
disabled: false, disabled: false,
start: function() { fired = true; } start: function() {
fired = true;
}
}); });
el.simulate( "drag", { element.simulate( "drag", {
dx: 20, dx: 20,
dy: 20 dy: 20
}); });
equal(fired, true, "start fired"); equal( fired, true, "start fired" );
el.selectable("disable");
chainable = element.selectable( "disable" );
fired = false; fired = false;


el.simulate( "drag", { element.simulate( "drag", {
dx: 20, dx: 20,
dy: 20 dy: 20
}); });
equal(fired, false, "start fired"); equal( fired, false, "start fired" );
el.selectable("destroy");


expected = $("<div></div>").selectable(); ok( !element.selectable( "widget" ).hasClass( "ui-state-disabled" ), "element does not get ui-state-disabled" );
actual = expected.selectable("disable"); ok( !element.selectable( "widget" ).attr( "aria-disabled" ), "element does not get aria-disabled" );
equal(actual, expected, "disable is chainable"); ok( element.selectable( "widget" ).hasClass( "ui-selectable-disabled" ), "element gets ui-selectable-disabled" );

element.selectable( "destroy" );

equal( chainable, element, "disable is chainable" );
}); });


})(jQuery); })(jQuery);
3 changes: 2 additions & 1 deletion tests/unit/slider/slider_methods.js
View file
Original file line number Original file line Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@ test( "enable", function() {
}); });


test( "disable", function() { test( "disable", function() {
expect( 5 ); expect( 6 );
var element, var element,
expected = $( "<div></div>" ).slider(), expected = $( "<div></div>" ).slider(),
actual = expected.slider( "disable" ); actual = expected.slider( "disable" );
Expand All @@ -61,6 +61,7 @@ test( "disable", function() {
element.slider( "disable" ); element.slider( "disable" );
ok( element.hasClass( "ui-state-disabled" ), "slider has ui-state-disabled class after disable method call" ); ok( element.hasClass( "ui-state-disabled" ), "slider has ui-state-disabled class after disable method call" );
ok( element.hasClass( "ui-slider-disabled" ), "slider has ui-slider-disabled class after disable method call" ); ok( element.hasClass( "ui-slider-disabled" ), "slider has ui-slider-disabled class after disable method call" );
ok( !element.attr( "aria-disabled" ), "slider does not have aria-disabled attr after disable method call" );
}); });


test( "value", function() { test( "value", function() {
Expand Down
35 changes: 18 additions & 17 deletions tests/unit/sortable/sortable_methods.js
View file
Original file line number Original file line Diff line number Diff line change
Expand Up @@ -64,29 +64,30 @@ test("enable", function() {
equal(actual, expected, "enable is chainable"); equal(actual, expected, "enable is chainable");
}); });


test("disable", function() { test( "disable", function() {
expect(7); expect( 9 );


var el, actual, expected; var chainable,
element = $( "#sortable" ).sortable({ disabled: false });


el = $("#sortable").sortable({ disabled: false }); TestHelpers.sortable.sort( $( "li", element )[ 0 ], 0, 44, 2, ".sortable({ disabled: false })" );
TestHelpers.sortable.sort($("li", el)[0], 0, 44, 2, ".sortable({ disabled: false })");


el.sortable("disable"); chainable = element.sortable( "disable" );
TestHelpers.sortable.sort($("li", el)[0], 0, 44, 0, "disabled.sortable getter"); TestHelpers.sortable.sort( $( "li", element )[ 0 ], 0, 44, 0, "disabled.sortable getter" );


el.sortable("destroy"); element.sortable( "destroy" );


el.sortable({ disabled: false }); element.sortable({ disabled: false });
TestHelpers.sortable.sort($("li", el)[0], 0, 44, 2, ".sortable({ disabled: false })"); TestHelpers.sortable.sort( $( "li", element )[ 0 ], 0, 44, 2, ".sortable({ disabled: false })" );
el.sortable("option", "disabled", true); element.sortable( "option", "disabled", true);
equal(el.sortable("option", "disabled"), true, "disabled option setter"); equal( element.sortable( "option", "disabled" ), true, "disabled option setter" );
ok(el.sortable("widget").is(":not(.ui-state-disabled)"), "sortable element does not get ui-state-disabled since it's an interaction");
TestHelpers.sortable.sort($("li", el)[0], 0, 44, 0, ".sortable('option', 'disabled', true)");


expected = $("<div></div>").sortable(), ok( !element.sortable( "widget" ).hasClass( "ui-state-disabled" ), "element does not get ui-state-disabled" );
actual = expected.sortable("disable"); ok( !element.sortable( "widget" ).attr( "aria-disabled" ), "element does not get aria-disabled" );
equal(actual, expected, "disable is chainable"); ok( element.sortable( "widget" ).hasClass( "ui-sortable-disabled" ), "element gets ui-sortable-disabled" );

TestHelpers.sortable.sort($( "li", element )[ 0 ], 0, 44, 0, ".sortable('option', 'disabled', true)" );
equal( chainable, element, "disable is chainable" );
}); });


})(jQuery); })(jQuery);
4 changes: 3 additions & 1 deletion tests/unit/spinner/spinner_methods.js
View file
Original file line number Original file line Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ test( "destroy", function() {
}); });


test( "disable", function() { test( "disable", function() {
expect( 14 ); expect( 16 );
var element = $( "#spin" ).val( 2 ).spinner(), var element = $( "#spin" ).val( 2 ).spinner(),
wrapper = $( "#spin" ).spinner( "widget" ); wrapper = $( "#spin" ).spinner( "widget" );


Expand All @@ -21,6 +21,8 @@ test( "disable", function() {


element.spinner( "disable" ); element.spinner( "disable" );
ok( wrapper.hasClass( "ui-spinner-disabled" ), "after: wrapper has ui-spinner-disabled class" ); ok( wrapper.hasClass( "ui-spinner-disabled" ), "after: wrapper has ui-spinner-disabled class" );
ok( wrapper.hasClass( "ui-state-disabled" ), "after: wrapper has ui-state-disabled class" );
ok( !wrapper.attr( "aria-disabled" ), "after: wrapper does not have aria-disabled attr" );
ok( element.is( ":disabled"), "after: input has disabled attribute" ); ok( element.is( ":disabled"), "after: input has disabled attribute" );


simulateKeyDownUp( element, $.ui.keyCode.UP ); simulateKeyDownUp( element, $.ui.keyCode.UP );
Expand Down
18 changes: 17 additions & 1 deletion tests/unit/tabs/tabs_options.js
View file
Original file line number Original file line Diff line number Diff line change
Expand Up @@ -144,24 +144,40 @@ test( "{ collapsible: true }", function() {
}); });


test( "disabled", function() { test( "disabled", function() {
expect( 10 ); expect( 22 );


// fully enabled by default // fully enabled by default
var element = $( "#tabs1" ).tabs(); var element = $( "#tabs1" ).tabs();
disabled( element, false ); disabled( element, false );


ok( !element.tabs( "widget" ).hasClass( "ui-state-disabled" ), "after: wrapper doesn't have ui-state-disabled class" );
ok( !element.tabs( "widget" ).hasClass( "ui-tabs-disabled" ), "after: wrapper doesn't have ui-tabs-disabled class" );
ok( !element.tabs( "widget" ).attr( "aria-disabled" ), "after: wrapper doesn't have aria-disabled attr" );

// disable single tab // disable single tab
element.tabs( "option", "disabled", [ 1 ] ); element.tabs( "option", "disabled", [ 1 ] );
disabled( element, [ 1 ] ); disabled( element, [ 1 ] );


ok( !element.tabs( "widget" ).hasClass( "ui-state-disabled" ), "after: wrapper doesn't have ui-state-disabled class" );
ok( !element.tabs( "widget" ).hasClass( "ui-tabs-disabled" ), "after: wrapper doesn't have ui-tabs-disabled class" );
ok( !element.tabs( "widget" ).attr( "aria-disabled" ), "after: wrapper doesn't have aria-disabled attr" );

// disabled active tab // disabled active tab
element.tabs( "option", "disabled", [ 0, 1 ] ); element.tabs( "option", "disabled", [ 0, 1 ] );
disabled( element, [ 0, 1 ] ); disabled( element, [ 0, 1 ] );


ok( !element.tabs( "widget" ).hasClass( "ui-state-disabled" ), "after: wrapper doesn't have ui-state-disabled class" );
ok( !element.tabs( "widget" ).hasClass( "ui-tabs-disabled" ), "after: wrapper doesn't have ui-tabs-disabled class" );
ok( !element.tabs( "widget" ).attr( "aria-disabled" ), "after: wrapper doesn't have aria-disabled attr" );

// disable all tabs // disable all tabs
element.tabs( "option", "disabled", [ 0, 1, 2 ] ); element.tabs( "option", "disabled", [ 0, 1, 2 ] );
disabled( element, true ); disabled( element, true );


ok( !element.tabs( "widget" ).hasClass( "ui-state-disabled" ), "after: wrapper doesn't have ui-state-disabled class" );
ok( !element.tabs( "widget" ).hasClass( "ui-tabs-disabled" ), "after: wrapper doesn't have ui-tabs-disabled class" );
ok( !element.tabs( "widget" ).attr( "aria-disabled" ), "after: wrapper doesn't have aria-disabled attr" );

// enable all tabs // enable all tabs
element.tabs( "option", "disabled", [] ); element.tabs( "option", "disabled", [] );
disabled( element, false ); disabled( element, false );
Expand Down
Loading

2 comments on commit 4d67f4f

@jzaefferer
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Are we still planning to release 1.10.2 from master? I don't think this change should go into a patch release, since it breaks the disabled behaviour of custom widgets.

@scottgonzalez
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I said te same in IRC yesterday, but then didn't think about it when reviewing the PR. As soon as I woke up I thought about this again. We can just revert and then revert the revert after the release.

Please sign in to comment.