UI Tabs: unselect class was attached inconsistently

tests/tabs.js

@@ -2,12 +2,8 @@
  * tabs unit tests
  */
 (function($) {
-//
-// Tabs Test Helper Functions
-//
 
 
-// Tabs Tests
 module('tabs');
 
 test('init', function() {
@@ -17,7 +13,7 @@ test('init', function() {
 	ok(true, '.tabs() called on element');
 	
 	el.tabs('destroy').tabs({ selected: 1 });
-	equals( el.data('selected.tabs'), 1 );
+	equals( el.data('selected.tabs'), 1, 'selected.tabs set' );
 	equals( $('li', el).index( $('li.ui-tabs-selected', el) ), 1, 'second tab active');
 	equals( $('div', '#tabs1').index( $('div.ui-tabs-hide', '#tabs1') ), 0, 'first panel should be hidden' );
 	
@@ -100,6 +96,49 @@ test('url', function() {
 	
 });
 
+
+module('options');
+
+test('select: null', function() {
+	expect(3);
+	
+	var el = $('#tabs1 > ul');
+	
+	el.tabs({ selected: null });
+	equals( el.data('selected.tabs'), null, 'option set' );
+	equals( $('li.ui-tabs-selected', el).length, 0, 'all tabs should be unselected' );
+	equals( $('div.ui-tabs-hide', '#tabs1').length, 3, 'all panels should be hidden' );
+	
+	// TODO select == null with cookie
+	// TODO select == null with select method
+	
+});
+
+test('unselect: true', function() {
+	expect(7);
+	
+	var el = $('#tabs1 > ul');
+	
+	el.tabs({ unselect: true });
+	equals( el.data('unselect.tabs'), true, 'option set' );
+	equals( $('li.ui-tabs-unselect', el).length, 1, 'class "ui-tabs-unselect" attached once');
+	equals( $('li', el).index( $('li.ui-tabs-unselect', el) ), 0, 'class "ui-tabs-unselect" attached to first tab');
+	
+	el.tabs('select', 1);
+	equals( $('li.ui-tabs-unselect', el).length, 1, 'class "ui-tabs-unselect" attached once');
+	equals( $('li', el).index( $('li.ui-tabs-unselect', el) ), 1, 'class "ui-tabs-unselect" attached to second tab');
+	
+	el.tabs('select', 1);
+	equals( $('li.ui-tabs-unselect', el).length, 0, 'class "ui-tabs-unselect" not attached');
+	// wait a bit for the fake animation...
+	stop();
+	setTimeout(function() {
+		equals( $('div.ui-tabs-hide', '#tabs1').length, 3, 'all panels should be hidden' );
+		start();
+	}, 100);
+
+});
+
 test('cookie', function() {
 	expect(5);
 	
@@ -130,8 +169,10 @@ test('cookie', function() {
 	
 });
 
-// #???
+
-test('id containing colon', function() {
+module('tickets');
+
+test('id containing colon #???', function() {
 	expect(4);
 
 	var el = $('#tabs2 > ul').tabs();

ui/ui.tabs.js

@@ -68,10 +68,10 @@ $.widget("ui.tabs", {
 				var $panel = $('#' + id);
 				if (!$panel.length) {
 					$panel = $(o.panelTemplate).attr('id', id).addClass(o.panelClass)
-						.insertAfter( self.$panels[i - 1] || self.element );
+						.insertAfter(self.$panels[i - 1] || self.element);
 					$panel.data('destroy.tabs', true);
 				}
-				self.$panels = self.$panels.add( $panel );
+				self.$panels = self.$panels.add($panel);
 			}
 			// invalid tab href
 			else
@@ -83,10 +83,7 @@ $.widget("ui.tabs", {
 			
 			// attach necessary classes for styling if not present
 			this.element.addClass(o.navClass);
-			this.$panels.each(function() {
+			this.$panels.addClass(o.panelClass);
-				var $this = $(this);
-				$this.addClass(o.panelClass);
-			});
 			
 			// Selected tab
 			// use "selected" option or try to retrieve:
@@ -136,7 +133,9 @@ $.widget("ui.tabs", {
 			this.$lis.removeClass(o.selectedClass);
 			if (o.selected !== null) {
 				this.$panels.eq(o.selected).show().removeClass(o.hideClass); // use show and remove class to show in any case no matter how it has been hidden before
-				this.$lis.eq(o.selected).addClass(o.selectedClass);
+				var classes = [o.selectedClass];
+				if (o.unselect) classes.push(o.unselectClass);
+				this.$lis.eq(o.selected).addClass(classes.join(' '));
 				
 				// seems to be expected behavior that the show callback is fired
 				var onShow = function() {
@@ -219,8 +218,9 @@ $.widget("ui.tabs", {
 			/*if (o.bookmarkable && trueClick) { // add to history only if true click occured, not a triggered click
 				$.ajaxHistory.update(clicked.hash);
 			}*/
-			$li.addClass(o.selectedClass)
+			var classes = [o.selectedClass];
-				.siblings().removeClass(o.selectedClass);
+			if (o.unselect) classes.push(o.unselectClass);
+			$li.addClass(classes.join(' ')).siblings().removeClass(classes.join(' '));
 			hideTab(clicked, $hide, $show);
 		}
 		
@@ -251,7 +251,7 @@ $.widget("ui.tabs", {
 			if (o.unselect) {
 				if ($li.hasClass(o.selectedClass)) {
 					self.options.selected = null;
-					$li.removeClass(o.selectedClass);
+					$li.removeClass([o.selectedClass, o.unselectClass].join(' '));
 					self.$panels.stop();
 					hideTab(this, $hide);
 					this.blur();
@@ -260,7 +260,7 @@ $.widget("ui.tabs", {
 					self.$panels.stop();
 					var a = this;
 					self.load(self.$tabs.index(this), function() {
-						$li.addClass(o.selectedClass).addClass(o.unselectClass);
+						$li.addClass([o.selectedClass, o.unselectClass].join(' '));
 						showTab(a, $show);
 					});
 					this.blur();