library-mirrors/jquery-ui
1
0
Fork 0
mirror of https://github.com/jquery/jquery-ui.git synced 2025-01-07 20:34:24 +00:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

Tabs: Pass the list item instead of the anchor in events; move aria-controls from the anchor to the list item.

Browse Source
This commit is contained in:
Scott González 2012-05-18 16:11:14 -04:00
parent 098dd1404b
commit 5c9d9f9e9d
9 changed files with 136 additions and 107 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
tests/unit/tabs/tabs.html
View File

@ -57,7 +57,7 @@
<li><a href="#colon:test"><span>1</span></a></li> <li><a href="#colon:test"><span>1</span></a></li>
<li><a href="#inline-style"><span>2</span></a></li> <li><a href="#inline-style"><span>2</span></a></li>
<li><a href="data/test.html#test"><span>3</span></a></li> <li><a href="data/test.html#test"><span>3</span></a></li>
<li><a href="data/test.html" aria-controls="custom-id"><span>4</span></a></li> <li aria-controls="custom-id"><a href="data/test.html"><span>4</span></a></li>
<li><a href="data/test.html" title="∫ßáö Սե"><span>5</span></a></li> <li><a href="data/test.html" title="∫ßáö Սե"><span>5</span></a></li>
</ul> </ul>
<div id="colon:test"></div> <div id="colon:test"></div>

13
tests/unit/tabs/tabs_core.js
View File

