From: Alexander Schmitz Date: Fri, 30 Jan 2015 16:00:44 +0000 (-0500) Subject: Tabs: Use new has/lacksClasses assertions for all class checks X-Git-Tag: 1.12.0-beta.1~385 X-Git-Url: https://source.dussan.org/?a=commitdiff_plain;h=b88a8210707a0c88db381927d0da8cdde4402ef7;p=jquery-ui.git Tabs: Use new has/lacksClasses assertions for all class checks --- diff --git a/tests/unit/tabs/tabs_core.js b/tests/unit/tabs/tabs_core.js index b003fa61e..881571f5d 100644 --- a/tests/unit/tabs/tabs_core.js +++ b/tests/unit/tabs/tabs_core.js @@ -38,12 +38,11 @@ $.each({ "multiple lists, ol first": "#tabs5", "empty list": "#tabs6" }, function( type, selector ) { - test( "markup structure: " + type, function() { + test( "markup structure: " + type, function( assert ) { expect( 2 ); var element = $( selector ).tabs(); - ok( element.hasClass( "ui-tabs" ), "main element is .ui-tabs" ); - ok( $( selector + "-list" ).hasClass( "ui-tabs-nav" ), - "list item is .ui-tabs-nav" ); + assert.hasClasses( element, "ui-tabs" ); + assert.hasClasses( $( selector + "-list" ), "ui-tabs-nav" ); }); }); @@ -168,7 +167,7 @@ asyncTest( "accessibility - ajax", function( assert ) { }); }); -asyncTest( "keyboard support - LEFT, RIGHT, UP, DOWN, HOME, END, SPACE, ENTER", function() { +asyncTest( "keyboard support - LEFT, RIGHT, UP, DOWN, HOME, END, SPACE, ENTER", function( assert ) { expect( 92 ); var element = $( "#tabs1" ).tabs({ collapsible: true @@ -184,13 +183,13 @@ asyncTest( "keyboard support - LEFT, RIGHT, UP, DOWN, HOME, END, SPACE, ENTER", // down, right, down (wrap), up (wrap) function step1() { - ok( tabs.eq( 0 ).is( ".ui-state-focus" ), "first tab has focus" ); + assert.hasClasses( tabs.eq( 0 ), "ui-state-focus", "first tab has focus" ); equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); ok( panels.eq( 0 ).is( ":visible" ), "first panel is visible" ); tabs.eq( 0 ).simulate( "keydown", { keyCode: keyCode.DOWN } ); - ok( tabs.eq( 1 ).is( ".ui-state-focus" ), "DOWN moves focus to next tab" ); - ok( !tabs.eq( 0 ).is( ".ui-state-focus" ), "first tab is no longer focused" ); + assert.hasClasses( tabs.eq( 1 ), "ui-state-focus", "DOWN moves focus to next tab" ); + assert.lacksClasses( tabs.eq( 0 ), "ui-state-focus", "first tab is no longer focused" ); equal( tabs.eq( 1 ).attr( "aria-selected" ), "true", "second tab has aria-selected=true" ); equal( tabs.eq( 0 ).attr( "aria-selected" ), "false", "first tab has aria-selected=false" ); ok( panels.eq( 1 ).is( ":hidden" ), "second panel is still hidden" ); @@ -201,7 +200,7 @@ asyncTest( "keyboard support - LEFT, RIGHT, UP, DOWN, HOME, END, SPACE, ENTER", equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); tabs.eq( 1 ).simulate( "keydown", { keyCode: keyCode.RIGHT } ); - ok( tabs.eq( 2 ).is( ".ui-state-focus" ), "RIGHT moves focus to next tab" ); + assert.hasClasses( tabs.eq( 2 ), "ui-state-focus", "RIGHT moves focus to next tab" ); equal( tabs.eq( 2 ).attr( "aria-selected" ), "true", "third tab has aria-selected=true" ); equal( tabs.eq( 1 ).attr( "aria-selected" ), "false", "second tab has aria-selected=false" ); ok( panels.eq( 2 ).is( ":hidden" ), "third panel is still hidden" ); @@ -212,7 +211,7 @@ asyncTest( "keyboard support - LEFT, RIGHT, UP, DOWN, HOME, END, SPACE, ENTER", equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); tabs.eq( 2 ).simulate( "keydown", { keyCode: keyCode.DOWN } ); - ok( tabs.eq( 0 ).is( ".ui-state-focus" ), "DOWN wraps focus to first tab" ); + assert.hasClasses( tabs.eq( 0 ), "ui-state-focus", "DOWN wraps focus to first tab" ); equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); equal( tabs.eq( 2 ).attr( "aria-selected" ), "false", "third tab has aria-selected=false" ); ok( panels.eq( 0 ).is( ":visible" ), "first panel is still visible" ); @@ -220,7 +219,7 @@ asyncTest( "keyboard support - LEFT, RIGHT, UP, DOWN, HOME, END, SPACE, ENTER", equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); tabs.eq( 0 ).simulate( "keydown", { keyCode: keyCode.UP } ); - ok( tabs.eq( 2 ).is( ".ui-state-focus" ), "UP wraps focus to last tab" ); + assert.hasClasses( tabs.eq( 2 ), "ui-state-focus", "UP wraps focus to last tab" ); equal( tabs.eq( 2 ).attr( "aria-selected" ), "true", "third tab has aria-selected=true" ); equal( tabs.eq( 0 ).attr( "aria-selected" ), "false", "first tab has aria-selected=false" ); ok( panels.eq( 2 ).is( ":hidden" ), "third panel is still hidden" ); @@ -245,7 +244,7 @@ asyncTest( "keyboard support - LEFT, RIGHT, UP, DOWN, HOME, END, SPACE, ENTER", equal( panels.eq( 0 ).attr( "aria-hidden" ), "true", "first panel has aria-hidden=true" ); tabs.eq( 2 ).simulate( "keydown", { keyCode: keyCode.LEFT } ); - ok( tabs.eq( 1 ).is( ".ui-state-focus" ), "LEFT moves focus to previous tab" ); + assert.hasClasses( tabs.eq( 1 ), "ui-state-focus", "LEFT moves focus to previous tab" ); equal( tabs.eq( 1 ).attr( "aria-selected" ), "true", "second tab has aria-selected=true" ); equal( tabs.eq( 2 ).attr( "aria-selected" ), "false", "third tab has aria-selected=false" ); ok( panels.eq( 1 ).is( ":hidden" ), "second panel is still hidden" ); @@ -256,7 +255,7 @@ asyncTest( "keyboard support - LEFT, RIGHT, UP, DOWN, HOME, END, SPACE, ENTER", equal( panels.eq( 2 ).attr( "aria-hidden" ), "false", "third panel has aria-hidden=false" ); tabs.eq( 1 ).simulate( "keydown", { keyCode: keyCode.HOME } ); - ok( tabs.eq( 0 ).is( ".ui-state-focus" ), "HOME moves focus to first tab" ); + assert.hasClasses( tabs.eq( 0 ), "ui-state-focus", "HOME moves focus to first tab" ); equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); equal( tabs.eq( 1 ).attr( "aria-selected" ), "false", "second tab has aria-selected=false" ); ok( panels.eq( 0 ).is( ":hidden" ), "first panel is still hidden" ); @@ -283,7 +282,7 @@ asyncTest( "keyboard support - LEFT, RIGHT, UP, DOWN, HOME, END, SPACE, ENTER", equal( panels.eq( 2 ).attr( "aria-hidden" ), "true", "third panel has aria-hidden=true" ); tabs.eq( 0 ).simulate( "keydown", { keyCode: keyCode.END } ); - ok( tabs.eq( 2 ).is( ".ui-state-focus" ), "END moves focus to last tab" ); + assert.hasClasses( tabs.eq( 2 ), "ui-state-focus", "END moves focus to last tab" ); equal( tabs.eq( 2 ).attr( "aria-selected" ), "true", "third tab has aria-selected=true" ); equal( tabs.eq( 0 ).attr( "aria-selected" ), "false", "first tab has aria-selected=false" ); ok( panels.eq( 2 ).is( ":hidden" ), "third panel is still hidden" ); @@ -326,7 +325,7 @@ $.each({ ctrl: "CTRL", meta: "COMMAND" }, function( modifier, label ) { - asyncTest( "keyboard support - " + label + " navigation", function() { + asyncTest( "keyboard support - " + label + " navigation", function( assert ) { expect( 115 ); var element = $( "#tabs1" ).tabs(), tabs = element.find( ".ui-tabs-nav li" ), @@ -343,13 +342,13 @@ $.each({ var eventProperties = { keyCode: keyCode.DOWN }; eventProperties[ modifier + "Key" ] = true; - ok( tabs.eq( 0 ).is( ".ui-state-focus" ), "first tab has focus" ); + assert.hasClasses( tabs.eq( 0 ), "ui-state-focus", "first tab has focus" ); equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); ok( panels.eq( 0 ).is( ":visible" ), "first panel is visible" ); tabs.eq( 0 ).simulate( "keydown", eventProperties ); - ok( tabs.eq( 1 ).is( ".ui-state-focus" ), "DOWN moves focus to next tab" ); - ok( !tabs.eq( 0 ).is( ".ui-state-focus" ), "first tab is no longer focused" ); + assert.hasClasses( tabs.eq( 1 ), "ui-state-focus", "DOWN moves focus to next tab" ); + assert.lacksClasses( tabs.eq( 0 ), ".ui-state-focus", "first tab is no longer focused" ); equal( tabs.eq( 1 ).attr( "aria-selected" ), "false", "second tab has aria-selected=false" ); equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); ok( panels.eq( 1 ).is( ":hidden" ), "second panel is still hidden" ); @@ -376,7 +375,7 @@ $.each({ equal( panels.eq( 1 ).attr( "aria-hidden" ), "true", "second panel has aria-hidden=true" ); tabs.eq( 1 ).simulate( "keydown", eventProperties ); - ok( tabs.eq( 2 ).is( ".ui-state-focus" ), "RIGHT moves focus to next tab" ); + assert.hasClasses( tabs.eq( 2 ), "ui-state-focus", "RIGHT moves focus to next tab" ); equal( tabs.eq( 2 ).attr( "aria-selected" ), "false", "third tab has aria-selected=false" ); equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); ok( panels.eq( 2 ).is( ":hidden" ), "third panel is still hidden" ); @@ -403,7 +402,7 @@ $.each({ equal( panels.eq( 2 ).attr( "aria-hidden" ), "true", "third panel has aria-hidden=true" ); tabs.eq( 2 ).simulate( "keydown", eventProperties ); - ok( tabs.eq( 0 ).is( ".ui-state-focus" ), "DOWN wraps focus to first tab" ); + assert.hasClasses( tabs.eq( 0 ), "ui-state-focus", "DOWN wraps focus to first tab" ); equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); ok( panels.eq( 0 ).is( ":visible" ), "first panel is still visible" ); equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); @@ -423,7 +422,7 @@ $.each({ equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); tabs.eq( 0 ).simulate( "keydown", eventProperties ); - ok( tabs.eq( 2 ).is( ".ui-state-focus" ), "UP wraps focus to last tab" ); + assert.hasClasses( tabs.eq( 2 ), "ui-state-focus", "UP wraps focus to last tab" ); equal( tabs.eq( 2 ).attr( "aria-selected" ), "false", "third tab has aria-selected=false" ); equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); ok( panels.eq( 2 ).is( ":hidden" ), "third panel is still hidden" ); @@ -450,7 +449,7 @@ $.each({ equal( panels.eq( 2 ).attr( "aria-hidden" ), "true", "third panel has aria-hidden=true" ); tabs.eq( 2 ).simulate( "keydown", eventProperties ); - ok( tabs.eq( 1 ).is( ".ui-state-focus" ), "LEFT moves focus to previous tab" ); + assert.hasClasses( tabs.eq( 1 ), "ui-state-focus", "LEFT moves focus to previous tab" ); equal( tabs.eq( 1 ).attr( "aria-selected" ), "false", "second tab has aria-selected=false" ); equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); ok( panels.eq( 1 ).is( ":hidden" ), "second panel is still hidden" ); @@ -477,7 +476,7 @@ $.each({ equal( panels.eq( 1 ).attr( "aria-hidden" ), "true", "second panel has aria-hidden=true" ); tabs.eq( 1 ).simulate( "keydown", eventProperties ); - ok( tabs.eq( 0 ).is( ".ui-state-focus" ), "HOME moves focus to first tab" ); + assert.hasClasses( tabs.eq( 0 ), "ui-state-focus", "HOME moves focus to first tab" ); equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); equal( tabs.eq( 1 ).attr( "aria-selected" ), "false", "second tab has aria-selected=false" ); ok( panels.eq( 1 ).is( ":hidden" ), "second panel is still hidden" ); @@ -501,7 +500,7 @@ $.each({ equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" ); tabs.eq( 0 ).simulate( "keydown", eventProperties ); - ok( tabs.eq( 2 ).is( ".ui-state-focus" ), "END moves focus to last tab" ); + assert.hasClasses( tabs.eq( 2 ), "ui-state-focus", "END moves focus to last tab" ); equal( tabs.eq( 2 ).attr( "aria-selected" ), "false", "third tab has aria-selected=false" ); equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); ok( panels.eq( 2 ).is( ":hidden" ), "third panel is still hidden" ); @@ -541,7 +540,7 @@ $.each({ }); }); -asyncTest( "keyboard support - CTRL+UP, ALT+PAGE_DOWN, ALT+PAGE_UP", function() { +asyncTest( "keyboard support - CTRL+UP, ALT+PAGE_DOWN, ALT+PAGE_UP", function( assert ) { expect( 50 ); var element = $( "#tabs1" ).tabs(), tabs = element.find( ".ui-tabs-nav li" ), @@ -557,7 +556,7 @@ asyncTest( "keyboard support - CTRL+UP, ALT+PAGE_DOWN, ALT+PAGE_UP", function() panels.eq( 0 ).simulate( "keydown", { keyCode: keyCode.PAGE_DOWN, altKey: true } ); strictEqual( document.activeElement, tabs[ 1 ], "second tab is activeElement" ); - ok( tabs.eq( 1 ).is( ".ui-state-focus" ), "ALT+PAGE_DOWN moves focus to next tab" ); + assert.hasClasses( tabs.eq( 1 ), "ui-state-focus", "ALT+PAGE_DOWN moves focus to next tab" ); equal( tabs.eq( 1 ).attr( "aria-selected" ), "true", "second tab has aria-selected=true" ); ok( panels.eq( 1 ).is( ":visible" ), "second panel is visible" ); equal( tabs.eq( 1 ).attr( "aria-expanded" ), "true", "second tab has aria-expanded=true" ); @@ -568,7 +567,7 @@ asyncTest( "keyboard support - CTRL+UP, ALT+PAGE_DOWN, ALT+PAGE_UP", function() tabs.eq( 1 ).simulate( "keydown", { keyCode: keyCode.PAGE_DOWN, altKey: true } ); strictEqual( document.activeElement, tabs[ 2 ], "third tab is activeElement" ); - ok( tabs.eq( 2 ).is( ".ui-state-focus" ), "ALT+PAGE_DOWN moves focus to next tab" ); + assert.hasClasses( tabs.eq( 2 ), "ui-state-focus", "ALT+PAGE_DOWN moves focus to next tab" ); equal( tabs.eq( 2 ).attr( "aria-selected" ), "true", "third tab has aria-selected=true" ); ok( panels.eq( 2 ).is( ":visible" ), "third panel is visible" ); equal( tabs.eq( 2 ).attr( "aria-expanded" ), "true", "third tab has aria-expanded=true" ); @@ -579,7 +578,7 @@ asyncTest( "keyboard support - CTRL+UP, ALT+PAGE_DOWN, ALT+PAGE_UP", function() tabs.eq( 2 ).simulate( "keydown", { keyCode: keyCode.PAGE_DOWN, altKey: true } ); strictEqual( document.activeElement, tabs[ 0 ], "first tab is activeElement" ); - ok( tabs.eq( 0 ).is( ".ui-state-focus" ), "ALT+PAGE_DOWN wraps focus to first tab" ); + assert.hasClasses( tabs.eq( 0 ), "ui-state-focus", "ALT+PAGE_DOWN wraps focus to first tab" ); equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" ); ok( panels.eq( 0 ).is( ":visible" ), "first panel is visible" ); equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" ); @@ -597,7 +596,7 @@ asyncTest( "keyboard support - CTRL+UP, ALT+PAGE_DOWN, ALT+PAGE_UP", function() panels.eq( 0 ).simulate( "keydown", { keyCode: keyCode.PAGE_UP, altKey: true } ); strictEqual( document.activeElement, tabs[ 2 ], "third tab is activeElement" ); - ok( tabs.eq( 2 ).is( ".ui-state-focus" ), "ALT+PAGE_UP wraps focus to last tab" ); + assert.hasClasses( tabs.eq( 2 ), "ui-state-focus", "ALT+PAGE_UP wraps focus to last tab" ); equal( tabs.eq( 2 ).attr( "aria-selected" ), "true", "third tab has aria-selected=true" ); ok( panels.eq( 2 ).is( ":visible" ), "third panel is visible" ); equal( tabs.eq( 2 ).attr( "aria-expanded" ), "true", "third tab has aria-expanded=true" ); @@ -608,7 +607,7 @@ asyncTest( "keyboard support - CTRL+UP, ALT+PAGE_DOWN, ALT+PAGE_UP", function() tabs.eq( 2 ).simulate( "keydown", { keyCode: keyCode.PAGE_UP, altKey: true } ); strictEqual( document.activeElement, tabs[ 1 ], "second tab is activeElement" ); - ok( tabs.eq( 1 ).is( ".ui-state-focus" ), "ALT+PAGE_UP moves focus to previous tab" ); + assert.hasClasses( tabs.eq( 1 ), "ui-state-focus", "ALT+PAGE_UP moves focus to previous tab" ); equal( tabs.eq( 1 ).attr( "aria-selected" ), "true", "second tab has aria-selected=true" ); ok( panels.eq( 1 ).is( ":visible" ), "second panel is visible" ); equal( tabs.eq( 1 ).attr( "aria-expanded" ), "true", "second tab has aria-expanded=true" ); diff --git a/tests/unit/tabs/tabs_options.js b/tests/unit/tabs/tabs_options.js index 3983721d5..572ce3c20 100644 --- a/tests/unit/tabs/tabs_options.js +++ b/tests/unit/tabs/tabs_options.js @@ -107,15 +107,14 @@ test( "active - mismatched tab/panel order", function() { location.hash = "#"; }); -test( "collapsible", function() { +test( "collapsible", function( assert ) { expect( 13 ); var element = $( "#tabs1" ).tabs({ active: 1, collapsible: true }); - ok( element.hasClass( "ui-tabs-collapsible" ), "main element is .ui-tabs-collapsible" ); - + assert.hasClasses( element, "ui-tabs-collapsible" ); element.tabs( "option", "active", false ); equal( element.tabs( "option", "active" ), false ); state( element, 0, 0, 0 ); @@ -129,10 +128,11 @@ test( "collapsible", function() { state( element, 0, 0, 0 ); element.tabs( "option", "collapsible", false ); - ok( !element.hasClass( "ui-tabs-collapsible" ), "main element is not .ui-tabs-collapsible" ); + assert.lacksClasses( element, "ui-tabs-collapsible" ); element.tabs( "option", "collapsible", true ); - ok( element.hasClass( "ui-tabs-collapsible" ), "main element is .ui-tabs-collapsible" ); + + assert.hasClasses( element, "ui-tabs-collapsible" ); element.tabs({ active: 1, @@ -145,9 +145,10 @@ test( "collapsible", function() { element.find( ".ui-state-active .ui-tabs-anchor" ).eq( 1 ).click(); equal( element.tabs( "option", "active" ), 1 ); state( element, 0, 1, 0 ); + }); -test( "disabled", function() { +test( "disabled", function( assert ) { expect( 23 ); // fully enabled by default @@ -155,32 +156,32 @@ test( "disabled", function() { element = $( "#tabs1" ).tabs(); disabled( element, false ); - ok( !element.tabs( "widget" ).hasClass( "ui-state-disabled" ), "after: wrapper doesn't have ui-state-disabled class" ); - ok( !element.tabs( "widget" ).hasClass( "ui-tabs-disabled" ), "after: wrapper doesn't have ui-tabs-disabled class" ); + assert.lacksClasses( element.tabs( "widget" ), "ui-state-disabled" ); + assert.lacksClasses( element.tabs( "widget" ), "ui-tabs-disabled" ); ok( !element.tabs( "widget" ).attr( "aria-disabled" ), "after: wrapper doesn't have aria-disabled attr" ); // disable single tab element.tabs( "option", "disabled", [ 1 ] ); disabled( element, [ 1 ] ); - ok( !element.tabs( "widget" ).hasClass( "ui-state-disabled" ), "after: wrapper doesn't have ui-state-disabled class" ); - ok( !element.tabs( "widget" ).hasClass( "ui-tabs-disabled" ), "after: wrapper doesn't have ui-tabs-disabled class" ); + assert.lacksClasses( element.tabs( "widget" ), "ui-state-disabled" ); + assert.lacksClasses( element.tabs( "widget" ), "ui-tabs-disabled" ); ok( !element.tabs( "widget" ).attr( "aria-disabled" ), "after: wrapper doesn't have aria-disabled attr" ); // disabled active tab element.tabs( "option", "disabled", [ 0, 1 ] ); disabled( element, [ 0, 1 ] ); - ok( !element.tabs( "widget" ).hasClass( "ui-state-disabled" ), "after: wrapper doesn't have ui-state-disabled class" ); - ok( !element.tabs( "widget" ).hasClass( "ui-tabs-disabled" ), "after: wrapper doesn't have ui-tabs-disabled class" ); + assert.lacksClasses( element.tabs( "widget" ), "ui-state-disabled" ); + assert.lacksClasses( element.tabs( "widget" ), "ui-tabs-disabled" ); ok( !element.tabs( "widget" ).attr( "aria-disabled" ), "after: wrapper doesn't have aria-disabled attr" ); // disable all tabs element.tabs( "option", "disabled", [ 0, 1, 2 ] ); disabled( element, true ); - ok( !element.tabs( "widget" ).hasClass( "ui-state-disabled" ), "after: wrapper doesn't have ui-state-disabled class" ); - ok( !element.tabs( "widget" ).hasClass( "ui-tabs-disabled" ), "after: wrapper doesn't have ui-tabs-disabled class" ); + assert.lacksClasses( element.tabs( "widget" ), "ui-state-disabled" ); + assert.lacksClasses( element.tabs( "widget" ), "ui-tabs-disabled" ); ok( !element.tabs( "widget" ).attr( "aria-disabled" ), "after: wrapper doesn't have aria-disabled attr" ); event = $.Event( "click" );