UI Tabs: unselect class was attached inconsistently

This commit is contained in:
Klaus Hartl 2008-10-04 11:25:28 +00:00
parent 50e1d9557c
commit 37f65f1947
2 changed files with 59 additions and 18 deletions

View File

@ -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();

View File

@ -83,10 +83,7 @@ $.widget("ui.tabs", {
// attach necessary classes for styling if not present
this.element.addClass(o.navClass);
this.$panels.each(function() {
var $this = $(this);
$this.addClass(o.panelClass);
});
this.$panels.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)
.siblings().removeClass(o.selectedClass);
var classes = [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();