Skip to content

Commit 1f1a730

Browse files
committed
Widget: Add tests for classes option setting
1 parent 8e36643 commit 1f1a730

File tree

1 file changed

+68
-1
lines changed

1 file changed

+68
-1
lines changed

tests/unit/widget/widget_core.js

Lines changed: 68 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -607,6 +607,72 @@ test( ".option() - deep option setter", function() {
607607
div.testWidget( "option", "foo.qux.newOpt", "newVal" );
608608
});
609609

610+
test( ".option() - classes setter", function(){
611+
expect( 6 );
612+
$.widget( "ui.testWidget", {
613+
options: {
614+
classes: {
615+
"test-span": "",
616+
"test-wrapper": "self-wrapper",
617+
"test-self": "self-class self-class-2"
618+
}
619+
},
620+
defaultElement: "<div>",
621+
_elementsFromClassKey: function( classKey ) {
622+
switch ( classKey ) {
623+
case "test-span":
624+
return this.span;
625+
case "test-wrapper":
626+
return this.widget();
627+
default:
628+
return this._superApply( arguments );
629+
}
630+
},
631+
_create: function() {
632+
this.span = $( "<span>" )
633+
.addClass( this._classes( "test-span" ) )
634+
.appendTo( this.element );
635+
636+
this.element.wrap( "<div>" );
637+
638+
this.element.addClass( this._classes( "test-self" ) );
639+
640+
this.wrapper = this.element.parent();
641+
642+
this.wrapper.addClass( this._classes( "test-wrapper" ) );
643+
644+
},
645+
widget: function() {
646+
return this.wrapper;
647+
}
648+
});
649+
650+
var testWidget = $.ui.testWidget(),
651+
currentWrapperClass = testWidget.option( "classes.test-wrapper" );
652+
653+
testWidget.option({
654+
classes: {
655+
"test-span": "self-span-new",
656+
"test-wrapper": currentWrapperClass + " self-wrapper-new",
657+
"test-self": "self-class-2"
658+
}
659+
});
660+
661+
equal( testWidget.element.is( ".test-self.self-class-2" ), true,
662+
"Removeing a class leaves the structure and other classes in value" );
663+
equal( !testWidget.element.is( ".self-class" ), true,
664+
"Removing a class from the value removes the class" );
665+
testWidget.option( "classes.test-self", "" );
666+
equal( testWidget.element.is( ".test-self" ), true,
667+
"Setting to empty value leaves structure class" );
668+
equal( !testWidget.element.is( ".self-class-2" ), true,
669+
"Setting empty value removes previous value classes" );
670+
equal( testWidget.span.is( ".test-span.self-span-new" ), true,
671+
"Adding a class to an empty value works as expected" );
672+
equal( testWidget.wrapper.is( ".test-wrapper.self-wrapper-new" ), true,
673+
"Appending a class to the current value works as expected" );
674+
});
675+
610676
test( "_classes", function(){
611677
expect( 4 );
612678
$.widget( "ui.testWidget", {
@@ -617,6 +683,7 @@ test( "_classes", function(){
617683
"test2": "class3"
618684
}
619685
},
686+
defaultElement: "<div>",
620687
_create: function() {
621688
equal( this._classes( "test" ), "test class1 class2" );
622689
equal( this._classes( "test2" ), "test2 class3" );
@@ -625,7 +692,7 @@ test( "_classes", function(){
625692
equal( this._classes( "test test2" ), "test2 class3 test class1 class2" );
626693
}
627694
});
628-
$( "<div>" ).testWidget();
695+
$.ui.testWidget();
629696
});
630697

631698
test( ".enable()", function() {

0 commit comments

Comments
 (0)