diff --git a/tests/unit/controlgroup/controlgroup.html b/tests/unit/controlgroup/controlgroup.html index d90bf607c..db1d47808 100644 --- a/tests/unit/controlgroup/controlgroup.html +++ b/tests/unit/controlgroup/controlgroup.html @@ -68,6 +68,22 @@
+
+ +
+
+ + +
diff --git a/tests/unit/controlgroup/core.js b/tests/unit/controlgroup/core.js index dff3b1b12..789eefc90 100644 --- a/tests/unit/controlgroup/core.js +++ b/tests/unit/controlgroup/core.js @@ -160,4 +160,41 @@ QUnit.test( "Single controlgroup button - vertical", function( assert ) { " ui-corner-tr ui-corner-tl ui-corner-bl ui corner-br" ); } ); +QUnit.module( "Controlgroup: Non-empty class key", { + setup: function() { + this.classKey = $.ui.selectmenu.prototype.options.classes[ "ui-selectmenu-button-closed" ]; + $.ui.selectmenu.prototype.options.classes[ "ui-selectmenu-button-closed" ] = + "something-custom"; + }, + teardown: function() { + $.ui.selectmenu.prototype.options.classes[ "ui-selectmenu-button-closed" ] = this.classKey; + } +} ); + +QUnit.test( "Controlgroup instantiates child widgets with correct options", function( assert ) { + assert.expect( 1 ); + + $( ".controlgroup-class-key-init" ).controlgroup(); + + assert.hasClasses( $( "#class-key-init-child" ).next(), "something-custom" ); +} ); + +QUnit.test( "Controlgroup correctly assigns child widget classes options key", function( assert ) { + assert.expect( 2 ); + + $( ".controlgroup-class-key-dupe" ).controlgroup(); + + assert.strictEqual( + ( $( "#class-key-dupe-first" ) + .selectmenu( "option", "classes.ui-selectmenu-button-closed" ) + .match( /something-custom/g ) || [] ).length, 1, + "Class 'something-custom' appears exactly once in the first widget's class key value" ); + + assert.strictEqual( + ( $( "#class-key-dupe-second" ) + .selectmenu( "option", "classes.ui-selectmenu-button-closed" ) + .match( /something-custom/g ) || [] ).length, 1, + "Class 'something-custom' appears exactly once in the second widget's class key value" ); +} ); + } ); diff --git a/ui/widgets/controlgroup.js b/ui/widgets/controlgroup.js index 5d2bbba83..071aef658 100644 --- a/ui/widgets/controlgroup.js +++ b/ui/widgets/controlgroup.js @@ -118,14 +118,25 @@ return $.widget( "ui.controlgroup", { var element = $( this ); var instance = element[ widget ]( "instance" ); + // We need to clone the default options for this type of widget to avoid + // polluting the variable options which has a wider scope than a single widget. + var instanceOptions = $.widget.extend( {}, options ); + // If the button is the child of a spinner ignore it + // TODO: Find a more generic solution if ( widget === "button" && element.parent( ".ui-spinner" ).length ) { return; } - if ( instance ) { - options.classes = that._resolveClassesValues( options.classes, instance ); + + // Create the widget if it doesn't exist + if ( !instance ) { + instance = element[ widget ]()[ widget ]( "instance" ); } - element[ widget ]( options ); + if ( instance ) { + instanceOptions.classes = + that._resolveClassesValues( instanceOptions.classes, instance ); + } + element[ widget ]( instanceOptions ); // Store an instance of the controlgroup to be able to reference // from the outermost element for changing options and refresh @@ -218,12 +229,13 @@ return $.widget( "ui.controlgroup", { }, _resolveClassesValues: function( classes, instance ) { + var result = {}; $.each( classes, function( key ) { var current = instance.options.classes[ key ] || ""; current = current.replace( controlgroupCornerRegex, "" ).trim(); - classes[ key ] = ( current + " " + classes[ key ] ).replace( /\s+/g, " " ); + result[ key ] = ( current + " " + classes[ key ] ).replace( /\s+/g, " " ); } ); - return classes; + return result; }, _setOption: function( key, value ) {