@@ -5,122 +5,118 @@ define([
5
5
"jquery.simulate"
6
6
] , function ( $ , accordionTestHelper ) {
7
7
8
- return function ( ) {
9
-
10
- var setupTeardown = accordionTestHelper . setupTeardown ,
11
- state = accordionTestHelper . state ;
12
-
13
- module ( "accordion: core" , setupTeardown ( ) ) ;
14
-
15
- $ . each ( { div : "#list1" , ul : "#navigation" , dl : "#accordion-dl" } , function ( type , selector ) {
16
- test ( "markup structure: " + type , function ( ) {
17
- expect ( 4 ) ;
18
- var element = $ ( selector ) . accordion ( ) ;
19
- ok ( element . hasClass ( "ui-accordion" ) , "main element is .ui-accordion" ) ;
20
- equal ( element . find ( ".ui-accordion-header" ) . length , 3 ,
21
- ".ui-accordion-header elements exist, correct number" ) ;
22
- equal ( element . find ( ".ui-accordion-content" ) . length , 3 ,
23
- ".ui-accordion-content elements exist, correct number" ) ;
24
- deepEqual ( element . find ( ".ui-accordion-header" ) . next ( ) . get ( ) ,
25
- element . find ( ".ui-accordion-content" ) . get ( ) ,
26
- "content panels come immediately after headers" ) ;
27
- } ) ;
28
- } ) ;
29
-
30
- test ( "handle click on header-descendant" , function ( ) {
31
- expect ( 1 ) ;
32
- var element = $ ( "#navigation" ) . accordion ( ) ;
33
- $ ( "#navigation h2:eq(1) a" ) . click ( ) ;
34
- state ( element , 0 , 1 , 0 ) ;
8
+ var setupTeardown = accordionTestHelper . setupTeardown ,
9
+ state = accordionTestHelper . state ;
10
+
11
+ module ( "accordion: core" , setupTeardown ( ) ) ;
12
+
13
+ $ . each ( { div : "#list1" , ul : "#navigation" , dl : "#accordion-dl" } , function ( type , selector ) {
14
+ test ( "markup structure: " + type , function ( ) {
15
+ expect ( 4 ) ;
16
+ var element = $ ( selector ) . accordion ( ) ;
17
+ ok ( element . hasClass ( "ui-accordion" ) , "main element is .ui-accordion" ) ;
18
+ equal ( element . find ( ".ui-accordion-header" ) . length , 3 ,
19
+ ".ui-accordion-header elements exist, correct number" ) ;
20
+ equal ( element . find ( ".ui-accordion-content" ) . length , 3 ,
21
+ ".ui-accordion-content elements exist, correct number" ) ;
22
+ deepEqual ( element . find ( ".ui-accordion-header" ) . next ( ) . get ( ) ,
23
+ element . find ( ".ui-accordion-content" ) . get ( ) ,
24
+ "content panels come immediately after headers" ) ;
35
25
} ) ;
26
+ } ) ;
36
27
37
- test ( "accessibility" , function ( ) {
38
- expect ( 37 ) ;
39
- var element = $ ( "#list1" ) . accordion ( {
40
- active : 1
41
- } ) ,
42
- headers = element . find ( ".ui-accordion-header" ) ;
43
-
44
- equal ( element . attr ( "role" ) , "tablist" , "element role" ) ;
45
- headers . each ( function ( i ) {
46
- var header = headers . eq ( i ) ,
47
- panel = header . next ( ) ;
48
- equal ( header . attr ( "role" ) , "tab" , "header " + i + " role" ) ;
49
- equal ( header . attr ( "aria-controls" ) , panel . attr ( "id" ) , "header " + i + " aria-controls" ) ;
50
- equal ( panel . attr ( "role" ) , "tabpanel" , "panel " + i + " role" ) ;
51
- equal ( panel . attr ( "aria-labelledby" ) , header . attr ( "id" ) , "panel " + i + " aria-labelledby" ) ;
52
- } ) ;
53
-
54
- equal ( headers . eq ( 1 ) . attr ( "tabindex" ) , 0 , "active header has tabindex=0" ) ;
55
- equal ( headers . eq ( 1 ) . attr ( "aria-selected" ) , "true" , "active tab has aria-selected=true" ) ;
56
- equal ( headers . eq ( 1 ) . attr ( "aria-expanded" ) , "true" , "active tab has aria-expanded=true" ) ;
57
- equal ( headers . eq ( 1 ) . next ( ) . attr ( "aria-hidden" ) , "false" , "active tabpanel has aria-hidden=false" ) ;
58
- equal ( headers . eq ( 0 ) . attr ( "tabindex" ) , - 1 , "inactive header has tabindex=-1" ) ;
59
- equal ( headers . eq ( 0 ) . attr ( "aria-selected" ) , "false" , "inactive tab has aria-selected=false" ) ;
60
- equal ( headers . eq ( 0 ) . attr ( "aria-expanded" ) , "false" , "inactive tab has aria-expanded=false" ) ;
61
- equal ( headers . eq ( 0 ) . next ( ) . attr ( "aria-hidden" ) , "true" , "inactive tabpanel has aria-hidden=true" ) ;
62
- equal ( headers . eq ( 2 ) . attr ( "tabindex" ) , - 1 , "inactive header has tabindex=-1" ) ;
63
- equal ( headers . eq ( 2 ) . attr ( "aria-selected" ) , "false" , "inactive tab has aria-selected=false" ) ;
64
- equal ( headers . eq ( 2 ) . attr ( "aria-expanded" ) , "false" , "inactive tab has aria-expanded=false" ) ;
65
- equal ( headers . eq ( 2 ) . next ( ) . attr ( "aria-hidden" ) , "true" , "inactive tabpanel has aria-hidden=true" ) ;
28
+ test ( "handle click on header-descendant" , function ( ) {
29
+ expect ( 1 ) ;
30
+ var element = $ ( "#navigation" ) . accordion ( ) ;
31
+ $ ( "#navigation h2:eq(1) a" ) . click ( ) ;
32
+ state ( element , 0 , 1 , 0 ) ;
33
+ } ) ;
66
34
67
- element . accordion ( "option" , "active" , 0 ) ;
68
- equal ( headers . eq ( 0 ) . attr ( "tabindex" ) , 0 , "active header has tabindex=0" ) ;
69
- equal ( headers . eq ( 0 ) . attr ( "aria-selected" ) , "true" , "active tab has aria-selected=true" ) ;
70
- equal ( headers . eq ( 0 ) . attr ( "aria-expanded" ) , "true" , "active tab has aria-expanded=true" ) ;
71
- equal ( headers . eq ( 0 ) . next ( ) . attr ( "aria-hidden" ) , "false" , "active tabpanel has aria-hidden=false" ) ;
72
- equal ( headers . eq ( 1 ) . attr ( "tabindex" ) , - 1 , "inactive header has tabindex=-1" ) ;
73
- equal ( headers . eq ( 1 ) . attr ( "aria-selected" ) , "false" , "inactive tab has aria-selected=false" ) ;
74
- equal ( headers . eq ( 1 ) . attr ( "aria-expanded" ) , "false" , "inactive tab has aria-expanded=false" ) ;
75
- equal ( headers . eq ( 1 ) . next ( ) . attr ( "aria-hidden" ) , "true" , "inactive tabpanel has aria-hidden=true" ) ;
76
- equal ( headers . eq ( 2 ) . attr ( "tabindex" ) , - 1 , "inactive header has tabindex=-1" ) ;
77
- equal ( headers . eq ( 2 ) . attr ( "aria-selected" ) , "false" , "inactive tab has aria-selected=false" ) ;
78
- equal ( headers . eq ( 2 ) . attr ( "aria-expanded" ) , "false" , "inactive tab has aria-expanded=false" ) ;
79
- equal ( headers . eq ( 2 ) . next ( ) . attr ( "aria-hidden" ) , "true" , "inactive tabpanel has aria-hidden=true" ) ;
35
+ test ( "accessibility" , function ( ) {
36
+ expect ( 37 ) ;
37
+ var element = $ ( "#list1" ) . accordion ( {
38
+ active : 1
39
+ } ) ,
40
+ headers = element . find ( ".ui-accordion-header" ) ;
41
+
42
+ equal ( element . attr ( "role" ) , "tablist" , "element role" ) ;
43
+ headers . each ( function ( i ) {
44
+ var header = headers . eq ( i ) ,
45
+ panel = header . next ( ) ;
46
+ equal ( header . attr ( "role" ) , "tab" , "header " + i + " role" ) ;
47
+ equal ( header . attr ( "aria-controls" ) , panel . attr ( "id" ) , "header " + i + " aria-controls" ) ;
48
+ equal ( panel . attr ( "role" ) , "tabpanel" , "panel " + i + " role" ) ;
49
+ equal ( panel . attr ( "aria-labelledby" ) , header . attr ( "id" ) , "panel " + i + " aria-labelledby" ) ;
80
50
} ) ;
81
51
82
- asyncTest ( "keyboard support" , function ( ) {
83
- expect ( 13 ) ;
84
- var element = $ ( "#list1" ) . accordion ( ) ,
85
- headers = element . find ( ".ui-accordion-header" ) ,
86
- anchor = headers . eq ( 1 ) . next ( ) . find ( "a" ) . eq ( 0 ) ,
87
- keyCode = $ . ui . keyCode ;
88
- equal ( headers . filter ( ".ui-state-focus" ) . length , 0 , "no headers focused on init" ) ;
89
- headers . eq ( 0 ) . simulate ( "focus" ) ;
90
- setTimeout ( function ( ) {
91
- ok ( headers . eq ( 0 ) . is ( ".ui-state-focus" ) , "first header has focus" ) ;
92
- headers . eq ( 0 ) . simulate ( "keydown" , { keyCode : keyCode . DOWN } ) ;
93
- ok ( headers . eq ( 1 ) . is ( ".ui-state-focus" ) , "DOWN moves focus to next header" ) ;
94
- headers . eq ( 1 ) . simulate ( "keydown" , { keyCode : keyCode . RIGHT } ) ;
95
- ok ( headers . eq ( 2 ) . is ( ".ui-state-focus" ) , "RIGHT moves focus to next header" ) ;
96
- headers . eq ( 2 ) . simulate ( "keydown" , { keyCode : keyCode . DOWN } ) ;
97
- ok ( headers . eq ( 0 ) . is ( ".ui-state-focus" ) , "DOWN wraps focus to first header" ) ;
98
-
99
- headers . eq ( 0 ) . simulate ( "keydown" , { keyCode : keyCode . UP } ) ;
100
- ok ( headers . eq ( 2 ) . is ( ".ui-state-focus" ) , "UP wraps focus to last header" ) ;
101
- headers . eq ( 2 ) . simulate ( "keydown" , { keyCode : keyCode . LEFT } ) ;
102
- ok ( headers . eq ( 1 ) . is ( ".ui-state-focus" ) , "LEFT moves focus to previous header" ) ;
103
-
104
- headers . eq ( 1 ) . simulate ( "keydown" , { keyCode : keyCode . HOME } ) ;
105
- ok ( headers . eq ( 0 ) . is ( ".ui-state-focus" ) , "HOME moves focus to first header" ) ;
106
- headers . eq ( 0 ) . simulate ( "keydown" , { keyCode : keyCode . END } ) ;
107
- ok ( headers . eq ( 2 ) . is ( ".ui-state-focus" ) , "END moves focus to last header" ) ;
108
-
109
- headers . eq ( 2 ) . simulate ( "keydown" , { keyCode : keyCode . ENTER } ) ;
110
- equal ( element . accordion ( "option" , "active" ) , 2 , "ENTER activates panel" ) ;
111
- headers . eq ( 1 ) . simulate ( "keydown" , { keyCode : keyCode . SPACE } ) ;
112
- equal ( element . accordion ( "option" , "active" ) , 1 , "SPACE activates panel" ) ;
52
+ equal ( headers . eq ( 1 ) . attr ( "tabindex" ) , 0 , "active header has tabindex=0" ) ;
53
+ equal ( headers . eq ( 1 ) . attr ( "aria-selected" ) , "true" , "active tab has aria-selected=true" ) ;
54
+ equal ( headers . eq ( 1 ) . attr ( "aria-expanded" ) , "true" , "active tab has aria-expanded=true" ) ;
55
+ equal ( headers . eq ( 1 ) . next ( ) . attr ( "aria-hidden" ) , "false" , "active tabpanel has aria-hidden=false" ) ;
56
+ equal ( headers . eq ( 0 ) . attr ( "tabindex" ) , - 1 , "inactive header has tabindex=-1" ) ;
57
+ equal ( headers . eq ( 0 ) . attr ( "aria-selected" ) , "false" , "inactive tab has aria-selected=false" ) ;
58
+ equal ( headers . eq ( 0 ) . attr ( "aria-expanded" ) , "false" , "inactive tab has aria-expanded=false" ) ;
59
+ equal ( headers . eq ( 0 ) . next ( ) . attr ( "aria-hidden" ) , "true" , "inactive tabpanel has aria-hidden=true" ) ;
60
+ equal ( headers . eq ( 2 ) . attr ( "tabindex" ) , - 1 , "inactive header has tabindex=-1" ) ;
61
+ equal ( headers . eq ( 2 ) . attr ( "aria-selected" ) , "false" , "inactive tab has aria-selected=false" ) ;
62
+ equal ( headers . eq ( 2 ) . attr ( "aria-expanded" ) , "false" , "inactive tab has aria-expanded=false" ) ;
63
+ equal ( headers . eq ( 2 ) . next ( ) . attr ( "aria-hidden" ) , "true" , "inactive tabpanel has aria-hidden=true" ) ;
64
+
65
+ element . accordion ( "option" , "active" , 0 ) ;
66
+ equal ( headers . eq ( 0 ) . attr ( "tabindex" ) , 0 , "active header has tabindex=0" ) ;
67
+ equal ( headers . eq ( 0 ) . attr ( "aria-selected" ) , "true" , "active tab has aria-selected=true" ) ;
68
+ equal ( headers . eq ( 0 ) . attr ( "aria-expanded" ) , "true" , "active tab has aria-expanded=true" ) ;
69
+ equal ( headers . eq ( 0 ) . next ( ) . attr ( "aria-hidden" ) , "false" , "active tabpanel has aria-hidden=false" ) ;
70
+ equal ( headers . eq ( 1 ) . attr ( "tabindex" ) , - 1 , "inactive header has tabindex=-1" ) ;
71
+ equal ( headers . eq ( 1 ) . attr ( "aria-selected" ) , "false" , "inactive tab has aria-selected=false" ) ;
72
+ equal ( headers . eq ( 1 ) . attr ( "aria-expanded" ) , "false" , "inactive tab has aria-expanded=false" ) ;
73
+ equal ( headers . eq ( 1 ) . next ( ) . attr ( "aria-hidden" ) , "true" , "inactive tabpanel has aria-hidden=true" ) ;
74
+ equal ( headers . eq ( 2 ) . attr ( "tabindex" ) , - 1 , "inactive header has tabindex=-1" ) ;
75
+ equal ( headers . eq ( 2 ) . attr ( "aria-selected" ) , "false" , "inactive tab has aria-selected=false" ) ;
76
+ equal ( headers . eq ( 2 ) . attr ( "aria-expanded" ) , "false" , "inactive tab has aria-expanded=false" ) ;
77
+ equal ( headers . eq ( 2 ) . next ( ) . attr ( "aria-hidden" ) , "true" , "inactive tabpanel has aria-hidden=true" ) ;
78
+ } ) ;
113
79
114
- anchor . simulate ( "focus" ) ;
115
- setTimeout ( function ( ) {
116
- ok ( ! headers . eq ( 1 ) . is ( ".ui-state-focus" ) , "header loses focus when focusing inside the panel" ) ;
117
- anchor . simulate ( "keydown" , { keyCode : keyCode . UP , ctrlKey : true } ) ;
118
- ok ( headers . eq ( 1 ) . is ( ".ui-state-focus" ) , "CTRL+UP moves focus to header" ) ;
119
- start ( ) ;
120
- } , 1 ) ;
80
+ asyncTest ( "keyboard support" , function ( ) {
81
+ expect ( 13 ) ;
82
+ var element = $ ( "#list1" ) . accordion ( ) ,
83
+ headers = element . find ( ".ui-accordion-header" ) ,
84
+ anchor = headers . eq ( 1 ) . next ( ) . find ( "a" ) . eq ( 0 ) ,
85
+ keyCode = $ . ui . keyCode ;
86
+ equal ( headers . filter ( ".ui-state-focus" ) . length , 0 , "no headers focused on init" ) ;
87
+ headers . eq ( 0 ) . simulate ( "focus" ) ;
88
+ setTimeout ( function ( ) {
89
+ ok ( headers . eq ( 0 ) . is ( ".ui-state-focus" ) , "first header has focus" ) ;
90
+ headers . eq ( 0 ) . simulate ( "keydown" , { keyCode : keyCode . DOWN } ) ;
91
+ ok ( headers . eq ( 1 ) . is ( ".ui-state-focus" ) , "DOWN moves focus to next header" ) ;
92
+ headers . eq ( 1 ) . simulate ( "keydown" , { keyCode : keyCode . RIGHT } ) ;
93
+ ok ( headers . eq ( 2 ) . is ( ".ui-state-focus" ) , "RIGHT moves focus to next header" ) ;
94
+ headers . eq ( 2 ) . simulate ( "keydown" , { keyCode : keyCode . DOWN } ) ;
95
+ ok ( headers . eq ( 0 ) . is ( ".ui-state-focus" ) , "DOWN wraps focus to first header" ) ;
96
+
97
+ headers . eq ( 0 ) . simulate ( "keydown" , { keyCode : keyCode . UP } ) ;
98
+ ok ( headers . eq ( 2 ) . is ( ".ui-state-focus" ) , "UP wraps focus to last header" ) ;
99
+ headers . eq ( 2 ) . simulate ( "keydown" , { keyCode : keyCode . LEFT } ) ;
100
+ ok ( headers . eq ( 1 ) . is ( ".ui-state-focus" ) , "LEFT moves focus to previous header" ) ;
101
+
102
+ headers . eq ( 1 ) . simulate ( "keydown" , { keyCode : keyCode . HOME } ) ;
103
+ ok ( headers . eq ( 0 ) . is ( ".ui-state-focus" ) , "HOME moves focus to first header" ) ;
104
+ headers . eq ( 0 ) . simulate ( "keydown" , { keyCode : keyCode . END } ) ;
105
+ ok ( headers . eq ( 2 ) . is ( ".ui-state-focus" ) , "END moves focus to last header" ) ;
106
+
107
+ headers . eq ( 2 ) . simulate ( "keydown" , { keyCode : keyCode . ENTER } ) ;
108
+ equal ( element . accordion ( "option" , "active" ) , 2 , "ENTER activates panel" ) ;
109
+ headers . eq ( 1 ) . simulate ( "keydown" , { keyCode : keyCode . SPACE } ) ;
110
+ equal ( element . accordion ( "option" , "active" ) , 1 , "SPACE activates panel" ) ;
111
+
112
+ anchor . simulate ( "focus" ) ;
113
+ setTimeout ( function ( ) {
114
+ ok ( ! headers . eq ( 1 ) . is ( ".ui-state-focus" ) , "header loses focus when focusing inside the panel" ) ;
115
+ anchor . simulate ( "keydown" , { keyCode : keyCode . UP , ctrlKey : true } ) ;
116
+ ok ( headers . eq ( 1 ) . is ( ".ui-state-focus" ) , "CTRL+UP moves focus to header" ) ;
117
+ start ( ) ;
121
118
} , 1 ) ;
122
- } ) ;
123
-
124
- } ;
119
+ } , 1 ) ;
120
+ } ) ;
125
121
126
122
} ) ;
0 commit comments