library-mirrors/jquery-ui
1
0
Fork 0
mirror of https://github.com/jquery/jquery-ui.git synced 2024-11-21 11:04:24 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Controlgroup: Correctly handle non-empty child class key

Browse Source 
Fixes #14984
Closes gh-1713
This commit is contained in:
Gabriel Schulhof 2016-06-14 17:47:09 +03:00 committed by Alexander Schmitz
parent 23d1db5845
commit 3a9a3c7c5b
3 changed files with 70 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
tests/unit/controlgroup/controlgroup.html
View File

@ -68,6 +68,22 @@
<div class="controlgroup-single-button">
<button class="single-button">button</button>
</div>
<div class="controlgroup-class-key-init">
<select id="class-key-init-child">
<option>Option 1</option>
<option>Option 2</option>
</select>
</div>
<div class="controlgroup-class-key-dupe">
<select id="class-key-dupe-first">
<option>Option 1</option>
<option>Option 2</option>
</select>
<select id="class-key-dupe-second">
<option>Option 1</option>
<option>Option 2</option>
</select>
</div>
</div>
</body>
</html>

37
tests/unit/controlgroup/core.js
View File

@ -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" );
} );
} );

22
ui/widgets/controlgroup.js
View File

@ -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 ) {