Skip to content
Permalink
Browse files

Tabs: Better handling of active option and various cleanup.

  • Loading branch information...
scottgonzalez committed Apr 5, 2011
1 parent ff84d58 commit 7aad37bfd55563a34e031309285e58468cfc2aa6
@@ -1,7 +1,7 @@
commonWidgetTests( "tabs", {
defaults: {
activate: null,
// active: null,
active: null,
beforeLoad: null,
beforeActivate: null,
collapsible: false,
@@ -1,7 +1,7 @@
commonWidgetTests( "tabs", {
defaults: {
activate: null,
// active: null,
active: null,
add: null,
ajaxOptions: null,
beforeLoad: null,
@@ -102,7 +102,7 @@ test('spinner', function() {
});

test('selected', function() {
expect(11);
expect(10);

el = $('#tabs1').tabs();
equals(el.tabs('option', 'selected'), 0, 'should be 0 by default');
@@ -127,10 +127,6 @@ test('selected', function() {
equals( $('li.ui-tabs-selected', el).length, 0, 'no tab should be selected' );
equals( $('div:hidden', '#tabs1').length, 3, 'all panels should be hidden' );

el.tabs('destroy');
el.tabs({ selected: null });
equals(el.tabs('option', 'selected'), -1, 'should be -1 for all tabs unselected with value null (deprecated)');

el.tabs('destroy');
el.tabs({ selected: 1 });
equals(el.tabs('option', 'selected'), 1, 'should be specified tab');
@@ -6,66 +6,65 @@ test( "beforeActivate", function() {
expect( 38 );

var element = $( "#tabs1" ).tabs({
// TODO: should be false
active: -1,
active: false,
collapsible: true
}),
tabs = element.find( ".ui-tabs-nav a" ),
panels = element.find( ".ui-tabs-panel" );

// from collapsed
element.one( "tabsbeforeactivate", function( event, ui ) {
ok( !( "originalEvent" in event ) );
equals( ui.oldTab.size(), 0 );
equals( ui.oldPanel.size(), 0 );
equals( ui.newTab.size(), 1 );
strictEqual( ui.newTab[ 0 ], tabs[ 0 ] );
equals( ui.newPanel.size(), 1 );
strictEqual( ui.newPanel[ 0 ], panels[ 0 ] );
ok( !( "originalEvent" in event ), "originalEvent" );
equals( ui.oldTab.size(), 0, "oldTab size" );
equals( ui.oldPanel.size(), 0, "oldPanel size" );
equals( ui.newTab.size(), 1, "newTab size" );
strictEqual( ui.newTab[ 0 ], tabs[ 0 ], "newTab" );
equals( ui.newPanel.size(), 1, "newPanel size" );
strictEqual( ui.newPanel[ 0 ], panels[ 0 ], "newPanel" );
tabs_state( element, 0, 0, 0 );
});
element.tabs( "option", "active", 0 );
tabs_state( element, 1, 0, 0 );

// switching tabs
element.one( "tabsbeforeactivate", function( event, ui ) {
equals( event.originalEvent.type, "click" );
equals( ui.oldTab.size(), 1 );
strictEqual( ui.oldTab[ 0 ], tabs[ 0 ] );
equals( ui.oldPanel.size(), 1 );
strictEqual( ui.oldPanel[ 0 ], panels[ 0 ] );
equals( ui.newTab.size(), 1 );
strictEqual( ui.newTab[ 0 ], tabs[ 1 ] );
equals( ui.newPanel.size(), 1 );
strictEqual( ui.newPanel[ 0 ], panels[ 1 ] );
equals( event.originalEvent.type, "click", "originalEvent" );
equals( ui.oldTab.size(), 1, "oldTab size" );
strictEqual( ui.oldTab[ 0 ], tabs[ 0 ], "oldTab" );
equals( ui.oldPanel.size(), 1, "oldPanel size" );
strictEqual( ui.oldPanel[ 0 ], panels[ 0 ], "oldPanel" );
equals( ui.newTab.size(), 1, "newTab size" );
strictEqual( ui.newTab[ 0 ], tabs[ 1 ], "newTab" );
equals( ui.newPanel.size(), 1, "newPanel size" );
strictEqual( ui.newPanel[ 0 ], panels[ 1 ], "newPanel" );
tabs_state( element, 1, 0, 0 );
});
tabs.eq( 1 ).click();
tabs_state( element, 0, 1, 0 );

// collapsing
element.one( "tabsbeforeactivate", function( event, ui ) {
ok( !( "originalEvent" in event ) );
equals( ui.oldTab.size(), 1 );
strictEqual( ui.oldTab[ 0 ], tabs[ 1 ] );
equals( ui.oldPanel.size(), 1 );
strictEqual( ui.oldPanel[ 0 ], panels[ 1 ] );
equals( ui.newTab.size(), 0 );
equals( ui.newPanel.size(), 0 );
ok( !( "originalEvent" in event ), "originalEvent" );
equals( ui.oldTab.size(), 1, "oldTab size" );
strictEqual( ui.oldTab[ 0 ], tabs[ 1 ], "oldTab" );
equals( ui.oldPanel.size(), 1, "oldPanel size" );
strictEqual( ui.oldPanel[ 0 ], panels[ 1 ], "oldPanel" );
equals( ui.newTab.size(), 0, "newTab size" );
equals( ui.newPanel.size(), 0, "newPanel size" );
tabs_state( element, 0, 1, 0 );
});
element.tabs( "option", "active", false );
tabs_state( element, 0, 0, 0 );

// prevent activation
element.one( "tabsbeforeactivate", function( event, ui ) {
ok( !( "originalEvent" in event ) );
equals( ui.oldTab.size(), 0 );
equals( ui.oldPanel.size(), 0 );
equals( ui.newTab.size(), 1 );
strictEqual( ui.newTab[ 0 ], tabs[ 1 ] );
equals( ui.newPanel.size(), 1 );
strictEqual( ui.newPanel[ 0 ], panels[ 1 ] );
ok( !( "originalEvent" in event ), "originalEvent" );
equals( ui.oldTab.size(), 0, "oldTab size" );
equals( ui.oldPanel.size(), 0, "oldTab" );
equals( ui.newTab.size(), 1, "newTab size" );
strictEqual( ui.newTab[ 0 ], tabs[ 1 ], "newTab" );
equals( ui.newPanel.size(), 1, "newPanel size" );
strictEqual( ui.newPanel[ 0 ], panels[ 1 ], "newPanel" );
event.preventDefault();
tabs_state( element, 0, 0, 0 );
});
@@ -77,64 +76,63 @@ test( "activate", function() {
expect( 30 );

var element = $( "#tabs1" ).tabs({
// TODO: should be false
active: -1,
active: false,
collapsible: true
}),
tabs = element.find( ".ui-tabs-nav a" ),
panels = element.find( ".ui-tabs-panel" );

// from collapsed
element.one( "tabsactivate", function( event, ui ) {
ok( !( "originalEvent" in event ) );
equals( ui.oldTab.size(), 0 );
equals( ui.oldPanel.size(), 0 );
equals( ui.newTab.size(), 1 );
strictEqual( ui.newTab[ 0 ], tabs[ 0 ] );
equals( ui.newPanel.size(), 1 );
strictEqual( ui.newPanel[ 0 ], panels[ 0 ] );
ok( !( "originalEvent" in event ), "originalEvent" );
equals( ui.oldTab.size(), 0, "oldTab size" );
equals( ui.oldPanel.size(), 0, "oldPanel size" );
equals( ui.newTab.size(), 1, "newTab size" );
strictEqual( ui.newTab[ 0 ], tabs[ 0 ], "newTab" );
equals( ui.newPanel.size(), 1, "newPanel size" );
strictEqual( ui.newPanel[ 0 ], panels[ 0 ], "newPanel" );
tabs_state( element, 1, 0, 0 );
});
element.tabs( "option", "active", 0 );
tabs_state( element, 1, 0, 0 );

// switching tabs
element.one( "tabsactivate", function( event, ui ) {
equals( event.originalEvent.type, "click" );
equals( ui.oldTab.size(), 1 );
strictEqual( ui.oldTab[ 0 ], tabs[ 0 ] );
equals( ui.oldPanel.size(), 1 );
strictEqual( ui.oldPanel[ 0 ], panels[ 0 ] );
equals( ui.newTab.size(), 1 );
strictEqual( ui.newTab[ 0 ], tabs[ 1 ] );
equals( ui.newPanel.size(), 1 );
strictEqual( ui.newPanel[ 0 ], panels[ 1 ] );
equals( event.originalEvent.type, "click", "originalEvent" );
equals( ui.oldTab.size(), 1, "oldTab size" );
strictEqual( ui.oldTab[ 0 ], tabs[ 0 ], "oldTab" );
equals( ui.oldPanel.size(), 1, "oldPanel size" );
strictEqual( ui.oldPanel[ 0 ], panels[ 0 ], "oldPanel" );
equals( ui.newTab.size(), 1, "newTab size" );
strictEqual( ui.newTab[ 0 ], tabs[ 1 ], "newTab" );
equals( ui.newPanel.size(), 1, "newPanel size" );
strictEqual( ui.newPanel[ 0 ], panels[ 1 ], "newPanel" );
tabs_state( element, 0, 1, 0 );
});
tabs.eq( 1 ).click();
tabs_state( element, 0, 1, 0 );

// collapsing
element.one( "tabsactivate", function( event, ui ) {
ok( !( "originalEvent" in event ) );
equals( ui.oldTab.size(), 1 );
strictEqual( ui.oldTab[ 0 ], tabs[ 1 ] );
equals( ui.oldPanel.size(), 1 );
strictEqual( ui.oldPanel[ 0 ], panels[ 1 ] );
equals( ui.newTab.size(), 0 );
equals( ui.newPanel.size(), 0 );
ok( !( "originalEvent" in event ), "originalEvent" );
equals( ui.oldTab.size(), 1, "oldTab size" );
strictEqual( ui.oldTab[ 0 ], tabs[ 1 ], "oldTab" );
equals( ui.oldPanel.size(), 1, "oldPanel size" );
strictEqual( ui.oldPanel[ 0 ], panels[ 1 ], "oldPanel" );
equals( ui.newTab.size(), 0, "newTab size" );
equals( ui.newPanel.size(), 0, "newPanel size" );
tabs_state( element, 0, 0, 0 );
});
element.tabs( "option", "active", false );
tabs_state( element, 0, 0, 0 );

// prevent activation
element.one( "tabsbeforeactivate", function( event ) {
ok( true );
ok( true, "tabsbeforeactivate" );
event.preventDefault();
});
element.one( "tabsactivate", function() {
ok( false );
ok( false, "tabsactivate" );
});
element.tabs( "option", "active", 1 );
});
@@ -171,7 +169,7 @@ test( "beforeLoad", function() {
tabs_state( element, 0, 0, 1, 0 );
equals( panel.html(), "", "panel html after" );

// click
// click, change panel content
element.one( "tabsbeforeload", function( event, ui ) {
tab = element.find( ".ui-tabs-nav a" ).eq( 3 );
panelId = tab.attr( "aria-controls" );
@@ -193,8 +191,8 @@ test( "beforeLoad", function() {
equals( panel.html(), "<p>testing</p>", "panel html after" );
});

test('load', function() {
ok(false, "missing test - untested code is broken code.");
test( "load", function() {
ok( false, "missing test - untested code is broken code." );
});

})(jQuery);
}( jQuery ) );
@@ -136,7 +136,7 @@ test('refresh', function() {
var el = $('<div id="tabs"><ul></ul></div>').tabs(),
ul = el.find('ul');

equals(el.tabs('option', 'active'), -1, 'Initially empty, no active tab');
equals(el.tabs('option', 'active'), false, 'Initially empty, no active tab');

ul.append('<li><a href="data/test.html">Test 1</a></li>');
el.tabs('refresh');
@@ -53,14 +53,14 @@ test('active', function() {
equals(el.tabs('option', 'active'), 0, 'should be 0 by default');

el.tabs('destroy');
el.tabs({ active: -1 });
equals(el.tabs('option', 'active'), -1, 'should be -1 for all tabs deactive');
el.tabs({ active: false });
equals(el.tabs('option', 'active'), false, 'should be false for all tabs deactive');
equals( $('li.ui-tabs-selected', el).length, 0, 'no tab should be active' );
equals( $('div:hidden', '#tabs1').length, 3, 'all panels should be hidden' );

el.tabs('destroy');
el.tabs({ active: null });
equals(el.tabs('option', 'active'), -1, 'should be -1 for all tabs deactive with value null (deprecated)');
equals(el.tabs('option', 'active'), false, 'should be false for all tabs deactive with value null (deprecated)');

el.tabs('destroy');
el.tabs({ active: 1 });

0 comments on commit 7aad37b

Please sign in to comment.
You can’t perform that action at this time.