From bfc1d6e34953d3ec4bc5723553a6836243370caf Mon Sep 17 00:00:00 2001 From: Daniel DeGroff Date: Wed, 11 Dec 2013 22:53:48 -0600 Subject: [PATCH 1/8] Button: remove ui-state-active on button disable. Fixed #9602 - ui-state-active class remains after disabling a button --- tests/unit/button/button_methods.js | 11 +++++++++++ ui/jquery.ui.button.js | 2 +- 2 files changed, 12 insertions(+), 1 deletion(-) diff --git a/tests/unit/button/button_methods.js b/tests/unit/button/button_methods.js index 467938f00f5..f746d521322 100644 --- a/tests/unit/button/button_methods.js +++ b/tests/unit/button/button_methods.js @@ -49,4 +49,15 @@ test( "refresh: Ensure disabled state is preserved correctly.", function() { ok( !element.button( "option", "disabled" ), "Changing a radio button's disabled property should update the state after refresh."); }); +test( "ui-state-active should always be removed when setting disabled true", function() { + expect( 2 ); + var element = $( "" ).button(); + + element.trigger( "mousedown" ); + ok( element.hasClass( "ui-state-active" ), "On mousedown event button adds ui-state-active class" ); + + element.button("option", "disabled", true ); + ok( !element.hasClass( "ui-state-active" ), "Disabling button removes ui-state-active class" ); +}); + })(jQuery); diff --git a/ui/jquery.ui.button.js b/ui/jquery.ui.button.js index 6bde7863fd8..e066e2d2a44 100644 --- a/ui/jquery.ui.button.js +++ b/ui/jquery.ui.button.js @@ -250,7 +250,7 @@ $.widget( "ui.button", { this.widget().toggleClass( "ui-state-disabled", !!value ); this.element.prop( "disabled", !!value ); if ( value ) { - this.buttonElement.removeClass( "ui-state-focus" ); + this.buttonElement.removeClass( "ui-state-focus ui-state-active" ); } return; } From a7fdf1935ecba68014bfbea16777a3959f383421 Mon Sep 17 00:00:00 2001 From: Daniel DeGroff Date: Sun, 15 Dec 2013 16:35:39 -0600 Subject: [PATCH 2/8] Button: remove ui-state-active on button disable. Account for checkbox and radio. --- tests/unit/button/button_methods.js | 28 ++++++++++++++++++++-------- ui/jquery.ui.button.js | 6 +++++- 2 files changed, 25 insertions(+), 9 deletions(-) diff --git a/tests/unit/button/button_methods.js b/tests/unit/button/button_methods.js index f746d521322..35c05c5cb37 100644 --- a/tests/unit/button/button_methods.js +++ b/tests/unit/button/button_methods.js @@ -50,14 +50,26 @@ test( "refresh: Ensure disabled state is preserved correctly.", function() { }); test( "ui-state-active should always be removed when setting disabled true", function() { - expect( 2 ); - var element = $( "" ).button(); - - element.trigger( "mousedown" ); - ok( element.hasClass( "ui-state-active" ), "On mousedown event button adds ui-state-active class" ); - - element.button("option", "disabled", true ); - ok( !element.hasClass( "ui-state-active" ), "Disabling button removes ui-state-active class" ); + expect( 8 ); + var elements = [ + $( "" ).button(), + $( "" ).button(), + $( "" ).button(), + $( "" ).button() + ]; + + $.each( elements, function( index, element ) { + + element.trigger( "mousedown" ); + ok( element.hasClass( "ui-state-active" ), "On mousedown, element has ui-state-active class" ); + + element.button("option", "disabled", true ); + if ( element.is( "input:button, button" ) ) { + ok( !element.hasClass( "ui-state-active" ), "Disabled button does not have ui-state-active class" ); + } else { + ok( element.hasClass( "ui-state-active" ), "Disabled radio, or checkbox has ui-state-active class" ); + } + }); }); })(jQuery); diff --git a/ui/jquery.ui.button.js b/ui/jquery.ui.button.js index e066e2d2a44..1b2fabe6682 100644 --- a/ui/jquery.ui.button.js +++ b/ui/jquery.ui.button.js @@ -250,7 +250,11 @@ $.widget( "ui.button", { this.widget().toggleClass( "ui-state-disabled", !!value ); this.element.prop( "disabled", !!value ); if ( value ) { - this.buttonElement.removeClass( "ui-state-focus ui-state-active" ); + if ( this.buttonElement.is( "input:button, button" ) ) { + this.buttonElement.removeClass( "ui-state-focus ui-state-active" ); + } else { + this.buttonElement.removeClass( "ui-state-focus" ); + } } return; } From 92a22be34bb830f3728e43cfc36248f7bcdb5ece Mon Sep 17 00:00:00 2001 From: Daniel DeGroff Date: Sun, 15 Dec 2013 21:21:18 -0600 Subject: [PATCH 3/8] White space --- tests/unit/button/button_methods.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tests/unit/button/button_methods.js b/tests/unit/button/button_methods.js index 35c05c5cb37..f56f439fcb8 100644 --- a/tests/unit/button/button_methods.js +++ b/tests/unit/button/button_methods.js @@ -63,7 +63,7 @@ test( "ui-state-active should always be removed when setting disabled true", fun element.trigger( "mousedown" ); ok( element.hasClass( "ui-state-active" ), "On mousedown, element has ui-state-active class" ); - element.button("option", "disabled", true ); + element.button( "option", "disabled", true ); if ( element.is( "input:button, button" ) ) { ok( !element.hasClass( "ui-state-active" ), "Disabled button does not have ui-state-active class" ); } else { From 39558fc993b63a12dd5472fd25899c9b3f1023c5 Mon Sep 17 00:00:00 2001 From: Daniel DeGroff Date: Thu, 26 Dec 2013 23:23:16 -0600 Subject: [PATCH 4/8] Button: remove ui-state-active on button disable. Fixed #9602 - ui-state-active remains after disable Refactor unit tests after flipping logic to specifically look for radio and checkbox, also added div, and a elements for unit test. --- tests/unit/button/button_methods.js | 43 +++++++++++++++++++---------- ui/jquery.ui.button.js | 6 ++-- 2 files changed, 32 insertions(+), 17 deletions(-) diff --git a/tests/unit/button/button_methods.js b/tests/unit/button/button_methods.js index f56f439fcb8..27c967ac123 100644 --- a/tests/unit/button/button_methods.js +++ b/tests/unit/button/button_methods.js @@ -49,25 +49,40 @@ test( "refresh: Ensure disabled state is preserved correctly.", function() { ok( !element.button( "option", "disabled" ), "Changing a radio button's disabled property should update the state after refresh."); }); -test( "ui-state-active should always be removed when setting disabled true", function() { - expect( 8 ); +test( "ui-state-active should be removed when button is disabled except for :checkbox and :radio", function() { + expect( 12 ); var elements = [ - $( "" ).button(), - $( "" ).button(), - $( "" ).button(), - $( "" ).button() - ]; - - $.each( elements, function( index, element ) { + $( "" ), + $( "" ), + $( "" ), + $( "
" ), + $( "" ), + $( "" ) + ]; + + $.each( elements, function() { + + var element = $( this ).first(), + buttonElement = element.is( ":checkbox, :radio" ) ? element.next() : element, + elementType = element.prop( "tagName" ).toLowerCase(); + + if (elementType === "input" ) { + elementType += ":" + element.attr( "type" ); + } + element.button(); element.trigger( "mousedown" ); - ok( element.hasClass( "ui-state-active" ), "On mousedown, element has ui-state-active class" ); - element.button( "option", "disabled", true ); - if ( element.is( "input:button, button" ) ) { - ok( !element.hasClass( "ui-state-active" ), "Disabled button does not have ui-state-active class" ); + ok( buttonElement.hasClass( "ui-state-active" ), + "[" + elementType + "] has ui-state-active class after mousedown event." ); + + element.button( "disable" ); + if ( element.is( ":checkbox, :radio" ) ) { + ok( buttonElement.hasClass( "ui-state-active" ), + "Disabled [" + elementType + "] has preserved ui-state-active class." ); } else { - ok( element.hasClass( "ui-state-active" ), "Disabled radio, or checkbox has ui-state-active class" ); + ok( !buttonElement.hasClass( "ui-state-active" ), + "Disabled [" + elementType + "] has removed ui-state-active class." ); } }); }); diff --git a/ui/jquery.ui.button.js b/ui/jquery.ui.button.js index 1b2fabe6682..28850e873e1 100644 --- a/ui/jquery.ui.button.js +++ b/ui/jquery.ui.button.js @@ -250,10 +250,10 @@ $.widget( "ui.button", { this.widget().toggleClass( "ui-state-disabled", !!value ); this.element.prop( "disabled", !!value ); if ( value ) { - if ( this.buttonElement.is( "input:button, button" ) ) { - this.buttonElement.removeClass( "ui-state-focus ui-state-active" ); - } else { + if ( this.type === "checkbox" || this.type === "radio" ) { this.buttonElement.removeClass( "ui-state-focus" ); + } else { + this.buttonElement.removeClass( "ui-state-focus ui-state-active" ); } } return; From 6cc0ef4e37eaaeac62e6dd8921320a3155f7ea6e Mon Sep 17 00:00:00 2001 From: Daniel DeGroff Date: Tue, 21 Jan 2014 23:05:46 -0600 Subject: [PATCH 5/8] Button: remove ui-state-active on button disable. Fixed #9602 - ui-state-active class remains after disabling a button Few small formatting changes based upon comments. Moved unit test to button_options.js from button_methods.js. --- tests/unit/button/button_methods.js | 38 ---------------------------- tests/unit/button/button_options.js | 39 +++++++++++++++++++++++++++++ 2 files changed, 39 insertions(+), 38 deletions(-) diff --git a/tests/unit/button/button_methods.js b/tests/unit/button/button_methods.js index 27c967ac123..467938f00f5 100644 --- a/tests/unit/button/button_methods.js +++ b/tests/unit/button/button_methods.js @@ -49,42 +49,4 @@ test( "refresh: Ensure disabled state is preserved correctly.", function() { ok( !element.button( "option", "disabled" ), "Changing a radio button's disabled property should update the state after refresh."); }); -test( "ui-state-active should be removed when button is disabled except for :checkbox and :radio", function() { - expect( 12 ); - var elements = [ - $( "" ), - $( "" ), - $( "" ), - $( "
" ), - $( "" ), - $( "" ) - ]; - - $.each( elements, function() { - - var element = $( this ).first(), - buttonElement = element.is( ":checkbox, :radio" ) ? element.next() : element, - elementType = element.prop( "tagName" ).toLowerCase(); - - if (elementType === "input" ) { - elementType += ":" + element.attr( "type" ); - } - - element.button(); - element.trigger( "mousedown" ); - - ok( buttonElement.hasClass( "ui-state-active" ), - "[" + elementType + "] has ui-state-active class after mousedown event." ); - - element.button( "disable" ); - if ( element.is( ":checkbox, :radio" ) ) { - ok( buttonElement.hasClass( "ui-state-active" ), - "Disabled [" + elementType + "] has preserved ui-state-active class." ); - } else { - ok( !buttonElement.hasClass( "ui-state-active" ), - "Disabled [" + elementType + "] has removed ui-state-active class." ); - } - }); -}); - })(jQuery); diff --git a/tests/unit/button/button_options.js b/tests/unit/button/button_options.js index 124a8699f6f..4f341136c86 100644 --- a/tests/unit/button/button_options.js +++ b/tests/unit/button/button_options.js @@ -38,6 +38,45 @@ test("disabled, null", function() { deepEqual(true, $("#radio02").prop("disabled"), "element is not disabled"); }); +test( "disabled, ui-state-active is removed unless checkbox or radio", function() { + expect( 12 ); + var elements = [ + $( "" ), + $( "" ), + $( "" ), + $( "
" ), + $( "" ), + $( "" ) + ]; + + $.each( elements, function() { + + var element = $( this ).first(), + isRadioOrCheckbox = element.is( "[type=checkbox], [type=radio]" ), + buttonElement = isRadioOrCheckbox ? element.next() : element, + elementType = element.prop( "tagName" ).toLowerCase(); + + if ( elementType === "input" ) { + elementType += ":" + element.attr( "type" ); + } + + element.button(); + element.trigger( "mousedown" ); + + ok( buttonElement.hasClass( "ui-state-active" ), + "[" + elementType + "] has ui-state-active class after mousedown." ); + + element.button( "disable" ); + if ( isRadioOrCheckbox ) { + ok( buttonElement.hasClass( "ui-state-active" ), + "Disabled [" + elementType + "] has ui-state-active class." ); + } else { + ok( !buttonElement.hasClass( "ui-state-active" ), + "Disabled [" + elementType + "] does not have ui-state-active class." ); + } + }); +}); + test("text false without icon", function() { expect( 1 ); $("#button").button({ From 8a9d4e9db5cd922d1053a8b08af52b87ae5def61 Mon Sep 17 00:00:00 2001 From: Daniel DeGroff Date: Fri, 24 Jan 2014 22:48:32 -0600 Subject: [PATCH 6/8] Button: remove ui-state-active on button disable. Fixed #9602 - ui-state-active class remains after disabling a button MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit use .button( “widget” ) instead of checking for radio or checkbox. --- tests/unit/button/button_options.js | 12 ++++-------- 1 file changed, 4 insertions(+), 8 deletions(-) diff --git a/tests/unit/button/button_options.js b/tests/unit/button/button_options.js index 4f341136c86..1ec6448f802 100644 --- a/tests/unit/button/button_options.js +++ b/tests/unit/button/button_options.js @@ -50,24 +50,20 @@ test( "disabled, ui-state-active is removed unless checkbox or radio", function( ]; $.each( elements, function() { - - var element = $( this ).first(), - isRadioOrCheckbox = element.is( "[type=checkbox], [type=radio]" ), - buttonElement = isRadioOrCheckbox ? element.next() : element, + var element = $( this ).first().button(), + buttonElement = element.button( "widget" ), elementType = element.prop( "tagName" ).toLowerCase(); - if ( elementType === "input" ) { + if ( element.is( "input") ) { elementType += ":" + element.attr( "type" ); } - element.button(); element.trigger( "mousedown" ); - ok( buttonElement.hasClass( "ui-state-active" ), "[" + elementType + "] has ui-state-active class after mousedown." ); element.button( "disable" ); - if ( isRadioOrCheckbox ) { + if ( element.is( "[type=checkbox], [type=radio]" ) ) { ok( buttonElement.hasClass( "ui-state-active" ), "Disabled [" + elementType + "] has ui-state-active class." ); } else { From 4e1a6cf2690355488f0628247e6d06b48c599406 Mon Sep 17 00:00:00 2001 From: Daniel DeGroff Date: Fri, 24 Jan 2014 22:52:35 -0600 Subject: [PATCH 7/8] Add white space --- tests/unit/button/button_options.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tests/unit/button/button_options.js b/tests/unit/button/button_options.js index 1ec6448f802..a50bb8f047d 100644 --- a/tests/unit/button/button_options.js +++ b/tests/unit/button/button_options.js @@ -54,7 +54,7 @@ test( "disabled, ui-state-active is removed unless checkbox or radio", function( buttonElement = element.button( "widget" ), elementType = element.prop( "tagName" ).toLowerCase(); - if ( element.is( "input") ) { + if ( element.is( "input" ) ) { elementType += ":" + element.attr( "type" ); } From 5835a3e8e27d374e0a5c8e3597faaa719960a323 Mon Sep 17 00:00:00 2001 From: Daniel DeGroff Date: Fri, 7 Feb 2014 22:41:29 -0600 Subject: [PATCH 8/8] Autocomplete: Prefer nodeName to tagName property I saw in the style guidelines to use nodeName over tagName. https://contribute.jquery.org/style-guide/js/#dom-node-rules --- tests/unit/button/button_options.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/tests/unit/button/button_options.js b/tests/unit/button/button_options.js index a50bb8f047d..9c8ed84d3a4 100644 --- a/tests/unit/button/button_options.js +++ b/tests/unit/button/button_options.js @@ -52,7 +52,7 @@ test( "disabled, ui-state-active is removed unless checkbox or radio", function( $.each( elements, function() { var element = $( this ).first().button(), buttonElement = element.button( "widget" ), - elementType = element.prop( "tagName" ).toLowerCase(); + elementType = element.prop( "nodeName" ).toLowerCase(); if ( element.is( "input" ) ) { elementType += ":" + element.attr( "type" );