2
2
* @flow
3
3
*/
4
4
5
- import {
6
- dom ,
7
- roles ,
8
- } from 'aria-query' ;
5
+ import { dom , roles } from 'aria-query' ;
9
6
import JSXAttributeMock from './JSXAttributeMock' ;
10
7
import JSXElementMock from './JSXElementMock' ;
11
8
@@ -21,28 +18,27 @@ const interactiveElementsMap = {
21
18
embed : [ ] ,
22
19
link : [ ] ,
23
20
input : [ ] ,
24
- 'input[type=\"button\"]' : [ { prop : 'type' , value : 'button' } ] ,
25
- 'input[type=\"checkbox\"]' : [ { prop : 'type' , value : 'checkbox' } ] ,
26
- 'input[type=\"color\"]' : [ { prop : 'type' , value : 'color' } ] ,
27
- 'input[type=\"date\"]' : [ { prop : 'type' , value : 'date' } ] ,
28
- 'input[type=\"datetime\"]' : [ { prop : 'type' , value : 'datetime' } ] ,
29
- 'input[type=\"datetime\"]' : [ { prop : 'type' , value : 'datetime' } ] ,
30
- 'input[type=\"email\"]' : [ { prop : 'type' , value : 'email' } ] ,
31
- 'input[type=\"file\"]' : [ { prop : 'type' , value : 'file' } ] ,
32
- 'input[type=\"image\"]' : [ { prop : 'type' , value : 'image' } ] ,
33
- 'input[type=\"month\"]' : [ { prop : 'type' , value : 'month' } ] ,
34
- 'input[type=\"number\"]' : [ { prop : 'type' , value : 'number' } ] ,
35
- 'input[type=\"password\"]' : [ { prop : 'type' , value : 'password' } ] ,
36
- 'input[type=\"radio\"]' : [ { prop : 'type' , value : 'radio' } ] ,
37
- 'input[type=\"range\"]' : [ { prop : 'type' , value : 'range' } ] ,
38
- 'input[type=\"reset\"]' : [ { prop : 'type' , value : 'reset' } ] ,
39
- 'input[type=\"search\"]' : [ { prop : 'type' , value : 'search' } ] ,
40
- 'input[type=\"submit\"]' : [ { prop : 'type' , value : 'submit' } ] ,
41
- 'input[type=\"tel\"]' : [ { prop : 'type' , value : 'tel' } ] ,
42
- 'input[type=\"text\"]' : [ { prop : 'type' , value : 'text' } ] ,
43
- 'input[type=\"time\"]' : [ { prop : 'type' , value : 'time' } ] ,
44
- 'input[type=\"url\"]' : [ { prop : 'type' , value : 'url' } ] ,
45
- 'input[type=\"week\"]' : [ { prop : 'type' , value : 'week' } ] ,
21
+ 'input[type="button"]' : [ { prop : 'type' , value : 'button' } ] ,
22
+ 'input[type="checkbox"]' : [ { prop : 'type' , value : 'checkbox' } ] ,
23
+ 'input[type="color"]' : [ { prop : 'type' , value : 'color' } ] ,
24
+ 'input[type="date"]' : [ { prop : 'type' , value : 'date' } ] ,
25
+ 'input[type="datetime"]' : [ { prop : 'type' , value : 'datetime' } ] ,
26
+ 'input[type="email"]' : [ { prop : 'type' , value : 'email' } ] ,
27
+ 'input[type="file"]' : [ { prop : 'type' , value : 'file' } ] ,
28
+ 'input[type="image"]' : [ { prop : 'type' , value : 'image' } ] ,
29
+ 'input[type="month"]' : [ { prop : 'type' , value : 'month' } ] ,
30
+ 'input[type="number"]' : [ { prop : 'type' , value : 'number' } ] ,
31
+ 'input[type="password"]' : [ { prop : 'type' , value : 'password' } ] ,
32
+ 'input[type="radio"]' : [ { prop : 'type' , value : 'radio' } ] ,
33
+ 'input[type="range"]' : [ { prop : 'type' , value : 'range' } ] ,
34
+ 'input[type="reset"]' : [ { prop : 'type' , value : 'reset' } ] ,
35
+ 'input[type="search"]' : [ { prop : 'type' , value : 'search' } ] ,
36
+ 'input[type="submit"]' : [ { prop : 'type' , value : 'submit' } ] ,
37
+ 'input[type="tel"]' : [ { prop : 'type' , value : 'tel' } ] ,
38
+ 'input[type="text"]' : [ { prop : 'type' , value : 'text' } ] ,
39
+ 'input[type="time"]' : [ { prop : 'type' , value : 'time' } ] ,
40
+ 'input[type="url"]' : [ { prop : 'type' , value : 'url' } ] ,
41
+ 'input[type="week"]' : [ { prop : 'type' , value : 'week' } ] ,
46
42
menuitem : [ ] ,
47
43
option : [ ] ,
48
44
select : [ ] ,
@@ -107,29 +103,21 @@ const nonInteractiveElementsMap = {
107
103
ul : [ ] ,
108
104
} ;
109
105
110
- const indeterminantInteractiveElementsMap = domElements
111
- . reduce (
112
- (
113
- accumulator : { [ key : string ] : Array < any > } ,
114
- name : string ,
115
- ) : { [ key : string ] : Array < any > } => {
116
- accumulator[ name ] = [ ] ;
117
- return accumulator ;
118
- } ,
119
- { } ,
120
- ) ;
106
+ const indeterminantInteractiveElementsMap = domElements . reduce (
107
+ ( accumulator : { [ key : string ] : Array < any > } , name : string ) : { [ key : string ] : Array < any > } => ( {
108
+ ...accumulator ,
109
+ [ name ] : [ ] ,
110
+ } ) ,
111
+ { } ,
112
+ ) ;
121
113
122
114
Object . keys ( interactiveElementsMap )
123
115
. concat ( Object . keys ( nonInteractiveElementsMap ) )
124
- . forEach (
125
- ( name : string ) => delete indeterminantInteractiveElementsMap [ name ] ,
126
- ) ;
116
+ . forEach ( ( name : string ) => delete indeterminantInteractiveElementsMap [ name ] ) ;
127
117
128
- const abstractRoles = roleNames
129
- . filter ( role => roles . get ( role ) . abstract ) ;
118
+ const abstractRoles = roleNames . filter ( role => roles . get ( role ) . abstract ) ;
130
119
131
- const nonAbstractRoles = roleNames
132
- . filter ( role => ! roles . get ( role ) . abstract ) ;
120
+ const nonAbstractRoles = roleNames . filter ( role => ! roles . get ( role ) . abstract ) ;
133
121
134
122
const interactiveRoles = [ ]
135
123
. concat (
@@ -139,107 +127,79 @@ const interactiveRoles = []
139
127
'toolbar' ,
140
128
)
141
129
. filter ( role => ! roles . get ( role ) . abstract )
142
- . filter ( role => roles . get ( role ) . superClass . some (
143
- klasses => klasses . includes ( 'widget' ) ) ,
144
- ) ;
130
+ . filter ( role => roles . get ( role ) . superClass . some ( klasses => klasses . includes ( 'widget' ) ) ) ;
145
131
146
132
const nonInteractiveRoles = roleNames
147
133
. filter ( role => ! roles . get ( role ) . abstract )
148
- . filter ( role => ! roles . get ( role ) . superClass . some (
149
- klasses => klasses . includes ( 'widget' ) ) ,
150
- )
134
+ . filter ( role => ! roles . get ( role ) . superClass . some ( klasses => klasses . includes ( 'widget' ) ) )
151
135
// 'toolbar' does not descend from widget, but it does support
152
136
// aria-activedescendant, thus in practice we treat it as a widget.
153
137
. filter ( role => ! [ 'toolbar' ] . includes ( role ) ) ;
154
138
155
- export function genElementSymbol (
156
- openingElement : Object ,
157
- ) {
158
- return openingElement . name . name + (
159
- ( openingElement . attributes . length > 0 )
160
- ? `${ openingElement . attributes . map (
161
- attr => `[${ attr . name . name } =\"${ attr . value . value } \"]` ) . join ( '' )
162
- } `
163
- : ''
139
+ export function genElementSymbol ( openingElement : Object ) {
140
+ return (
141
+ openingElement . name . name +
142
+ ( openingElement . attributes . length > 0
143
+ ? `${ openingElement . attributes
144
+ . map ( attr => `[${ attr . name . name } ="${ attr . value . value } "]` )
145
+ . join ( '' ) } `
146
+ : '' )
164
147
) ;
165
148
}
166
149
167
150
export function genInteractiveElements ( ) {
168
- return Object . keys ( interactiveElementsMap )
169
- . map ( ( elementSymbol ) => {
170
- const bracketIndex = elementSymbol . indexOf ( '[' ) ;
171
- let name = elementSymbol ;
172
- if ( bracketIndex > - 1 ) {
173
- name = elementSymbol . slice ( 0 , bracketIndex ) ;
174
- }
175
- const attributes = interactiveElementsMap [ elementSymbol ] . map (
176
- ( { prop, value } ) => JSXAttributeMock ( prop , value ) ,
177
- ) ;
178
- return JSXElementMock ( name , attributes ) ;
179
- } ) ;
151
+ return Object . keys ( interactiveElementsMap ) . map ( ( elementSymbol ) => {
152
+ const bracketIndex = elementSymbol . indexOf ( '[' ) ;
153
+ let name = elementSymbol ;
154
+ if ( bracketIndex > - 1 ) {
155
+ name = elementSymbol . slice ( 0 , bracketIndex ) ;
156
+ }
157
+ const attributes = interactiveElementsMap [ elementSymbol ] . map ( ( { prop, value } ) =>
158
+ JSXAttributeMock ( prop , value ) ,
159
+ ) ;
160
+ return JSXElementMock ( name , attributes ) ;
161
+ } ) ;
180
162
}
181
163
182
164
export function genInteractiveRoleElements ( ) {
183
- return [
184
- ...interactiveRoles ,
185
- 'button article' ,
186
- 'fakerole button article' ,
187
- ] . map (
188
- value => JSXElementMock ( 'div' , [
189
- JSXAttributeMock ( 'role' , value ) ,
190
- ] ) ,
165
+ return [ ...interactiveRoles , 'button article' , 'fakerole button article' ] . map ( value =>
166
+ JSXElementMock ( 'div' , [ JSXAttributeMock ( 'role' , value ) ] ) ,
191
167
) ;
192
168
}
193
169
194
170
export function genNonInteractiveElements ( ) {
195
- return Object . keys ( nonInteractiveElementsMap )
196
- . map ( ( elementSymbol ) => {
197
- const bracketIndex = elementSymbol . indexOf ( '[' ) ;
198
- let name = elementSymbol ;
199
- if ( bracketIndex > - 1 ) {
200
- name = elementSymbol . slice ( 0 , bracketIndex ) ;
201
- }
202
- const attributes = nonInteractiveElementsMap [ elementSymbol ] . map (
203
- ( { prop, value } ) => JSXAttributeMock ( prop , value ) ,
204
- ) ;
205
- return JSXElementMock ( name , attributes ) ;
206
- } ) ;
171
+ return Object . keys ( nonInteractiveElementsMap ) . map ( ( elementSymbol ) => {
172
+ const bracketIndex = elementSymbol . indexOf ( '[' ) ;
173
+ let name = elementSymbol ;
174
+ if ( bracketIndex > - 1 ) {
175
+ name = elementSymbol . slice ( 0 , bracketIndex ) ;
176
+ }
177
+ const attributes = nonInteractiveElementsMap [ elementSymbol ] . map ( ( { prop, value } ) =>
178
+ JSXAttributeMock ( prop , value ) ,
179
+ ) ;
180
+ return JSXElementMock ( name , attributes ) ;
181
+ } ) ;
207
182
}
208
183
209
184
export function genNonInteractiveRoleElements ( ) {
210
- return [
211
- ...nonInteractiveRoles ,
212
- 'article button' ,
213
- 'fakerole article button' ,
214
- ] . map (
215
- value => JSXElementMock ( 'div' , [
216
- JSXAttributeMock ( 'role' , value ) ,
217
- ] ) ,
185
+ return [ ...nonInteractiveRoles , 'article button' , 'fakerole article button' ] . map ( value =>
186
+ JSXElementMock ( 'div' , [ JSXAttributeMock ( 'role' , value ) ] ) ,
218
187
) ;
219
188
}
220
189
221
190
export function genAbstractRoleElements ( ) {
222
- return abstractRoles . map (
223
- value => JSXElementMock ( 'div' , [
224
- JSXAttributeMock ( 'role' , value ) ,
225
- ] ) ,
226
- ) ;
191
+ return abstractRoles . map ( value => JSXElementMock ( 'div' , [ JSXAttributeMock ( 'role' , value ) ] ) ) ;
227
192
}
228
193
229
194
export function genNonAbstractRoleElements ( ) {
230
- return nonAbstractRoles . map (
231
- value => JSXElementMock ( 'div' , [
232
- JSXAttributeMock ( 'role' , value ) ,
233
- ] ) ,
234
- ) ;
195
+ return nonAbstractRoles . map ( value => JSXElementMock ( 'div' , [ JSXAttributeMock ( 'role' , value ) ] ) ) ;
235
196
}
236
197
237
198
export function genIndeterminantInteractiveElements ( ) {
238
- return Object . keys ( indeterminantInteractiveElementsMap )
239
- . map ( ( name ) => {
240
- const attributes = indeterminantInteractiveElementsMap [ name ] . map (
241
- ( { prop, value } ) => JSXAttributeMock ( prop , value ) ,
242
- ) ;
243
- return JSXElementMock ( name , attributes ) ;
244
- } ) ;
199
+ return Object . keys ( indeterminantInteractiveElementsMap ) . map ( ( name ) => {
200
+ const attributes = indeterminantInteractiveElementsMap [ name ] . map ( ( { prop, value } ) =>
201
+ JSXAttributeMock ( prop , value ) ,
202
+ ) ;
203
+ return JSXElementMock ( name , attributes ) ;
204
+ } ) ;
245
205
}
0 commit comments