@ -47,14 +47,15 @@ test( "disconnected from DOM", function() {
test( "aria-controls", function() { test( "aria-controls", function() {
expect( 7 ); expect( 7 );
var element = $( "#tabs1" ).tabs(), var element = $( "#tabs1" ).tabs(),
tabs = element.find( ".ui-tabs-nav a" ); tabs = element.find( ".ui-tabs-nav li" );
tabs.each(function() { tabs.each(function() {
var tab = $( this ); var tab = $( this ),
equal( tab.prop( "hash" ).substring( 1 ), tab.attr( "aria-controls" ) ); anchor = tab.find( ".ui-tabs-anchor" );
equal( anchor.prop( "hash" ).substring( 1 ), tab.attr( "aria-controls" ) );
}); });
element = $( "#tabs2" ).tabs(); element = $( "#tabs2" ).tabs();
tabs = element.find( ".ui-tabs-nav a" ); tabs = element.find( ".ui-tabs-nav li" );
equal( tabs.eq( 0 ).attr( "aria-controls" ), "colon:test" ); equal( tabs.eq( 0 ).attr( "aria-controls" ), "colon:test" );
equal( tabs.eq( 1 ).attr( "aria-controls" ), "inline-style" ); equal( tabs.eq( 1 ).attr( "aria-controls" ), "inline-style" );
ok( /^ui-tabs-\d+$/.test( tabs.eq( 2 ).attr( "aria-controls" ) ), "generated id" ); ok( /^ui-tabs-\d+$/.test( tabs.eq( 2 ).attr( "aria-controls" ) ), "generated id" );
@ -86,11 +87,11 @@ test( "#4033 - IE expands hash to full url and misinterprets tab as ajax", funct
element.tabs({ element.tabs({
beforeLoad: function( event, ui ) { beforeLoad: function( event, ui ) {
event.preventDefault(); event.preventDefault();
ok( false, 'should not be an ajax tab'); ok( false, "should not be an ajax tab" );
} }
}); });
equal( element.find( ".ui-tabs-nav a" ).attr( "aria-controls" ), "tab", "aria-contorls attribute is correct" ); equal( element.find( ".ui-tabs-nav li" ).attr( "aria-controls" ), "tab", "aria-contorls attribute is correct" );
state( element, 1 ); state( element, 1 );
}); });

2
tests/unit/tabs/tabs_deprecated.html
View File

@ -56,7 +56,7 @@
<li><a href="#colon:test"><span>1</span></a></li> <li><a href="#colon:test"><span>1</span></a></li>
<li><a href="#inline-style"><span>2</span></a></li> <li><a href="#inline-style"><span>2</span></a></li>
<li><a href="data/test.html#test"><span>3</span></a></li> <li><a href="data/test.html#test"><span>3</span></a></li>
<li><a href="data/test.html" aria-controls="custom-id"><span>4</span></a></li> <li aria-controls="custom-id"><a href="data/test.html"><span>4</span></a></li>
<li><a href="data/test.html" title="∫ßáö Սե"><span>5</span></a></li> <li><a href="data/test.html" title="∫ßáö Սե"><span>5</span></a></li>
</ul> </ul>
<div id="colon:test"></div> <div id="colon:test"></div>

61
tests/unit/tabs/tabs_deprecated.js
View File

@ -107,11 +107,11 @@ test( "tabTemplate + panelTemplate", function() {
}); });
element.tabs( "add", "#new", "New" ); element.tabs( "add", "#new", "New" );
tab = element.find( ".ui-tabs-nav li" ).last(); tab = element.find( ".ui-tabs-nav li" ).last();
anchor = tab.find( "a" ); anchor = tab.find( ".ui-tabs-anchor" );
equal( tab.text(), "New", "label" ); equal( tab.text(), "New", "label" );
ok( tab.hasClass( "customTab" ), "tab custom class" ); ok( tab.hasClass( "customTab" ), "tab custom class" );
equal( anchor.attr( "href" ), "http://example.com/#new", "href" ); equal( anchor.attr( "href" ), "http://example.com/#new", "href" );
equal( anchor.attr( "aria-controls" ), "new", "aria-controls" ); equal( tab.attr( "aria-controls" ), "new", "aria-controls" );
ok( element.find( "#new" ).hasClass( "customPanel" ), "panel custom class" ); ok( element.find( "#new" ).hasClass( "customPanel" ), "panel custom class" );
}); });
@ -210,7 +210,7 @@ test( "selected", function() {
equal( element.tabs( "option", "selected" ), 0 ); equal( element.tabs( "option", "selected" ), 0 );
state( element, 1, 0, 0 ); state( element, 1, 0, 0 );
element.find( ".ui-tabs-nav a" ).eq( 1 ).click(); element.find( ".ui-tabs-nav .ui-tabs-anchor" ).eq( 1 ).click();
equal( element.tabs( "option", "selected" ), 1 ); equal( element.tabs( "option", "selected" ), 1 );
state( element, 0, 1, 0 ); state( element, 0, 1, 0 );
@ -226,17 +226,18 @@ module( "tabs (deprecated): events" );
asyncTest( "load", function() { asyncTest( "load", function() {
expect( 15 ); expect( 15 );
var tab, panelId, panel, var tab, anchor, panelId, panel,
element = $( "#tabs2" ); element = $( "#tabs2" );
// init // init
element.one( "tabsload", function( event, ui ) { element.one( "tabsload", function( event, ui ) {
tab = element.find( ".ui-tabs-nav a" ).eq( 2 ); tab = element.find( ".ui-tabs-nav li" ).eq( 2 );
anchor = tab.find( ".ui-tabs-anchor" );
panelId = tab.attr( "aria-controls" ); panelId = tab.attr( "aria-controls" );
panel = $( "#" + panelId ); panel = $( "#" + panelId );
ok( !( "originalEvent" in event ), "originalEvent" ); ok( !( "originalEvent" in event ), "originalEvent" );
strictEqual( ui.tab, tab[ 0 ], "tab" ); strictEqual( ui.tab, anchor[ 0 ], "tab" );
strictEqual( ui.panel, panel[ 0 ], "panel" ); strictEqual( ui.panel, panel[ 0 ], "panel" );
equal( $( ui.panel ).find( "p" ).length, 1, "panel html" ); equal( $( ui.panel ).find( "p" ).length, 1, "panel html" );
state( element, 0, 0, 1, 0, 0 ); state( element, 0, 0, 1, 0, 0 );
@ -247,12 +248,13 @@ asyncTest( "load", function() {
function tabsload1() { function tabsload1() {
// .option() // .option()
element.one( "tabsload", function( event, ui ) { element.one( "tabsload", function( event, ui ) {
tab = element.find( ".ui-tabs-nav a" ).eq( 3 ); tab = element.find( ".ui-tabs-nav li" ).eq( 3 );
anchor = tab.find( ".ui-tabs-anchor" );
panelId = tab.attr( "aria-controls" ); panelId = tab.attr( "aria-controls" );
panel = $( "#" + panelId ); panel = $( "#" + panelId );
ok( !( "originalEvent" in event ), "originalEvent" ); ok( !( "originalEvent" in event ), "originalEvent" );
strictEqual( ui.tab, tab[ 0 ], "tab" ); strictEqual( ui.tab, anchor[ 0 ], "tab" );
strictEqual( ui.panel, panel[ 0 ], "panel" ); strictEqual( ui.panel, panel[ 0 ], "panel" );
equal( $( ui.panel ).find( "p" ).length, 1, "panel html" ); equal( $( ui.panel ).find( "p" ).length, 1, "panel html" );
state( element, 0, 0, 0, 1, 0 ); state( element, 0, 0, 0, 1, 0 );
@ -264,18 +266,19 @@ asyncTest( "load", function() {
function tabsload2() { function tabsload2() {
// click, change panel content // click, change panel content
element.one( "tabsload", function( event, ui ) { element.one( "tabsload", function( event, ui ) {
tab = element.find( ".ui-tabs-nav a" ).eq( 4 ); tab = element.find( ".ui-tabs-nav li" ).eq( 4 );
anchor = tab.find( ".ui-tabs-anchor" );
panelId = tab.attr( "aria-controls" ); panelId = tab.attr( "aria-controls" );
panel = $( "#" + panelId ); panel = $( "#" + panelId );
equal( event.originalEvent.type, "click", "originalEvent" ); equal( event.originalEvent.type, "click", "originalEvent" );
strictEqual( ui.tab, tab[ 0 ], "tab" ); strictEqual( ui.tab, anchor[ 0 ], "tab" );
strictEqual( ui.panel, panel[ 0 ], "panel" ); strictEqual( ui.panel, panel[ 0 ], "panel" );
equal( $( ui.panel ).find( "p" ).length, 1, "panel html" ); equal( $( ui.panel ).find( "p" ).length, 1, "panel html" );
state( element, 0, 0, 0, 0, 1 ); state( element, 0, 0, 0, 0, 1 );
start(); start();
}); });
element.find( ".ui-tabs-nav a" ).eq( 4 ).click(); element.find( ".ui-tabs-nav .ui-tabs-anchor" ).eq( 4 ).click();
} }
}); });
@ -285,7 +288,7 @@ test( "enable", function() {
var element = $( "#tabs1" ).tabs({ var element = $( "#tabs1" ).tabs({
disabled: [ 0, 1 ], disabled: [ 0, 1 ],
enable: function( event, ui ) { enable: function( event, ui ) {
equal( ui.tab, element.find( ".ui-tabs-nav a" )[ 1 ], "ui.tab" ); equal( ui.tab, element.find( ".ui-tabs-nav .ui-tabs-anchor" )[ 1 ], "ui.tab" );
equal( ui.panel, element.find( ".ui-tabs-panel" )[ 1 ], "ui.panel" ); equal( ui.panel, element.find( ".ui-tabs-panel" )[ 1 ], "ui.panel" );
equal( ui.index, 1, "ui.index" ); equal( ui.index, 1, "ui.index" );
} }
@ -300,7 +303,7 @@ test( "disable", function() {
var element = $( "#tabs1" ).tabs({ var element = $( "#tabs1" ).tabs({
disable: function( event, ui ) { disable: function( event, ui ) {
equal( ui.tab, element.find( ".ui-tabs-nav a" )[ 1 ], "ui.tab" ); equal( ui.tab, element.find( ".ui-tabs-nav .ui-tabs-anchor" )[ 1 ], "ui.tab" );
equal( ui.panel, element.find( ".ui-tabs-panel" )[ 1 ], "ui.panel" ); equal( ui.panel, element.find( ".ui-tabs-panel" )[ 1 ], "ui.panel" );
equal( ui.index, 1, "ui.index" ); equal( ui.index, 1, "ui.index" );
} }
@ -318,13 +321,13 @@ test( "show", function() {
active: false, active: false,
collapsible: true collapsible: true
}), }),
tabs = element.find( ".ui-tabs-nav a" ), anchors = element.find( ".ui-tabs-nav .ui-tabs-anchor" ),
panels = element.find( ".ui-tabs-panel" ); panels = element.find( ".ui-tabs-panel" );
// from collapsed // from collapsed
element.one( "tabsshow", function( event, ui ) { element.one( "tabsshow", function( event, ui ) {
ok( !( "originalEvent" in event ), "originalEvent" ); ok( !( "originalEvent" in event ), "originalEvent" );
strictEqual( ui.tab, tabs[ 0 ], "ui.tab" ); strictEqual( ui.tab, anchors[ 0 ], "ui.tab" );
strictEqual( ui.panel, panels[ 0 ], "ui.panel" ); strictEqual( ui.panel, panels[ 0 ], "ui.panel" );
equal( ui.index, 0, "ui.index" ); equal( ui.index, 0, "ui.index" );
state( element, 1, 0, 0 ); state( element, 1, 0, 0 );
@ -335,12 +338,12 @@ test( "show", function() {
// switching tabs // switching tabs
element.one( "tabsshow", function( event, ui ) { element.one( "tabsshow", function( event, ui ) {
equal( event.originalEvent.type, "click", "originalEvent" ); equal( event.originalEvent.type, "click", "originalEvent" );
strictEqual( ui.tab, tabs[ 1 ], "ui.tab" ); strictEqual( ui.tab, anchors[ 1 ], "ui.tab" );
strictEqual( ui.panel, panels[ 1 ], "ui.panel" ); strictEqual( ui.panel, panels[ 1 ], "ui.panel" );
equal( ui.index, 1, "ui.index" ); equal( ui.index, 1, "ui.index" );
state( element, 0, 1, 0 ); state( element, 0, 1, 0 );
}); });
tabs.eq( 1 ).click(); anchors.eq( 1 ).click();
state( element, 0, 1, 0 ); state( element, 0, 1, 0 );
// collapsing // collapsing
@ -358,13 +361,13 @@ test( "select", function() {
active: false, active: false,
collapsible: true collapsible: true
}), }),
tabs = element.find( ".ui-tabs-nav a" ), anchors = element.find( ".ui-tabs-nav .ui-tabs-anchor" ),
panels = element.find( ".ui-tabs-panel" ); panels = element.find( ".ui-tabs-panel" );
// from collapsed // from collapsed
element.one( "tabsselect", function( event, ui ) { element.one( "tabsselect", function( event, ui ) {
ok( !( "originalEvent" in event ), "originalEvent" ); ok( !( "originalEvent" in event ), "originalEvent" );
strictEqual( ui.tab, tabs[ 0 ], "ui.tab" ); strictEqual( ui.tab, anchors[ 0 ], "ui.tab" );
strictEqual( ui.panel, panels[ 0 ], "ui.panel" ); strictEqual( ui.panel, panels[ 0 ], "ui.panel" );
equal( ui.index, 0, "ui.index" ); equal( ui.index, 0, "ui.index" );
state( element, 0, 0, 0 ); state( element, 0, 0, 0 );
@ -375,12 +378,12 @@ test( "select", function() {
// switching tabs // switching tabs
element.one( "tabsselect", function( event, ui ) { element.one( "tabsselect", function( event, ui ) {
equal( event.originalEvent.type, "click", "originalEvent" ); equal( event.originalEvent.type, "click", "originalEvent" );
strictEqual( ui.tab, tabs[ 1 ], "ui.tab" ); strictEqual( ui.tab, anchors[ 1 ], "ui.tab" );
strictEqual( ui.panel, panels[ 1 ], "ui.panel" ); strictEqual( ui.panel, panels[ 1 ], "ui.panel" );
equal( ui.index, 1, "ui.index" ); equal( ui.index, 1, "ui.index" );
state( element, 1, 0, 0 ); state( element, 1, 0, 0 );
}); });
tabs.eq( 1 ).click(); anchors.eq( 1 ).click();
state( element, 0, 1, 0 ); state( element, 0, 1, 0 );
// collapsing // collapsing
@ -414,11 +417,11 @@ test( "add", function() {
element.tabs( "add", "#new", "New" ); element.tabs( "add", "#new", "New" );
state( element, 1, 0, 0, 0 ); state( element, 1, 0, 0, 0 );
tab = element.find( ".ui-tabs-nav li" ).last(); tab = element.find( ".ui-tabs-nav li" ).last();
anchor = tab.find( "a" ); anchor = tab.find( ".ui-tabs-anchor" );
equal( tab.text(), "New", "label" ); equal( tab.text(), "New", "label" );
equal( stripLeadingSlash( anchor[0].pathname ), stripLeadingSlash( location.pathname ), "href pathname" ); equal( stripLeadingSlash( anchor[0].pathname ), stripLeadingSlash( location.pathname ), "href pathname" );
equal( anchor[0].hash, "#new", "href hash" ); equal( anchor[0].hash, "#new", "href hash" );
equal( anchor.attr( "aria-controls" ), "new", "aria-controls" ); equal( tab.attr( "aria-controls" ), "new", "aria-controls" );
ok( !tab.hasClass( "ui-state-hover" ), "not hovered" ); ok( !tab.hasClass( "ui-state-hover" ), "not hovered" );
anchor.simulate( "mouseover" ); anchor.simulate( "mouseover" );
ok( tab.hasClass( "ui-state-hover" ), "hovered" ); ok( tab.hasClass( "ui-state-hover" ), "hovered" );
@ -429,17 +432,17 @@ test( "add", function() {
element.one( "tabsadd", function( event, ui ) { element.one( "tabsadd", function( event, ui ) {
equal( ui.index, 1, "ui.index" ); equal( ui.index, 1, "ui.index" );
equal( $( ui.tab ).text(), "New Remote", "ui.tab" ); equal( $( ui.tab ).text(), "New Remote", "ui.tab" );
equal( ui.panel.id, $( ui.tab ).attr( "aria-controls" ), "ui.panel" ); equal( ui.panel.id, $( ui.tab ).closest( "li" ).attr( "aria-controls" ), "ui.panel" );
}); });
element.tabs( "add", "data/test.html", "New Remote", 1 ); element.tabs( "add", "data/test.html", "New Remote", 1 );
state( element, 0, 0, 0, 0, 1 ); state( element, 0, 0, 0, 0, 1 );
tab = element.find( ".ui-tabs-nav li" ).eq( 1 ); tab = element.find( ".ui-tabs-nav li" ).eq( 1 );
anchor = tab.find( "a" ); anchor = tab.find( ".ui-tabs-anchor" );
equal( tab.text(), "New Remote", "label" ); equal( tab.text(), "New Remote", "label" );
equal( stripLeadingSlash( stripLeadingSlash( equal( stripLeadingSlash( stripLeadingSlash(
anchor[0].pathname.replace( stripLeadingSlash( location.pathname ).split( "/" ).slice( 0, -1 ).join( "/" ), "" ) anchor[0].pathname.replace( stripLeadingSlash( location.pathname ).split( "/" ).slice( 0, -1 ).join( "/" ), "" )
) ), "data/test.html", "href" ); ) ), "data/test.html", "href" );
ok( /^ui-tabs-\d+$/.test( anchor.attr( "aria-controls" ) ), "aria controls" ); ok( /^ui-tabs-\d+$/.test( tab.attr( "aria-controls" ) ), "aria controls" );
ok( !tab.hasClass( "ui-state-hover" ), "not hovered" ); ok( !tab.hasClass( "ui-state-hover" ), "not hovered" );
anchor.simulate( "mouseover" ); anchor.simulate( "mouseover" );
ok( tab.hasClass( "ui-state-hover" ), "hovered" ); ok( tab.hasClass( "ui-state-hover" ), "hovered" );
@ -560,10 +563,10 @@ test( "url", function() {
expect( 2 ); expect( 2 );
var element = $( "#tabs2" ).tabs(), var element = $( "#tabs2" ).tabs(),
tab = element.find( "a" ).eq( 3 ); anchor = element.find( ".ui-tabs-anchor" ).eq( 3 );
element.tabs( "url", 3, "data/test2.html" ); element.tabs( "url", 3, "data/test2.html" );
equal( tab.attr( "href" ), "data/test2.html", "href was updated" ); equal( anchor.attr( "href" ), "data/test2.html", "href was updated" );
element.one( "tabsbeforeload", function( event, ui ) { element.one( "tabsbeforeload", function( event, ui ) {
equal( ui.ajaxSettings.url, "data/test2.html", "ajaxSettings.url" ); equal( ui.ajaxSettings.url, "data/test2.html", "ajaxSettings.url" );
event.preventDefault(); event.preventDefault();
@ -582,7 +585,7 @@ asyncTest( "abort", function() {
}); });
}); });
// prevent IE from caching the request, so that it won't resolve before we call abort // prevent IE from caching the request, so that it won't resolve before we call abort
element.find( ".ui-tabs-nav li:eq(2) a" ).attr( "href", function( href ) { element.find( ".ui-tabs-nav li:eq(2) .ui-tabs-anchor" ).attr( "href", function( href ) {
return href + "?" + (+ new Date()); return href + "?" + (+ new Date());
}); });
element.tabs( "option", "active", 2 ); element.tabs( "option", "active", 2 );

28
tests/unit/tabs/tabs_events.js
View File

@ -8,7 +8,7 @@ test( "create", function() {
expect( 10 ); expect( 10 );
var element = $( "#tabs1" ), var element = $( "#tabs1" ),
tabs = element.find( "ul a" ), tabs = element.find( "ul li" ),
panels = element.children( "div" ); panels = element.children( "div" );
element.tabs({ element.tabs({
@ -50,7 +50,8 @@ test( "beforeActivate", function() {
active: false, active: false,
collapsible: true collapsible: true
}), }),
tabs = element.find( ".ui-tabs-nav a" ), tabs = element.find( ".ui-tabs-nav li" ),
anchors = tabs.find( ".ui-tabs-anchor" ),
panels = element.find( ".ui-tabs-panel" ); panels = element.find( ".ui-tabs-panel" );
// from collapsed // from collapsed
@ -80,7 +81,7 @@ test( "beforeActivate", function() {
strictEqual( ui.newPanel[ 0 ], panels[ 1 ], "newPanel" ); strictEqual( ui.newPanel[ 0 ], panels[ 1 ], "newPanel" );
state( element, 1, 0, 0 ); state( element, 1, 0, 0 );
}); });
tabs.eq( 1 ).click(); anchors.eq( 1 ).click();
state( element, 0, 1, 0 ); state( element, 0, 1, 0 );
// collapsing // collapsing
@ -120,7 +121,8 @@ test( "activate", function() {
active: false, active: false,
collapsible: true collapsible: true
}), }),
tabs = element.find( ".ui-tabs-nav a" ), tabs = element.find( ".ui-tabs-nav li" ),
anchors = element.find( ".ui-tabs-anchor" ),
panels = element.find( ".ui-tabs-panel" ); panels = element.find( ".ui-tabs-panel" );
// from collapsed // from collapsed
@ -150,7 +152,7 @@ test( "activate", function() {
strictEqual( ui.newPanel[ 0 ], panels[ 1 ], "newPanel" ); strictEqual( ui.newPanel[ 0 ], panels[ 1 ], "newPanel" );
state( element, 0, 1, 0 ); state( element, 0, 1, 0 );
}); });
tabs.eq( 1 ).click(); anchors.eq( 1 ).click();
state( element, 0, 1, 0 ); state( element, 0, 1, 0 );
// collapsing // collapsing
@ -186,7 +188,7 @@ test( "beforeLoad", function() {
// init // init
element.one( "tabsbeforeload", function( event, ui ) { element.one( "tabsbeforeload", function( event, ui ) {
tab = element.find( ".ui-tabs-nav a" ).eq( 2 ); tab = element.find( ".ui-tabs-nav li" ).eq( 2 );
panelId = tab.attr( "aria-controls" ); panelId = tab.attr( "aria-controls" );
panel = $( "#" + panelId ); panel = $( "#" + panelId );
@ -208,7 +210,7 @@ test( "beforeLoad", function() {
// .option() // .option()
element.one( "tabsbeforeload", function( event, ui ) { element.one( "tabsbeforeload", function( event, ui ) {
tab = element.find( ".ui-tabs-nav a" ).eq( 2 ); tab = element.find( ".ui-tabs-nav li" ).eq( 2 );
panelId = tab.attr( "aria-controls" ); panelId = tab.attr( "aria-controls" );
panel = $( "#" + panelId ); panel = $( "#" + panelId );
@ -230,7 +232,7 @@ test( "beforeLoad", function() {
// click, change panel content // click, change panel content
element.one( "tabsbeforeload", function( event, ui ) { element.one( "tabsbeforeload", function( event, ui ) {
tab = element.find( ".ui-tabs-nav a" ).eq( 3 ); tab = element.find( ".ui-tabs-nav li" ).eq( 3 );
panelId = tab.attr( "aria-controls" ); panelId = tab.attr( "aria-controls" );
panel = $( "#" + panelId ); panel = $( "#" + panelId );
@ -245,7 +247,7 @@ test( "beforeLoad", function() {
event.preventDefault(); event.preventDefault();
state( element, 0, 0, 1, 0, 0 ); state( element, 0, 0, 1, 0, 0 );
}); });
element.find( ".ui-tabs-nav a" ).eq( 3 ).click(); element.find( ".ui-tabs-nav .ui-tabs-anchor" ).eq( 3 ).click();
state( element, 0, 0, 0, 1, 0 ); state( element, 0, 0, 0, 1, 0 );
// .toLowerCase() is needed to convert <P> to <p> in old IEs // .toLowerCase() is needed to convert <P> to <p> in old IEs
equal( panel.html().toLowerCase(), "<p>testing</p>", "panel html after" ); equal( panel.html().toLowerCase(), "<p>testing</p>", "panel html after" );
@ -260,7 +262,7 @@ if ( $.uiBackCompat === false ) {
// init // init
element.one( "tabsload", function( event, ui ) { element.one( "tabsload", function( event, ui ) {
tab = element.find( ".ui-tabs-nav a" ).eq( 2 ); tab = element.find( ".ui-tabs-nav li" ).eq( 2 );
panelId = tab.attr( "aria-controls" ); panelId = tab.attr( "aria-controls" );
panel = $( "#" + panelId ); panel = $( "#" + panelId );
@ -278,7 +280,7 @@ if ( $.uiBackCompat === false ) {
function tabsload1() { function tabsload1() {
// .option() // .option()
element.one( "tabsload", function( event, ui ) { element.one( "tabsload", function( event, ui ) {
tab = element.find( ".ui-tabs-nav a" ).eq( 3 ); tab = element.find( ".ui-tabs-nav li" ).eq( 3 );
panelId = tab.attr( "aria-controls" ); panelId = tab.attr( "aria-controls" );
panel = $( "#" + panelId ); panel = $( "#" + panelId );
@ -297,7 +299,7 @@ if ( $.uiBackCompat === false ) {
function tabsload2() { function tabsload2() {
// click, change panel content // click, change panel content
element.one( "tabsload", function( event, ui ) { element.one( "tabsload", function( event, ui ) {
tab = element.find( ".ui-tabs-nav a" ).eq( 4 ); tab = element.find( ".ui-tabs-nav li" ).eq( 4 );
panelId = tab.attr( "aria-controls" ); panelId = tab.attr( "aria-controls" );
panel = $( "#" + panelId ); panel = $( "#" + panelId );
@ -310,7 +312,7 @@ if ( $.uiBackCompat === false ) {
state( element, 0, 0, 0, 0, 1 ); state( element, 0, 0, 0, 0, 1 );
start(); start();
}); });
element.find( ".ui-tabs-nav a" ).eq( 4 ).click(); element.find( ".ui-tabs-nav .ui-tabs-anchor" ).eq( 4 ).click();
} }
}); });
} }

18
tests/unit/tabs/tabs_methods.js
View File

@ -97,7 +97,7 @@ test( "refresh", function() {
element.tabs( "refresh" ); element.tabs( "refresh" );
state( element, 1, 0, 0, 0 ); state( element, 1, 0, 0, 0 );
disabled( element, [ 1 ] ); disabled( element, [ 1 ] );
equal( element.find( "#" + $( "#newTab a" ).attr( "aria-controls" ) ).length, 1, equal( element.find( "#" + $( "#newTab" ).attr( "aria-controls" ) ).length, 1,
"panel added for remote tab" ); "panel added for remote tab" );
// remove all tabs // remove all tabs
@ -156,7 +156,7 @@ asyncTest( "load", function() {
// load content of inactive tab // load content of inactive tab
// useful for preloading content with custom caching // useful for preloading content with custom caching
element.one( "tabsbeforeload", function( event, ui ) { element.one( "tabsbeforeload", function( event, ui ) {
var tab = element.find( ".ui-tabs-nav a" ).eq( 3 ), var tab = element.find( ".ui-tabs-nav li" ).eq( 3 ),
panelId = tab.attr( "aria-controls" ), panelId = tab.attr( "aria-controls" ),
panel = $( "#" + panelId ); panel = $( "#" + panelId );
@ -171,13 +171,17 @@ asyncTest( "load", function() {
// TODO: remove wrapping in 2.0 // TODO: remove wrapping in 2.0
var uiTab = $( ui.tab ), var uiTab = $( ui.tab ),
uiPanel = $( ui.panel ), uiPanel = $( ui.panel ),
tab = element.find( ".ui-tabs-nav a" ).eq( 3 ), tab = element.find( ".ui-tabs-nav li" ).eq( 3 ),
panelId = tab.attr( "aria-controls" ), panelId = tab.attr( "aria-controls" ),
panel = $( "#" + panelId ); panel = $( "#" + panelId );
ok( !( "originalEvent" in event ), "originalEvent" ); ok( !( "originalEvent" in event ), "originalEvent" );
equal( uiTab.length, 1, "tab length" ); equal( uiTab.length, 1, "tab length" );
if ( $.uiBackCompat === false ) {
strictEqual( uiTab[ 0 ], tab[ 0 ], "tab" ); strictEqual( uiTab[ 0 ], tab[ 0 ], "tab" );
} else {
strictEqual( uiTab[ 0 ], tab.find( ".ui-tabs-anchor" )[ 0 ], "tab" );
}
equal( uiPanel.length, 1, "panel length" ); equal( uiPanel.length, 1, "panel length" );
strictEqual( uiPanel[ 0 ], panel[ 0 ], "panel" ); strictEqual( uiPanel[ 0 ], panel[ 0 ], "panel" );
equal( uiPanel.find( "p" ).length, 1, "panel html" ); equal( uiPanel.find( "p" ).length, 1, "panel html" );
@ -203,7 +207,7 @@ asyncTest( "load", function() {
function tabsload2() { function tabsload2() {
// reload content of active tab // reload content of active tab
element.one( "tabsbeforeload", function( event, ui ) { element.one( "tabsbeforeload", function( event, ui ) {
var tab = element.find( ".ui-tabs-nav a" ).eq( 3 ), var tab = element.find( ".ui-tabs-nav li" ).eq( 3 ),
panelId = tab.attr( "aria-controls" ), panelId = tab.attr( "aria-controls" ),
panel = $( "#" + panelId ); panel = $( "#" + panelId );
@ -218,13 +222,17 @@ asyncTest( "load", function() {
// TODO: remove wrapping in 2.0 // TODO: remove wrapping in 2.0
var uiTab = $( ui.tab ), var uiTab = $( ui.tab ),
uiPanel = $( ui.panel ), uiPanel = $( ui.panel ),
tab = element.find( ".ui-tabs-nav a" ).eq( 3 ), tab = element.find( ".ui-tabs-nav li" ).eq( 3 ),
panelId = tab.attr( "aria-controls" ), panelId = tab.attr( "aria-controls" ),
panel = $( "#" + panelId ); panel = $( "#" + panelId );
ok( !( "originalEvent" in event ), "originalEvent" ); ok( !( "originalEvent" in event ), "originalEvent" );
equal( uiTab.length, 1, "tab length" ); equal( uiTab.length, 1, "tab length" );
if ( $.uiBackCompat === false ) {
strictEqual( uiTab[ 0 ], tab[ 0 ], "tab" ); strictEqual( uiTab[ 0 ], tab[ 0 ], "tab" );
} else {
strictEqual( uiTab[ 0 ], tab.find( ".ui-tabs-anchor" )[ 0 ], "tab" );
}
equal( uiPanel.length, 1, "panel length" ); equal( uiPanel.length, 1, "panel length" );
strictEqual( uiPanel[ 0 ], panel[ 0 ], "panel" ); strictEqual( uiPanel[ 0 ], panel[ 0 ], "panel" );
state( element, 0, 0, 0, 1, 0 ); state( element, 0, 0, 0, 1, 0 );

18
tests/unit/tabs/tabs_options.js
View File

@ -57,7 +57,7 @@ test( "{ active: Number }", function() {
equal( element.tabs( "option", "active" ), 0 ); equal( element.tabs( "option", "active" ), 0 );
state( element, 1, 0, 0 ); state( element, 1, 0, 0 );
element.find( ".ui-tabs-nav a" ).eq( 1 ).click(); element.find( ".ui-tabs-nav .ui-tabs-anchor" ).eq( 1 ).click();
equal( element.tabs( "option", "active" ), 1 ); equal( element.tabs( "option", "active" ), 1 );
state( element, 0, 1, 0 ); state( element, 0, 1, 0 );
@ -110,7 +110,7 @@ test( "{ collapsible: false }", function() {
equal( element.tabs( "option", "active" ), 1 ); equal( element.tabs( "option", "active" ), 1 );
state( element, 0, 1, 0 ); state( element, 0, 1, 0 );
element.find( ".ui-state-active a" ).eq( 1 ).click(); element.find( ".ui-state-active .ui-tabs-anchor" ).eq( 1 ).click();
equal( element.tabs( "option", "active" ), 1 ); equal( element.tabs( "option", "active" ), 1 );
state( element, 0, 1, 0 ); state( element, 0, 1, 0 );
}); });
@ -131,7 +131,7 @@ test( "{ collapsible: true }", function() {
equal( element.tabs( "option", "active" ), 1 ); equal( element.tabs( "option", "active" ), 1 );
state( element, 0, 1, 0 ); state( element, 0, 1, 0 );
element.find( ".ui-state-active a" ).click(); element.find( ".ui-state-active .ui-tabs-anchor" ).click();
equal( element.tabs( "option", "active" ), false ); equal( element.tabs( "option", "active" ), false );
state( element, 0, 0, 0 ); state( element, 0, 0, 0 );
}); });
@ -173,7 +173,7 @@ test( "{ event: null }", function() {
state( element, 0, 1, 0 ); state( element, 0, 1, 0 );
// ensure default click handler isn't bound // ensure default click handler isn't bound
element.find( ".ui-tabs-nav a" ).eq( 2 ).click(); element.find( ".ui-tabs-nav .ui-tabs-anchor" ).eq( 2 ).click();
equal( element.tabs( "option", "active" ), 1 ); equal( element.tabs( "option", "active" ), 1 );
state( element, 0, 1, 0 ); state( element, 0, 1, 0 );
}); });
@ -186,27 +186,27 @@ test( "{ event: custom }", function() {
}); });
state( element, 1, 0, 0 ); state( element, 1, 0, 0 );
element.find( ".ui-tabs-nav a" ).eq( 1 ).trigger( "custom1" ); element.find( ".ui-tabs-nav .ui-tabs-anchor" ).eq( 1 ).trigger( "custom1" );
equal( element.tabs( "option", "active" ), 1 ); equal( element.tabs( "option", "active" ), 1 );
state( element, 0, 1, 0 ); state( element, 0, 1, 0 );
// ensure default click handler isn't bound // ensure default click handler isn't bound
element.find( ".ui-tabs-nav a" ).eq( 2 ).trigger( "click" ); element.find( ".ui-tabs-nav .ui-tabs-anchor" ).eq( 2 ).trigger( "click" );
equal( element.tabs( "option", "active" ), 1 ); equal( element.tabs( "option", "active" ), 1 );
state( element, 0, 1, 0 ); state( element, 0, 1, 0 );
element.find( ".ui-tabs-nav a" ).eq( 2 ).trigger( "custom2" ); element.find( ".ui-tabs-nav .ui-tabs-anchor" ).eq( 2 ).trigger( "custom2" );
equal( element.tabs( "option", "active" ), 2 ); equal( element.tabs( "option", "active" ), 2 );
state( element, 0, 0, 1 ); state( element, 0, 0, 1 );
element.tabs( "option", "event", "custom3" ); element.tabs( "option", "event", "custom3" );
// ensure old event handlers are unbound // ensure old event handlers are unbound
element.find( ".ui-tabs-nav a" ).eq( 1 ).trigger( "custom1" ); element.find( ".ui-tabs-nav .ui-tabs-anchor" ).eq( 1 ).trigger( "custom1" );
equal( element.tabs( "option", "active" ), 2 ); equal( element.tabs( "option", "active" ), 2 );
state( element, 0, 0, 1 ); state( element, 0, 0, 1 );
element.find( ".ui-tabs-nav a" ).eq( 1 ).trigger( "custom3" ); element.find( ".ui-tabs-nav .ui-tabs-anchor" ).eq( 1 ).trigger( "custom3" );
equal( element.tabs( "option", "active" ), 1 ); equal( element.tabs( "option", "active" ), 1 );
state( element, 0, 1, 0 ); state( element, 0, 1, 0 );
}); });

2
tests/unit/tabs/tabs_test_helpers.js
View File

@ -43,7 +43,7 @@ TestHelpers.tabs = {
actual = tabs.find( ".ui-tabs-nav li" ).map(function() { actual = tabs.find( ".ui-tabs-nav li" ).map(function() {
var tab = $( this ), var tab = $( this ),
panel = $( $.ui.tabs.prototype._sanitizeSelector( panel = $( $.ui.tabs.prototype._sanitizeSelector(
"#" + tab.find( "a" ).attr( "aria-controls" ) ) ), "#" + tab.attr( "aria-controls" ) ) ),
tabIsActive = tab.hasClass( "ui-state-active" ), tabIsActive = tab.hasClass( "ui-state-active" ),
panelIsActive = panel.css( "display" ) !== "none"; panelIsActive = panel.css( "display" ) !== "none";

95
ui/jquery.ui.tabs.js vendored
View File

@ -59,8 +59,8 @@ $.widget( "ui.tabs", {
if ( active === null ) { if ( active === null ) {
// check the fragment identifier in the URL // check the fragment identifier in the URL
if ( location.hash ) { if ( location.hash ) {
that.anchors.each(function( i, tab ) { that.anchors.each(function( i, anchor ) {
if ( tab.hash === location.hash ) { if ( anchor.hash === location.hash ) {
active = i; active = i;
return false; return false;
} }
@ -152,8 +152,8 @@ $.widget( "ui.tabs", {
} }
}, },
_tabId: function( a ) { _tabId: function( tab ) {
return $( a ).attr( "aria-controls" ) || "ui-tabs-" + getNextTabId(); return tab.attr( "aria-controls" ) || "ui-tabs-" + getNextTabId();
}, },
_sanitizeSelector: function( hash ) { _sanitizeSelector: function( hash ) {
@ -187,7 +187,7 @@ $.widget( "ui.tabs", {
// was active, active tab still exists // was active, active tab still exists
} else { } else {
// make sure active index is correct // make sure active index is correct
options.active = this.anchors.index( this.active ); options.active = this.lis.index( this.active );
} }
}, },
@ -197,6 +197,7 @@ $.widget( "ui.tabs", {
this.element.toggleClass( "ui-tabs-collapsible", options.collapsible ); this.element.toggleClass( "ui-tabs-collapsible", options.collapsible );
this.list.addClass( "ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all" ); this.list.addClass( "ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all" );
this.lis.addClass( "ui-state-default ui-corner-top" ); this.lis.addClass( "ui-state-default ui-corner-top" );
this.anchors.addClass( "ui-tabs-anchor" );
this.panels.addClass( "ui-tabs-panel ui-widget-content ui-corner-bottom" ); this.panels.addClass( "ui-tabs-panel ui-widget-content ui-corner-bottom" );
this._setupDisabled( options.disabled ); this._setupDisabled( options.disabled );
@ -219,7 +220,8 @@ $.widget( "ui.tabs", {
this.panels = $(); this.panels = $();
this.anchors.each(function( i, a ) { this.anchors.each(function( i, a ) {
var selector, panel, id; var selector, panel, id,
tab = $( a ).closest( "li" );
// inline tab // inline tab
if ( isLocal( a ) ) { if ( isLocal( a ) ) {
@ -227,7 +229,7 @@ $.widget( "ui.tabs", {
panel = that.element.find( that._sanitizeSelector( selector ) ); panel = that.element.find( that._sanitizeSelector( selector ) );
// remote tab // remote tab
} else { } else {
id = that._tabId( a ); id = that._tabId( tab );
selector = "#" + id; selector = "#" + id;
panel = that.element.find( selector ); panel = that.element.find( selector );
if ( !panel.length ) { if ( !panel.length ) {
@ -239,7 +241,7 @@ $.widget( "ui.tabs", {
if ( panel.length) { if ( panel.length) {
that.panels = that.panels.add( panel ); that.panels = that.panels.add( panel );
} }
$( a ).attr( "aria-controls", selector.substring( 1 ) ); tab.attr( "aria-controls", selector.substring( 1 ) );
}); });
}, },
@ -294,16 +296,16 @@ $.widget( "ui.tabs", {
var that = this, var that = this,
options = that.options, options = that.options,
active = that.active, active = that.active,
clicked = $( event.currentTarget ), anchor = $( event.currentTarget ),
clickedIsActive = clicked[ 0 ] === active[ 0 ], tab = anchor.closest( "li" ),
clickedIsActive = tab[ 0 ] === active[ 0 ],
collapsing = clickedIsActive && options.collapsible, collapsing = clickedIsActive && options.collapsible,
toShow = collapsing ? $() : that._getPanelForTab( clicked ), toShow = collapsing ? $() : that._getPanelForTab( tab ),
toHide = !active.length ? $() : that._getPanelForTab( active ), toHide = !active.length ? $() : that._getPanelForTab( active ),
tab = clicked.closest( "li" ),
eventData = { eventData = {
oldTab: active, oldTab: active,
oldPanel: toHide, oldPanel: toHide,
newTab: collapsing ? $() : clicked, newTab: collapsing ? $() : tab,
newPanel: toShow newPanel: toShow
}; };
@ -318,13 +320,13 @@ $.widget( "ui.tabs", {
( clickedIsActive && !options.collapsible ) || ( clickedIsActive && !options.collapsible ) ||
// allow canceling activation // allow canceling activation
( that._trigger( "beforeActivate", event, eventData ) === false ) ) { ( that._trigger( "beforeActivate", event, eventData ) === false ) ) {
clicked[ 0 ].blur(); anchor[ 0 ].blur();
return; return;
} }
options.active = collapsing ? false : that.anchors.index( clicked ); options.active = collapsing ? false : that.lis.index( tab );
that.active = clickedIsActive ? $() : clicked; that.active = clickedIsActive ? $() : tab;
if ( that.xhr ) { if ( that.xhr ) {
that.xhr.abort(); that.xhr.abort();
} }
@ -335,8 +337,8 @@ $.widget( "ui.tabs", {
if ( toShow.length ) { if ( toShow.length ) {
// TODO make passing in node possible // TODO make passing in node possible
that.load( that.anchors.index( clicked ), event ); that.load( that.lis.index( tab ), event );
clicked[ 0 ].blur(); anchor[ 0 ].blur();
} }
that._toggle( event, eventData ); that._toggle( event, eventData );
}, },
@ -379,31 +381,39 @@ $.widget( "ui.tabs", {
}, },
_activate: function( index ) { _activate: function( index ) {
var active = this._findActive( index )[ 0 ]; var anchor,
active = this._findActive( index );
// trying to activate the already active panel // trying to activate the already active panel
if ( active === this.active[ 0 ] ) { if ( active[ 0 ] === this.active[ 0 ] ) {
return; return;
} }
// trying to collapse, simulate a click on the current active header // trying to collapse, simulate a click on the current active header
active = active || this.active[ 0 ]; if ( !active.length ) {
active = this.active;
}
anchor = active.find( ".ui-tabs-anchor" )[ 0 ];
this._eventHandler({ this._eventHandler({
target: active, target: anchor,
currentTarget: active, currentTarget: anchor,
preventDefault: $.noop preventDefault: $.noop
}); });
}, },
_findActive: function( selector ) { _findActive: function( selector ) {
return typeof selector === "number" ? this.anchors.eq( selector ) : if ( typeof selector === "number" ) {
typeof selector === "string" ? this.anchors.filter( "[href$='" + selector + "']" ) : $(); return this.lis.eq( selector );
}
if ( typeof selector === "string" ) {
return this.anchors.filter( "[href$='" + selector + "']" ).closest( "li" );
}
return $();
}, },
_getIndex: function( index ) { _getIndex: function( index ) {
// meta-function to give users option to provide a href string instead of a numerical index. // meta-function to give users option to provide a href string instead of a numerical index.
// also sanitizes numerical indexes to valid values.
if ( typeof index === "string" ) { if ( typeof index === "string" ) {
index = this.anchors.index( this.anchors.filter( "[href$='" + index + "']" ) ); index = this.anchors.index( this.anchors.filter( "[href$='" + index + "']" ) );
} }
@ -421,6 +431,7 @@ $.widget( "ui.tabs", {
this.list.removeClass( "ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all" ); this.list.removeClass( "ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all" );
this.anchors this.anchors
.removeClass( "ui-tabs-anchor" )
.unbind( ".tabs" ) .unbind( ".tabs" )
.removeData( "href.tabs" ) .removeData( "href.tabs" )
.removeData( "load.tabs" ); .removeData( "load.tabs" );
@ -493,10 +504,11 @@ $.widget( "ui.tabs", {
load: function( index, event ) { load: function( index, event ) {
index = this._getIndex( index ); index = this._getIndex( index );
var that = this, var that = this,
anchor = this.anchors.eq( index ), tab = this.lis.eq( index ),
panel = that._getPanelForTab( anchor ), anchor = tab.find( ".ui-tabs-anchor" ),
panel = that._getPanelForTab( tab ),
eventData = { eventData = {
tab: anchor, tab: tab,
panel: panel panel: panel
}; };
@ -517,7 +529,7 @@ $.widget( "ui.tabs", {
// jQuery <1.8 returns false if the request is canceled in beforeSend, // jQuery <1.8 returns false if the request is canceled in beforeSend,
// but as of 1.8, $.ajax() always returns a jqXHR object. // but as of 1.8, $.ajax() always returns a jqXHR object.
if ( this.xhr && this.xhr.statusText !== "canceled" ) { if ( this.xhr && this.xhr.statusText !== "canceled" ) {
this.lis.eq( index ).addClass( "ui-tabs-loading" ); tab.addClass( "ui-tabs-loading" );
this.xhr this.xhr
.success(function( response ) { .success(function( response ) {
@ -536,7 +548,7 @@ $.widget( "ui.tabs", {
that.panels.stop( false, true ); that.panels.stop( false, true );
} }
that.lis.eq( index ).removeClass( "ui-tabs-loading" ); tab.removeClass( "ui-tabs-loading" );
if ( jqXHR === that.xhr ) { if ( jqXHR === that.xhr ) {
delete that.xhr; delete that.xhr;
@ -723,10 +735,10 @@ if ( $.uiBackCompat !== false ) {
.replace( /#\{label\}/g, label ) ), .replace( /#\{label\}/g, label ) ),
id = !url.indexOf( "#" ) ? id = !url.indexOf( "#" ) ?
url.replace( "#", "" ) : url.replace( "#", "" ) :
this._tabId( li.find( "a" )[ 0 ] ); this._tabId( li );
li.addClass( "ui-state-default ui-corner-top" ).data( "ui-tabs-destroy", true ); li.addClass( "ui-state-default ui-corner-top" ).data( "ui-tabs-destroy", true );
li.find( "a" ).attr( "aria-controls", id ); li.attr( "aria-controls", id );
doInsertAfter = index >= this.lis.length; doInsertAfter = index >= this.lis.length;
@ -769,7 +781,7 @@ if ( $.uiBackCompat !== false ) {
index = this._getIndex( index ); index = this._getIndex( index );
var options = this.options, var options = this.options,
tab = this.lis.eq( index ).remove(), tab = this.lis.eq( index ).remove(),
panel = this._getPanelForTab( tab.find( "a[aria-controls]" ) ).remove(); panel = this._getPanelForTab( tab ).remove();
// If selected tab was removed focus tab to the right or // If selected tab was removed focus tab to the right or
// in case the last tab was removed the tab to the left. // in case the last tab was removed the tab to the left.
@ -808,8 +820,10 @@ if ( $.uiBackCompat !== false ) {
idPrefix: "ui-tabs-" idPrefix: "ui-tabs-"
}, },
_tabId: function( a ) { _tabId: function( tab ) {
return $( a ).attr( "aria-controls" ) || var a = tab.is( "li" ) ? tab.find( "a[href]" ) : tab;
a = a[0];
return $( a ).closest( "li" ).attr( "aria-controls" ) ||
a.title && a.title.replace( /\s/g, "_" ).replace( /[^\w\u00c0-\uFFFF\-]/g, "" ) || a.title && a.title.replace( /\s/g, "_" ).replace( /[^\w\u00c0-\uFFFF\-]/g, "" ) ||
this.options.idPrefix + getNextTabId(); this.options.idPrefix + getNextTabId();
} }
@ -875,7 +889,8 @@ if ( $.uiBackCompat !== false ) {
this._super(); this._super();
if ( this.options.active !== false ) { if ( this.options.active !== false ) {
this._trigger( "show", null, this._ui( this._trigger( "show", null, this._ui(
this.active[ 0 ], this._getPanelForTab( this.active )[ 0 ] ) ); this.active.find( ".ui-tabs-anchor" )[ 0 ],
this._getPanelForTab( this.active )[ 0 ] ) );
} }
}, },
_trigger: function( type, event, data ) { _trigger: function( type, event, data ) {
@ -885,13 +900,13 @@ if ( $.uiBackCompat !== false ) {
} }
if ( type === "beforeActivate" && data.newTab.length ) { if ( type === "beforeActivate" && data.newTab.length ) {
ret = this._super( "select", event, { ret = this._super( "select", event, {
tab: data.newTab[ 0], tab: data.newTab.find( ".ui-tabs-anchor" )[ 0],
panel: data.newPanel[ 0 ], panel: data.newPanel[ 0 ],
index: data.newTab.closest( "li" ).index() index: data.newTab.closest( "li" ).index()
}); });
} else if ( type === "activate" && data.newTab.length ) { } else if ( type === "activate" && data.newTab.length ) {
ret = this._super( "show", event, { ret = this._super( "show", event, {
tab: data.newTab[ 0 ], tab: data.newTab.find( ".ui-tabs-anchor" )[ 0 ],
panel: data.newPanel[ 0 ], panel: data.newPanel[ 0 ],
index: data.newTab.closest( "li" ).index() index: data.newTab.closest( "li" ).index()
}); });
@ -973,7 +988,7 @@ if ( $.uiBackCompat !== false ) {
var _data = $.extend( {}, data ); var _data = $.extend( {}, data );
if ( type === "load" ) { if ( type === "load" ) {
_data.panel = _data.panel[ 0 ]; _data.panel = _data.panel[ 0 ];
_data.tab = _data.tab[ 0 ]; _data.tab = _data.tab.find( ".ui-tabs-anchor" )[ 0 ];
} }
return this._super( type, event, _data ); return this._super( type, event, _data );
} }