aboutsummaryrefslogtreecommitdiffstats
path: root/tests/unit/tabs/tabs_deprecated.js
diff options
context:
space:
mode:
Diffstat (limited to 'tests/unit/tabs/tabs_deprecated.js')
-rw-r--r--tests/unit/tabs/tabs_deprecated.js302
1 files changed, 207 insertions, 95 deletions
diff --git a/tests/unit/tabs/tabs_deprecated.js b/tests/unit/tabs/tabs_deprecated.js
index 90c43037c..4b50df405 100644
--- a/tests/unit/tabs/tabs_deprecated.js
+++ b/tests/unit/tabs/tabs_deprecated.js
@@ -1,6 +1,6 @@
(function( $ ) {
-module("tabs (deprecated): core");
+module( "tabs (deprecated): core" );
test( "panel ids", function() {
expect( 2 );
@@ -20,91 +20,149 @@ test( "panel ids", function() {
element.tabs( "option", "active", 2 );
});
-module("tabs (deprecated): options");
+module( "tabs (deprecated): options" );
-test('ajaxOptions', function() {
- ok(false, "missing test - untested code is broken code.");
-});
+asyncTest( "ajaxOptions", function() {
+ expect( 1 );
-test('cache', function() {
- ok(false, "missing test - untested code is broken code.");
+ var element = $( "#tabs2" ).tabs({
+ ajaxOptions: {
+ converters: {
+ "text html": function() {
+ return "test";
+ }
+ }
+ }
+ });
+ element.one( "tabsload", function( event, ui ) {
+ equals( ui.panel.html(), "test" );
+ start();
+ });
+ element.tabs( "option", "active", 2 );
});
-test('idPrefix', function() {
- ok(false, "missing test - untested code is broken code.");
-});
+asyncTest( "cache", function() {
+ expect( 5 );
-test('tabTemplate', function() {
- ok(false, "missing test - untested code is broken code.");
+ var element = $( "#tabs2" ).tabs({
+ cache: true
+ });
+ element.one( "tabsshow", function( event, ui ) {
+ tabs_state( element, 0, 0, 1, 0, 0 );
+ });
+ element.one( "tabsload", function( event, ui ) {
+ ok( true, "tabsload" );
+
+ setTimeout(function() {
+ element.tabs( "option", "active", 0 );
+ tabs_state( element, 1, 0, 0, 0, 0 );
+
+ element.one( "tabsshow", function( event, ui ) {
+ tabs_state( element, 0, 0, 1, 0, 0 );
+ });
+ element.one( "tabsload", function( event, ui ) {
+ ok( false, "should be cached" );
+ });
+ element.tabs( "option", "active", 2 );
+ start();
+ }, 1 );
+ });
+ element.tabs( "option", "active", 2 );
+ tabs_state( element, 0, 0, 1, 0, 0 );
});
-test('panelTemplate', function() {
- ok(false, "missing test - untested code is broken code.");
+test( "idPrefix", function() {
+ expect( 1 );
+
+ $( "#tabs2" )
+ .one( "tabsbeforeload", function( event, ui ) {
+ ok( /^testing-\d+$/.test( ui.panel.attr( "id" ) ), "generated id" );
+ event.preventDefault();
+ })
+ .tabs({
+ idPrefix: "testing-",
+ active: 2
+ });
});
-test('cookie', function() {
- expect(6);
+test( "tabTemplate + panelTemplate", function() {
+ // defaults are tested in the add method test
+ expect( 11 );
+
+ var element = $( "#tabs2" ).tabs({
+ tabTemplate: "<li class='customTab'><a href='http://example.com/#{href}'>#{label}</a></li>",
+ panelTemplate: "<div class='customPanel'></div>"
+ });
+ element.one( "tabsadd", function( event, ui ) {
+ var anchor = $( ui.tab );
+ equal( ui.index, 5, "ui.index" );
+ equal( anchor.text(), "New", "ui.tab" );
+ equal( anchor.attr( "href" ), "http://example.com/#new", "tab href" );
+ ok( anchor.parent().hasClass( "customTab" ), "tab custom class" );
+ equal( ui.panel.id, "new", "ui.panel" );
+ ok( $( ui.panel ).hasClass( "customPanel" ), "panel custom class" );
+ });
+ element.tabs( "add", "#new", "New" );
+ var tab = element.find( ".ui-tabs-nav li" ).last(),
+ anchor = tab.find( "a" );
+ equals( tab.text(), "New", "label" );
+ ok( tab.hasClass( "customTab" ), "tab custom class" );
+ equals( anchor.attr( "href" ), "http://example.com/#new", "href" );
+ equals( anchor.attr( "aria-controls" ), "new", "aria-controls" );
+ ok( element.find( "#new" ).hasClass( "customPanel" ), "panel custom class" );
+});
- el = $('#tabs1');
- var cookieName = 'tabs_test', cookieObj = { name: cookieName };
- $.cookie(cookieName, null); // blank state
- var cookie = function() {
- return parseInt($.cookie(cookieName), 10);
- };
+test( "cookie", function() {
+ expect( 6 );
- el.tabs({ cookie: cookieObj });
- equals(cookie(), 0, 'initial cookie value');
+ var element = $( "#tabs1" ),
+ cookieName = "tabs_test",
+ cookieObj = { name: cookieName };
+ $.cookie( cookieName, null );
+ function cookie() {
+ return parseInt( $.cookie( cookieName ), 10 );
+ }
- el.tabs('destroy');
- el.tabs({ active: 1, cookie: cookieObj });
- equals(cookie(), 1, 'initial cookie value, from active property');
+ element.tabs({ cookie: cookieObj });
+ equals( cookie(), 0, "initial cookie value" );
- el.tabs('option', 'active', 2);
- equals(cookie(), 2, 'cookie value updated after activating');
+ element.tabs( "destroy" );
+ element.tabs({ active: 1, cookie: cookieObj });
+ equals( cookie(), 1, "initial cookie value, from active property" );
- el.tabs('destroy');
- $.cookie(cookieName, 1);
- el.tabs({ cookie: cookieObj });
- equals(cookie(), 1, 'initial cookie value, from existing cookie');
+ element.tabs( "option", "active", 2 );
+ equals( cookie(), 2, "cookie value updated after activating" );
- el.tabs('destroy');
- el.tabs({ cookie: cookieObj, collapsible: true });
- el.tabs('option', 'active', false);
- equals(cookie(), -1, 'cookie value for all tabs unselected');
+ element.tabs( "destroy" );
+ $.cookie( cookieName, 1 );
+ element.tabs({ cookie: cookieObj });
+ equals( cookie(), 1, "initial cookie value, from existing cookie" );
- el.tabs('destroy');
- ok($.cookie(cookieName) === null, 'erase cookie after destroy');
+ element.tabs( "destroy" );
+ element.tabs({ cookie: cookieObj, collapsible: true });
+ element.tabs( "option", "active", false );
+ equals( cookie(), -1, "cookie value for all tabs unselected" );
+ element.tabs( "destroy" );
+ ok( $.cookie( cookieName ) === null, "erase cookie after destroy" );
});
+asyncTest( "spinner", function() {
+ expect( 2 );
-test('spinner', function() {
- expect(4);
- stop();
-
- el = $('#tabs2');
-
- el.tabs({
- selected: 2,
- load: function() {
- // spinner: default spinner
- setTimeout(function() {
- equals($('li:eq(2) > a > span', el).length, 1, "should restore tab markup after spinner is removed");
- equals($('li:eq(2) > a > span', el).html(), '3', "should restore tab label after spinner is removed");
- el.tabs('destroy');
- el.tabs({
- selected: 2,
- spinner: '<img src="spinner.gif" alt="">',
- load: function() {
- // spinner: image
- equals($('li:eq(2) > a > span', el).length, 1, "should restore tab markup after spinner is removed");
- equals($('li:eq(2) > a > span', el).html(), '3', "should restore tab label after spinner is removed");
- start();
- }
- });
- }, 1);
- }
+ var element = $( "#tabs2" ).tabs();
+
+ element.one( "tabsbeforeload", function( event, ui ) {
+ equals( element.find( ".ui-tabs-nav li:eq(2) em" ).length, 1, "beforeload" );
+ });
+ element.one( "tabsload", function( event, ui ) {
+ // wait until after the load finishes before checking for the spinner to be removed
+ setTimeout(function() {
+ equals( element.find( ".ui-tabs-nav li:eq(2) em" ).length, 0, "load" );
+ start();
+ }, 1 );
});
+ element.tabs( "option", "active", 2 );
});
test( "selected", function() {
@@ -193,45 +251,85 @@ test( "disable", function() {
element.tabs( "disable", 1 );
});
-test('show', function() {
- expect(5);
- var uiObj, eventObj;
- el = $('#tabs1').tabs({
- show: function(event, ui) {
- uiObj = ui;
- eventObj = event;
- }
+test( "show", function() {
+ expect( 13 );
+
+ var element = $( "#tabs1" ).tabs({
+ active: false,
+ collapsible: true
+ }),
+ tabs = element.find( ".ui-tabs-nav a" ),
+ panels = element.find( ".ui-tabs-panel" );
+
+ // from collapsed
+ element.one( "tabsshow", function( event, ui ) {
+ ok( !( "originalEvent" in event ), "originalEvent" );
+ strictEqual( ui.tab, tabs[ 0 ], "ui.tab" );
+ strictEqual( ui.panel, panels[ 0 ], "ui.panel" );
+ equal( ui.index, 0, "ui.index" );
+ tabs_state( element, 1, 0, 0 );
});
- ok(uiObj !== undefined, 'trigger callback after initialization');
- equals(uiObj.tab, $('a', el)[0], 'contain tab as DOM anchor element');
- equals(uiObj.panel, $('div', el)[0], 'contain panel as DOM div element');
- equals(uiObj.index, 0, 'contain index');
+ element.tabs( "option", "active", 0 );
+ tabs_state( element, 1, 0, 0 );
- el.find( "li:eq(1) a" ).simulate( "click" );
- equals( eventObj.originalEvent.type, "click", "show triggered by click" );
+ // switching tabs
+ element.one( "tabsshow", function( event, ui ) {
+ equals( event.originalEvent.type, "click", "originalEvent" );
+ strictEqual( ui.tab, tabs[ 1 ], "ui.tab" );
+ strictEqual( ui.panel, panels[ 1 ], "ui.panel" );
+ equal( ui.index, 1, "ui.index" );
+ tabs_state( element, 0, 1, 0 );
+ });
+ tabs.eq( 1 ).click();
+ tabs_state( element, 0, 1, 0 );
+ // collapsing
+ element.one( "tabsshow", function( event, ui ) {
+ ok( false, "collapsing" );
+ });
+ element.tabs( "option", "active", false );
+ tabs_state( element, 0, 0, 0 );
});
-test('select', function() {
- expect(7);
+test( "select", function() {
+ expect( 13 );
- var eventObj;
- el = $('#tabs1').tabs({
- select: function(event, ui) {
- ok(true, 'select triggered after initialization');
- equals(this, el[0], "context of callback");
- equals(event.type, 'tabsselect', 'event type in callback');
- equals(ui.tab, el.find('a')[1], 'contain tab as DOM anchor element');
- equals(ui.panel, el.find('div')[1], 'contain panel as DOM div element');
- equals(ui.index, 1, 'contain index');
- evenObj = event;
- }
+ var element = $( "#tabs1" ).tabs({
+ active: false,
+ collapsible: true
+ }),
+ tabs = element.find( ".ui-tabs-nav a" ),
+ panels = element.find( ".ui-tabs-panel" );
+
+ // from collapsed
+ element.one( "tabsselect", function( event, ui ) {
+ ok( !( "originalEvent" in event ), "originalEvent" );
+ strictEqual( ui.tab, tabs[ 0 ], "ui.tab" );
+ strictEqual( ui.panel, panels[ 0 ], "ui.panel" );
+ equal( ui.index, 0, "ui.index" );
+ tabs_state( element, 0, 0, 0 );
+ });
+ element.tabs( "option", "active", 0 );
+ tabs_state( element, 1, 0, 0 );
+
+ // switching tabs
+ element.one( "tabsselect", function( event, ui ) {
+ equals( event.originalEvent.type, "click", "originalEvent" );
+ strictEqual( ui.tab, tabs[ 1 ], "ui.tab" );
+ strictEqual( ui.panel, panels[ 1 ], "ui.panel" );
+ equal( ui.index, 1, "ui.index" );
+ tabs_state( element, 1, 0, 0 );
});
- el.tabs('select', 1);
+ tabs.eq( 1 ).click();
+ tabs_state( element, 0, 1, 0 );
- el.find( "li:eq(1) a" ).simulate( "click" );
- equals( evenObj.originalEvent.type, "click", "select triggered by click" );
+ // collapsing
+ element.one( "tabsselect", function( event, ui ) {
+ ok( false, "collapsing" );
+ });
+ element.tabs( "option", "active", false );
+ tabs_state( element, 0, 0, 0 );
});
module( "tabs (deprecated): methods" );
@@ -405,4 +503,18 @@ test( "url", function() {
element.tabs( "option", "active", 3 );
});
+asyncTest( "abort", function() {
+ expect( 1 );
+
+ var element = $( "#tabs2" ).tabs();
+ element.one( "tabsbeforeload", function( event, ui ) {
+ ui.jqXHR.error(function( jqXHR, status ) {
+ equals( status, "abort", "aborted" );
+ start();
+ });
+ });
+ element.tabs( "option", "active", 2 );
+ element.tabs( "abort" );
+});
+
}( jQuery ) );