Skip to content

Commit 1709c91

Browse files
arschmitzarschmitz
committed
Tabs: Use new has/lacksClasses assertions for all class checks
1 parent c08e7ee commit 1709c91

File tree

3 files changed

+54
-52
lines changed

3 files changed

+54
-52
lines changed

‎tests/unit/tabs/tabs.html

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,7 @@
99
<script src="../../../external/qunit/qunit.js"></script>
1010
<script src="../../../external/jquery-simulate/jquery.simulate.js"></script>
1111
<script src="../testsuite.js"></script>
12+
<script src="../../../external/qunit-assert-classes/qunit-assert-classes.js"></script>
1213
<script>
1314
TestHelpers.loadResources({
1415
css: [ "core", "tabs" ],

‎tests/unit/tabs/tabs_core.js

Lines changed: 40 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -5,19 +5,22 @@ var state = TestHelpers.tabs.state;
55
module( "tabs: core" );
66

77
test( "markup structure", function( assert ) {
8-
expect( 7 );
8+
expect( 11 );
99
var element = $( "#tabs1" ).tabs(),
1010
ul = element.find( "ul.ui-tabs-nav" ),
1111
tabs = ul.find( "li" ),
1212
active = tabs.eq( 0 );
1313

14-
assert.hasClasses( element, "ui-tabs ui-widget ui-widget-content" )
14+
assert.hasClasses( element, "ui-tabs ui-widget ui-widget-content" );
1515
assert.hasClasses( ul, "ui-tabs-nav ui-widget-header" );
16-
assert.hasClasses( tabs, "ui-tab ui-state-default" );
17-
assert.hasClasses( element.find( "a" ), "ui-tabs-anchor" );
16+
assert.hasClasses( tabs[ 0 ], "ui-tab ui-state-default" );
17+
assert.hasClasses( tabs[ 1 ], "ui-tab ui-state-default" );
18+
assert.hasClasses( tabs[ 2 ], "ui-tab ui-state-default" );
19+
assert.hasClasses( element.find( "a" )[ 0 ], "ui-tabs-anchor" );
20+
assert.hasClasses( element.find( "a" )[ 1 ], "ui-tabs-anchor" );
21+
assert.hasClasses( element.find( "a" )[ 2 ], "ui-tabs-anchor" );
1822
assert.hasClasses( active, "ui-tabs-active ui-state-default" );
19-
ok( !element.hasClass( "ui-tabs-collapsible" ),
20-
"Main element does not have class ui-tabs-collapsible" );
23+
assert.lacksClasses( element, "ui-tabs-collapsible" );
2124
equal( element.find( ".ui-tabs-panel.ui-widget-content.ui-corner-bottom" ).length, 3,
2225
".ui-tabs-panel elements exist, correct number" );
2326
});
@@ -28,12 +31,11 @@ $.each({
2831
"multiple lists, ol first": "#tabs5",
2932
"empty list": "#tabs6"
3033
}, function( type, selector ) {
31-
test( "markup structure: " + type, function() {
34+
test( "markup structure: " + type, function( assert ) {
3235
expect( 2 );
3336
var element = $( selector ).tabs();
34-
ok( element.hasClass( "ui-tabs" ), "main element is .ui-tabs" );
35-
ok( $( selector + "-list" ).hasClass( "ui-tabs-nav" ),
36-
"list item is .ui-tabs-nav" );
37+
assert.hasClasses( element, "ui-tabs" );
38+
assert.hasClasses( $( selector + "-list" ), "ui-tabs-nav" );
3739
});
3840
});
3941

@@ -138,7 +140,7 @@ test( "accessibility", function() {
138140
equal( panels.eq( 2 ).attr( "aria-hidden" ), "true", "inactive panel has aria-hidden=true" );
139141
});
140142

141-
asyncTest( "accessibility - ajax", function() {
143+
asyncTest( "accessibility - ajax", function( assert ) {
142144
expect( 5 );
143145
var element = $( "#tabs2" ).tabs(),
144146
tab = element.find( ".ui-tabs-nav li" ).eq( 3 ),
@@ -151,13 +153,13 @@ asyncTest( "accessibility - ajax", function() {
151153
element.one( "tabsload", function() {
152154
setTimeout(function() {
153155
equal( panel.attr( "aria-busy" ), null, "panel does not have aria-busy after load" );
154-
ok( !tab.hasClass( "ui-tabs-loading" ), "tab is not .ui-tabs-loading after load" );
156+
assert.lacksClasses( tab, "ui-tabs-loading" );
155157
start();
156158
}, 1 );
157159
});
158160
});
159161

160-
asyncTest( "keyboard support - LEFT, RIGHT, UP, DOWN, HOME, END, SPACE, ENTER", function() {
162+
asyncTest( "keyboard support - LEFT, RIGHT, UP, DOWN, HOME, END, SPACE, ENTER", function( assert ) {
161163
expect( 92 );
162164
var element = $( "#tabs1" ).tabs({
163165
collapsible: true
@@ -173,13 +175,13 @@ asyncTest( "keyboard support - LEFT, RIGHT, UP, DOWN, HOME, END, SPACE, ENTER",
173175

174176
// down, right, down (wrap), up (wrap)
175177
function step1() {
176-
ok( tabs.eq( 0 ).is( ".ui-state-focus" ), "first tab has focus" );
178+
assert.hasClasses( tabs.eq( 0 ), "ui-state-focus", "first tab has focus" );
177179
equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" );
178180
ok( panels.eq( 0 ).is( ":visible" ), "first panel is visible" );
179181

180182
tabs.eq( 0 ).simulate( "keydown", { keyCode: keyCode.DOWN } );
181-
ok( tabs.eq( 1 ).is( ".ui-state-focus" ), "DOWN moves focus to next tab" );
182-
ok( !tabs.eq( 0 ).is( ".ui-state-focus" ), "first tab is no longer focused" );
183+
assert.hasClasses( tabs.eq( 1 ), "ui-state-focus", "DOWN moves focus to next tab" );
184+
assert.lacksClasses( tabs.eq( 0 ), "ui-state-focus", "first tab is no longer focused" );
183185
equal( tabs.eq( 1 ).attr( "aria-selected" ), "true", "second tab has aria-selected=true" );
184186
equal( tabs.eq( 0 ).attr( "aria-selected" ), "false", "first tab has aria-selected=false" );
185187
ok( panels.eq( 1 ).is( ":hidden" ), "second panel is still hidden" );
@@ -190,7 +192,7 @@ asyncTest( "keyboard support - LEFT, RIGHT, UP, DOWN, HOME, END, SPACE, ENTER",
190192
equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" );
191193

192194
tabs.eq( 1 ).simulate( "keydown", { keyCode: keyCode.RIGHT } );
193-
ok( tabs.eq( 2 ).is( ".ui-state-focus" ), "RIGHT moves focus to next tab" );
195+
assert.hasClasses( tabs.eq( 2 ), "ui-state-focus", "RIGHT moves focus to next tab" );
194196
equal( tabs.eq( 2 ).attr( "aria-selected" ), "true", "third tab has aria-selected=true" );
195197
equal( tabs.eq( 1 ).attr( "aria-selected" ), "false", "second tab has aria-selected=false" );
196198
ok( panels.eq( 2 ).is( ":hidden" ), "third panel is still hidden" );
@@ -201,15 +203,15 @@ asyncTest( "keyboard support - LEFT, RIGHT, UP, DOWN, HOME, END, SPACE, ENTER",
201203
equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" );
202204

203205
tabs.eq( 2 ).simulate( "keydown", { keyCode: keyCode.DOWN } );
204-
ok( tabs.eq( 0 ).is( ".ui-state-focus" ), "DOWN wraps focus to first tab" );
206+
assert.hasClasses( tabs.eq( 0 ), "ui-state-focus", "DOWN wraps focus to first tab" );
205207
equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" );
206208
equal( tabs.eq( 2 ).attr( "aria-selected" ), "false", "third tab has aria-selected=false" );
207209
ok( panels.eq( 0 ).is( ":visible" ), "first panel is still visible" );
208210
equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" );
209211
equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" );
210212

211213
tabs.eq( 0 ).simulate( "keydown", { keyCode: keyCode.UP } );
212-
ok( tabs.eq( 2 ).is( ".ui-state-focus" ), "UP wraps focus to last tab" );
214+
assert.hasClasses( tabs.eq( 2 ), "ui-state-focus", "UP wraps focus to last tab" );
213215
equal( tabs.eq( 2 ).attr( "aria-selected" ), "true", "third tab has aria-selected=true" );
214216
equal( tabs.eq( 0 ).attr( "aria-selected" ), "false", "first tab has aria-selected=false" );
215217
ok( panels.eq( 2 ).is( ":hidden" ), "third panel is still hidden" );
@@ -234,7 +236,7 @@ asyncTest( "keyboard support - LEFT, RIGHT, UP, DOWN, HOME, END, SPACE, ENTER",
234236
equal( panels.eq( 0 ).attr( "aria-hidden" ), "true", "first panel has aria-hidden=true" );
235237

236238
tabs.eq( 2 ).simulate( "keydown", { keyCode: keyCode.LEFT } );
237-
ok( tabs.eq( 1 ).is( ".ui-state-focus" ), "LEFT moves focus to previous tab" );
239+
assert.hasClasses( tabs.eq( 1 ), "ui-state-focus", "LEFT moves focus to previous tab" );
238240
equal( tabs.eq( 1 ).attr( "aria-selected" ), "true", "second tab has aria-selected=true" );
239241
equal( tabs.eq( 2 ).attr( "aria-selected" ), "false", "third tab has aria-selected=false" );
240242
ok( panels.eq( 1 ).is( ":hidden" ), "second panel is still hidden" );
@@ -245,7 +247,7 @@ asyncTest( "keyboard support - LEFT, RIGHT, UP, DOWN, HOME, END, SPACE, ENTER",
245247
equal( panels.eq( 2 ).attr( "aria-hidden" ), "false", "third panel has aria-hidden=false" );
246248

247249
tabs.eq( 1 ).simulate( "keydown", { keyCode: keyCode.HOME } );
248-
ok( tabs.eq( 0 ).is( ".ui-state-focus" ), "HOME moves focus to first tab" );
250+
assert.hasClasses( tabs.eq( 0 ), "ui-state-focus", "HOME moves focus to first tab" );
249251
equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" );
250252
equal( tabs.eq( 1 ).attr( "aria-selected" ), "false", "second tab has aria-selected=false" );
251253
ok( panels.eq( 0 ).is( ":hidden" ), "first panel is still hidden" );
@@ -272,7 +274,7 @@ asyncTest( "keyboard support - LEFT, RIGHT, UP, DOWN, HOME, END, SPACE, ENTER",
272274
equal( panels.eq( 2 ).attr( "aria-hidden" ), "true", "third panel has aria-hidden=true" );
273275

274276
tabs.eq( 0 ).simulate( "keydown", { keyCode: keyCode.END } );
275-
ok( tabs.eq( 2 ).is( ".ui-state-focus" ), "END moves focus to last tab" );
277+
assert.hasClasses( tabs.eq( 2 ), "ui-state-focus", "END moves focus to last tab" );
276278
equal( tabs.eq( 2 ).attr( "aria-selected" ), "true", "third tab has aria-selected=true" );
277279
equal( tabs.eq( 0 ).attr( "aria-selected" ), "false", "first tab has aria-selected=false" );
278280
ok( panels.eq( 2 ).is( ":hidden" ), "third panel is still hidden" );
@@ -315,7 +317,7 @@ $.each({
315317
ctrl: "CTRL",
316318
meta: "COMMAND"
317319
}, function( modifier, label ) {
318-
asyncTest( "keyboard support - " + label + " navigation", function() {
320+
asyncTest( "keyboard support - " + label + " navigation", function( assert ) {
319321
expect( 115 );
320322
var element = $( "#tabs1" ).tabs(),
321323
tabs = element.find( ".ui-tabs-nav li" ),
@@ -332,13 +334,13 @@ $.each({
332334
var eventProperties = { keyCode: keyCode.DOWN };
333335
eventProperties[ modifier + "Key" ] = true;
334336

335-
ok( tabs.eq( 0 ).is( ".ui-state-focus" ), "first tab has focus" );
337+
assert.hasClasses( tabs.eq( 0 ), "ui-state-focus", "first tab has focus" );
336338
equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" );
337339
ok( panels.eq( 0 ).is( ":visible" ), "first panel is visible" );
338340

339341
tabs.eq( 0 ).simulate( "keydown", eventProperties );
340-
ok( tabs.eq( 1 ).is( ".ui-state-focus" ), "DOWN moves focus to next tab" );
341-
ok( !tabs.eq( 0 ).is( ".ui-state-focus" ), "first tab is no longer focused" );
342+
assert.hasClasses( tabs.eq( 1 ), "ui-state-focus", "DOWN moves focus to next tab" );
343+
assert.lacksClasses( tabs.eq( 0 ), ".ui-state-focus", "first tab is no longer focused" );
342344
equal( tabs.eq( 1 ).attr( "aria-selected" ), "false", "second tab has aria-selected=false" );
343345
equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" );
344346
ok( panels.eq( 1 ).is( ":hidden" ), "second panel is still hidden" );
@@ -365,7 +367,7 @@ $.each({
365367
equal( panels.eq( 1 ).attr( "aria-hidden" ), "true", "second panel has aria-hidden=true" );
366368

367369
tabs.eq( 1 ).simulate( "keydown", eventProperties );
368-
ok( tabs.eq( 2 ).is( ".ui-state-focus" ), "RIGHT moves focus to next tab" );
370+
assert.hasClasses( tabs.eq( 2 ), "ui-state-focus", "RIGHT moves focus to next tab" );
369371
equal( tabs.eq( 2 ).attr( "aria-selected" ), "false", "third tab has aria-selected=false" );
370372
equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" );
371373
ok( panels.eq( 2 ).is( ":hidden" ), "third panel is still hidden" );
@@ -392,7 +394,7 @@ $.each({
392394
equal( panels.eq( 2 ).attr( "aria-hidden" ), "true", "third panel has aria-hidden=true" );
393395

394396
tabs.eq( 2 ).simulate( "keydown", eventProperties );
395-
ok( tabs.eq( 0 ).is( ".ui-state-focus" ), "DOWN wraps focus to first tab" );
397+
assert.hasClasses( tabs.eq( 0 ), "ui-state-focus", "DOWN wraps focus to first tab" );
396398
equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" );
397399
ok( panels.eq( 0 ).is( ":visible" ), "first panel is still visible" );
398400
equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" );
@@ -412,7 +414,7 @@ $.each({
412414
equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" );
413415

414416
tabs.eq( 0 ).simulate( "keydown", eventProperties );
415-
ok( tabs.eq( 2 ).is( ".ui-state-focus" ), "UP wraps focus to last tab" );
417+
assert.hasClasses( tabs.eq( 2 ), "ui-state-focus", "UP wraps focus to last tab" );
416418
equal( tabs.eq( 2 ).attr( "aria-selected" ), "false", "third tab has aria-selected=false" );
417419
equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" );
418420
ok( panels.eq( 2 ).is( ":hidden" ), "third panel is still hidden" );
@@ -439,7 +441,7 @@ $.each({
439441
equal( panels.eq( 2 ).attr( "aria-hidden" ), "true", "third panel has aria-hidden=true" );
440442

441443
tabs.eq( 2 ).simulate( "keydown", eventProperties );
442-
ok( tabs.eq( 1 ).is( ".ui-state-focus" ), "LEFT moves focus to previous tab" );
444+
assert.hasClasses( tabs.eq( 1 ), "ui-state-focus", "LEFT moves focus to previous tab" );
443445
equal( tabs.eq( 1 ).attr( "aria-selected" ), "false", "second tab has aria-selected=false" );
444446
equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" );
445447
ok( panels.eq( 1 ).is( ":hidden" ), "second panel is still hidden" );
@@ -466,7 +468,7 @@ $.each({
466468
equal( panels.eq( 1 ).attr( "aria-hidden" ), "true", "second panel has aria-hidden=true" );
467469

468470
tabs.eq( 1 ).simulate( "keydown", eventProperties );
469-
ok( tabs.eq( 0 ).is( ".ui-state-focus" ), "HOME moves focus to first tab" );
471+
assert.hasClasses( tabs.eq( 0 ), "ui-state-focus", "HOME moves focus to first tab" );
470472
equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" );
471473
equal( tabs.eq( 1 ).attr( "aria-selected" ), "false", "second tab has aria-selected=false" );
472474
ok( panels.eq( 1 ).is( ":hidden" ), "second panel is still hidden" );
@@ -490,7 +492,7 @@ $.each({
490492
equal( panels.eq( 0 ).attr( "aria-hidden" ), "false", "first panel has aria-hidden=false" );
491493

492494
tabs.eq( 0 ).simulate( "keydown", eventProperties );
493-
ok( tabs.eq( 2 ).is( ".ui-state-focus" ), "END moves focus to last tab" );
495+
assert.hasClasses( tabs.eq( 2 ), "ui-state-focus", "END moves focus to last tab" );
494496
equal( tabs.eq( 2 ).attr( "aria-selected" ), "false", "third tab has aria-selected=false" );
495497
equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" );
496498
ok( panels.eq( 2 ).is( ":hidden" ), "third panel is still hidden" );
@@ -530,7 +532,7 @@ $.each({
530532
});
531533
});
532534

533-
asyncTest( "keyboard support - CTRL+UP, ALT+PAGE_DOWN, ALT+PAGE_UP", function() {
535+
asyncTest( "keyboard support - CTRL+UP, ALT+PAGE_DOWN, ALT+PAGE_UP", function( assert ) {
534536
expect( 50 );
535537
var element = $( "#tabs1" ).tabs(),
536538
tabs = element.find( ".ui-tabs-nav li" ),
@@ -546,7 +548,7 @@ asyncTest( "keyboard support - CTRL+UP, ALT+PAGE_DOWN, ALT+PAGE_UP", function()
546548

547549
panels.eq( 0 ).simulate( "keydown", { keyCode: keyCode.PAGE_DOWN, altKey: true } );
548550
strictEqual( document.activeElement, tabs[ 1 ], "second tab is activeElement" );
549-
ok( tabs.eq( 1 ).is( ".ui-state-focus" ), "ALT+PAGE_DOWN moves focus to next tab" );
551+
assert.hasClasses( tabs.eq( 1 ), "ui-state-focus", "ALT+PAGE_DOWN moves focus to next tab" );
550552
equal( tabs.eq( 1 ).attr( "aria-selected" ), "true", "second tab has aria-selected=true" );
551553
ok( panels.eq( 1 ).is( ":visible" ), "second panel is visible" );
552554
equal( tabs.eq( 1 ).attr( "aria-expanded" ), "true", "second tab has aria-expanded=true" );
@@ -557,7 +559,7 @@ asyncTest( "keyboard support - CTRL+UP, ALT+PAGE_DOWN, ALT+PAGE_UP", function()
557559

558560
tabs.eq( 1 ).simulate( "keydown", { keyCode: keyCode.PAGE_DOWN, altKey: true } );
559561
strictEqual( document.activeElement, tabs[ 2 ], "third tab is activeElement" );
560-
ok( tabs.eq( 2 ).is( ".ui-state-focus" ), "ALT+PAGE_DOWN moves focus to next tab" );
562+
assert.hasClasses( tabs.eq( 2 ), "ui-state-focus", "ALT+PAGE_DOWN moves focus to next tab" );
561563
equal( tabs.eq( 2 ).attr( "aria-selected" ), "true", "third tab has aria-selected=true" );
562564
ok( panels.eq( 2 ).is( ":visible" ), "third panel is visible" );
563565
equal( tabs.eq( 2 ).attr( "aria-expanded" ), "true", "third tab has aria-expanded=true" );
@@ -568,7 +570,7 @@ asyncTest( "keyboard support - CTRL+UP, ALT+PAGE_DOWN, ALT+PAGE_UP", function()
568570

569571
tabs.eq( 2 ).simulate( "keydown", { keyCode: keyCode.PAGE_DOWN, altKey: true } );
570572
strictEqual( document.activeElement, tabs[ 0 ], "first tab is activeElement" );
571-
ok( tabs.eq( 0 ).is( ".ui-state-focus" ), "ALT+PAGE_DOWN wraps focus to first tab" );
573+
assert.hasClasses( tabs.eq( 0 ), "ui-state-focus", "ALT+PAGE_DOWN wraps focus to first tab" );
572574
equal( tabs.eq( 0 ).attr( "aria-selected" ), "true", "first tab has aria-selected=true" );
573575
ok( panels.eq( 0 ).is( ":visible" ), "first panel is visible" );
574576
equal( tabs.eq( 0 ).attr( "aria-expanded" ), "true", "first tab has aria-expanded=true" );
@@ -586,7 +588,7 @@ asyncTest( "keyboard support - CTRL+UP, ALT+PAGE_DOWN, ALT+PAGE_UP", function()
586588

587589
panels.eq( 0 ).simulate( "keydown", { keyCode: keyCode.PAGE_UP, altKey: true } );
588590
strictEqual( document.activeElement, tabs[ 2 ], "third tab is activeElement" );
589-
ok( tabs.eq( 2 ).is( ".ui-state-focus" ), "ALT+PAGE_UP wraps focus to last tab" );
591+
assert.hasClasses( tabs.eq( 2 ), "ui-state-focus", "ALT+PAGE_UP wraps focus to last tab" );
590592
equal( tabs.eq( 2 ).attr( "aria-selected" ), "true", "third tab has aria-selected=true" );
591593
ok( panels.eq( 2 ).is( ":visible" ), "third panel is visible" );
592594
equal( tabs.eq( 2 ).attr( "aria-expanded" ), "true", "third tab has aria-expanded=true" );
@@ -597,7 +599,7 @@ asyncTest( "keyboard support - CTRL+UP, ALT+PAGE_DOWN, ALT+PAGE_UP", function()
597599

598600
tabs.eq( 2 ).simulate( "keydown", { keyCode: keyCode.PAGE_UP, altKey: true } );
599601
strictEqual( document.activeElement, tabs[ 1 ], "second tab is activeElement" );
600-
ok( tabs.eq( 1 ).is( ".ui-state-focus" ), "ALT+PAGE_UP moves focus to previous tab" );
602+
assert.hasClasses( tabs.eq( 1 ), "ui-state-focus", "ALT+PAGE_UP moves focus to previous tab" );
601603
equal( tabs.eq( 1 ).attr( "aria-selected" ), "true", "second tab has aria-selected=true" );
602604
ok( panels.eq( 1 ).is( ":visible" ), "second panel is visible" );
603605
equal( tabs.eq( 1 ).attr( "aria-expanded" ), "true", "second tab has aria-expanded=true" );

0 commit comments

Comments
 (0)