source: frontend/node_modules/eslint-plugin-jsx-a11y/__tests__/src/rules/no-static-element-interactions-test.js

Last change on this file was 9af201e, checked in by MBK <marija.karapandzova@…>, 2 weeks ago

Fix frontend appearance
  • Property mode set to 100644
File size: 25.0 KB
Line 
1/**
2 * @fileoverview Enforce static elements have no interactive handlers.
3 * @author Ethan Cohen
4 */
5
6// -----------------------------------------------------------------------------
7// Requirements
8// -----------------------------------------------------------------------------
9
10import { RuleTester } from 'eslint';
11import { configs } from '../../../src/index';
12import parserOptionsMapper from '../../__util__/parserOptionsMapper';
13import parsers from '../../__util__/helpers/parsers';
14import rule from '../../../src/rules/no-static-element-interactions';
15import ruleOptionsMapperFactory from '../../__util__/ruleOptionsMapperFactory';
16
17// -----------------------------------------------------------------------------
18// Tests
19// -----------------------------------------------------------------------------
20
21const ruleTester = new RuleTester();
22
23const errorMessage = 'Avoid non-native interactive elements. If using native HTML is not possible, add an appropriate role and support for tabbing, mouse, keyboard, and touch inputs to an interactive content element.';
24
25const expectedError = {
26 message: errorMessage,
27 type: 'JSXOpeningElement',
28};
29
30const ruleName = 'no-static-element-interactions';
31
32const componentsSettings = {
33 'jsx-a11y': {
34 components: {
35 Button: 'button',
36 TestComponent: 'div',
37 },
38 },
39};
40
41const alwaysValid = [
42 { code: '<TestComponent onClick={doFoo} />' },
43 { code: '<Button onClick={doFoo} />' },
44 { code: '<Button onClick={doFoo} />', settings: componentsSettings },
45 { code: '<div />;' },
46 { code: '<div className="foo" />;' },
47 { code: '<div className="foo" {...props} />;' },
48 { code: '<div onClick={() => void 0} aria-hidden />;' },
49 { code: '<div onClick={() => void 0} aria-hidden={true} />;' },
50 { code: '<div onClick={null} />;' },
51 /* All flavors of input */
52 { code: '<input onClick={() => void 0} />' },
53 { code: '<input type="button" onClick={() => void 0} />' },
54 { code: '<input type="checkbox" onClick={() => void 0} />' },
55 { code: '<input type="color" onClick={() => void 0} />' },
56 { code: '<input type="date" onClick={() => void 0} />' },
57 { code: '<input type="datetime" onClick={() => void 0} />' },
58 { code: '<input type="datetime-local" onClick={() => void 0} />' },
59 { code: '<input type="email" onClick={() => void 0} />' },
60 { code: '<input type="file" onClick={() => void 0} />' },
61 { code: '<input type="hidden" onClick={() => void 0} />' },
62 { code: '<input type="image" onClick={() => void 0} />' },
63 { code: '<input type="month" onClick={() => void 0} />' },
64 { code: '<input type="number" onClick={() => void 0} />' },
65 { code: '<input type="password" onClick={() => void 0} />' },
66 { code: '<input type="radio" onClick={() => void 0} />' },
67 { code: '<input type="range" onClick={() => void 0} />' },
68 { code: '<input type="reset" onClick={() => void 0} />' },
69 { code: '<input type="search" onClick={() => void 0} />' },
70 { code: '<input type="submit" onClick={() => void 0} />' },
71 { code: '<input type="tel" onClick={() => void 0} />' },
72 { code: '<input type="text" onClick={() => void 0} />' },
73 { code: '<input type="time" onClick={() => void 0} />' },
74 { code: '<input type="url" onClick={() => void 0} />' },
75 { code: '<input type="week" onClick={() => void 0} />' },
76 /* End all flavors of input */
77 { code: '<button onClick={() => void 0} className="foo" />' },
78 { code: '<datalist onClick={() => {}} />;' },
79 { code: '<menuitem onClick={() => {}} />;' },
80 { code: '<option onClick={() => void 0} className="foo" />' },
81 { code: '<select onClick={() => void 0} className="foo" />' },
82 { code: '<textarea onClick={() => void 0} className="foo" />' },
83 { code: '<a onClick={() => void 0} href="http://x.y.z" />' },
84 { code: '<a onClick={() => void 0} href="http://x.y.z" tabIndex="0" />' },
85 { code: '<audio onClick={() => {}} />;' },
86 { code: '<form onClick={() => {}} />;' },
87 { code: '<form onSubmit={() => {}} />;' },
88 // { code: '<link onClick={() => {}} href="#" />;' },
89 /* HTML elements attributed with an interactive role */
90 { code: '<div role="button" onClick={() => {}} />;' },
91 { code: '<div role="checkbox" onClick={() => {}} />;' },
92 { code: '<div role="columnheader" onClick={() => {}} />;' },
93 { code: '<div role="combobox" onClick={() => {}} />;' },
94 { code: '<div role="form" onClick={() => {}} />;' },
95 { code: '<div role="gridcell" onClick={() => {}} />;' },
96 { code: '<div role="link" onClick={() => {}} />;' },
97 { code: '<div role="menuitem" onClick={() => {}} />;' },
98 { code: '<div role="menuitemcheckbox" onClick={() => {}} />;' },
99 { code: '<div role="menuitemradio" onClick={() => {}} />;' },
100 { code: '<div role="option" onClick={() => {}} />;' },
101 { code: '<div role="radio" onClick={() => {}} />;' },
102 { code: '<div role="rowheader" onClick={() => {}} />;' },
103 { code: '<div role="searchbox" onClick={() => {}} />;' },
104 { code: '<div role="slider" onClick={() => {}} />;' },
105 { code: '<div role="spinbutton" onClick={() => {}} />;' },
106 { code: '<div role="switch" onClick={() => {}} />;' },
107 { code: '<div role="tab" onClick={() => {}} />;' },
108 { code: '<div role="textbox" onClick={() => {}} />;' },
109 { code: '<div role="treeitem" onClick={() => {}} />;' },
110 /* Presentation is a special case role that indicates intentional static semantics */
111 { code: '<div role="presentation" onClick={() => {}} />;' },
112 { code: '<div role="presentation" onKeyDown={() => {}} />;' },
113 /* HTML elements with an inherent, non-interactive role */
114 { code: '<address onClick={() => {}} />;' },
115 { code: '<article onClick={() => {}} />;' },
116 { code: '<article onDblClick={() => void 0} />;' },
117 { code: '<aside onClick={() => {}} />;' },
118 { code: '<blockquote onClick={() => {}} />;' },
119 { code: '<br onClick={() => {}} />;' },
120 { code: '<canvas onClick={() => {}} />;' },
121 { code: '<caption onClick={() => {}} />;' },
122 { code: '<code onClick={() => {}} />;' },
123 { code: '<dd onClick={() => {}} />;' },
124 { code: '<del onClick={() => {}} />;' },
125 { code: '<details onClick={() => {}} />;' },
126 { code: '<dfn onClick={() => {}} />;' },
127 { code: '<dir onClick={() => {}} />;' },
128 { code: '<dl onClick={() => {}} />;' },
129 { code: '<dt onClick={() => {}} />;' },
130 { code: '<em onClick={() => {}} />;' },
131 { code: '<embed onClick={() => {}} />;' },
132 { code: '<fieldset onClick={() => {}} />;' },
133 { code: '<figcaption onClick={() => {}} />;' },
134 { code: '<figure onClick={() => {}} />;' },
135 { code: '<footer onClick={() => {}} />;' },
136 { code: '<h1 onClick={() => {}} />;' },
137 { code: '<h2 onClick={() => {}} />;' },
138 { code: '<h3 onClick={() => {}} />;' },
139 { code: '<h4 onClick={() => {}} />;' },
140 { code: '<h5 onClick={() => {}} />;' },
141 { code: '<h6 onClick={() => {}} />;' },
142 { code: '<hr onClick={() => {}} />;' },
143 { code: '<html onClick={() => {}} />;' },
144 { code: '<iframe onClick={() => {}} />;' },
145 { code: '<img onClick={() => {}} />;' },
146 { code: '<ins onClick={() => {}} />;' },
147 { code: '<label onClick={() => {}} />;' },
148 { code: '<legend onClick={() => {}} />;' },
149 { code: '<li onClick={() => {}} />;' },
150 { code: '<main onClick={() => void 0} />;' },
151 { code: '<mark onClick={() => {}} />;' },
152 { code: '<marquee onClick={() => {}} />;' },
153 { code: '<menu onClick={() => {}} />;' },
154 { code: '<meter onClick={() => {}} />;' },
155 { code: '<nav onClick={() => {}} />;' },
156 { code: '<ol onClick={() => {}} />;' },
157 { code: '<optgroup onClick={() => {}} />;' },
158 { code: '<output onClick={() => {}} />;' },
159 { code: '<p onClick={() => {}} />;' },
160 { code: '<pre onClick={() => {}} />;' },
161 { code: '<progress onClick={() => {}} />;' },
162 { code: '<ruby onClick={() => {}} />;' },
163 { code: '<section onClick={() => {}} aria-label="Aa" />;' },
164 { code: '<section onClick={() => {}} aria-labelledby="js_1" />;' },
165 { code: '<strong onClick={() => {}} />;' },
166 { code: '<sub onClick={() => {}} />;' },
167 { code: '<summary onClick={() => {}} />;' },
168 { code: '<sup onClick={() => {}} />;' },
169 { code: '<table onClick={() => {}} />;' },
170 { code: '<tbody onClick={() => {}} />;' },
171 { code: '<tfoot onClick={() => {}} />;' },
172 { code: '<th onClick={() => {}} />;' },
173 { code: '<thead onClick={() => {}} />;' },
174 { code: '<time onClick={() => {}} />;' },
175 { code: '<tr onClick={() => {}} />;' },
176 { code: '<video onClick={() => {}} />;' },
177 { code: '<ul onClick={() => {}} />;' },
178 /* HTML elements attributed with an abstract role */
179 { code: '<div role="command" onClick={() => {}} />;' },
180 { code: '<div role="composite" onClick={() => {}} />;' },
181 { code: '<div role="input" onClick={() => {}} />;' },
182 { code: '<div role="landmark" onClick={() => {}} />;' },
183 { code: '<div role="range" onClick={() => {}} />;' },
184 { code: '<div role="roletype" onClick={() => {}} />;' },
185 { code: '<div role="sectionhead" onClick={() => {}} />;' },
186 { code: '<div role="select" onClick={() => {}} />;' },
187 { code: '<div role="structure" onClick={() => {}} />;' },
188 { code: '<div role="widget" onClick={() => {}} />;' },
189 { code: '<div role="window" onClick={() => {}} />;' },
190 /* HTML elements attributed with a non-interactive role */
191 { code: '<div role="alert" onClick={() => {}} />;' },
192 { code: '<div role="alertdialog" onClick={() => {}} />;' },
193 { code: '<div role="application" onClick={() => {}} />;' },
194 { code: '<div role="article" onClick={() => {}} />;' },
195 { code: '<div role="banner" onClick={() => {}} />;' },
196 { code: '<div role="cell" onClick={() => {}} />;' },
197 { code: '<div role="complementary" onClick={() => {}} />;' },
198 { code: '<div role="contentinfo" onClick={() => {}} />;' },
199 { code: '<div role="definition" onClick={() => {}} />;' },
200 { code: '<div role="dialog" onClick={() => {}} />;' },
201 { code: '<div role="directory" onClick={() => {}} />;' },
202 { code: '<div role="document" onClick={() => {}} />;' },
203 { code: '<div role="feed" onClick={() => {}} />;' },
204 { code: '<div role="figure" onClick={() => {}} />;' },
205 { code: '<div role="grid" onClick={() => {}} />;' },
206 { code: '<div role="group" onClick={() => {}} />;' },
207 { code: '<div role="heading" onClick={() => {}} />;' },
208 { code: '<div role="img" onClick={() => {}} />;' },
209 { code: '<div role="list" onClick={() => {}} />;' },
210 { code: '<div role="listbox" onClick={() => {}} />;' },
211 { code: '<div role="listitem" onClick={() => {}} />;' },
212 { code: '<div role="log" onClick={() => {}} />;' },
213 { code: '<div role="main" onClick={() => {}} />;' },
214 { code: '<div role="marquee" onClick={() => {}} />;' },
215 { code: '<div role="math" onClick={() => {}} />;' },
216 { code: '<div role="menu" onClick={() => {}} />;' },
217 { code: '<div role="menubar" onClick={() => {}} />;' },
218 { code: '<div role="navigation" onClick={() => {}} />;' },
219 { code: '<div role="note" onClick={() => {}} />;' },
220 { code: '<div role="progressbar" onClick={() => {}} />;' },
221 { code: '<div role="radiogroup" onClick={() => {}} />;' },
222 { code: '<div role="region" onClick={() => {}} />;' },
223 { code: '<div role="row" onClick={() => {}} />;' },
224 { code: '<div role="rowgroup" onClick={() => {}} />;' },
225 { code: '<div role="section" onClick={() => {}} />;' },
226 { code: '<div role="search" onClick={() => {}} />;' },
227 { code: '<div role="separator" onClick={() => {}} />;' },
228 { code: '<div role="scrollbar" onClick={() => {}} />;' },
229 { code: '<div role="status" onClick={() => {}} />;' },
230 { code: '<div role="table" onClick={() => {}} />;' },
231 { code: '<div role="tablist" onClick={() => {}} />;' },
232 { code: '<div role="tabpanel" onClick={() => {}} />;' },
233 // { code: '<td onClick={() => {}} />;' },
234 { code: '<div role="term" onClick={() => {}} />;' },
235 { code: '<div role="timer" onClick={() => {}} />;' },
236 { code: '<div role="toolbar" onClick={() => {}} />;' },
237 { code: '<div role="tooltip" onClick={() => {}} />;' },
238 { code: '<div role="tree" onClick={() => {}} />;' },
239 { code: '<div role="treegrid" onClick={() => {}} />;' },
240 // All the possible handlers
241 { code: '<div onCopy={() => {}} />;' },
242 { code: '<div onCut={() => {}} />;' },
243 { code: '<div onPaste={() => {}} />;' },
244 { code: '<div onCompositionEnd={() => {}} />;' },
245 { code: '<div onCompositionStart={() => {}} />;' },
246 { code: '<div onCompositionUpdate={() => {}} />;' },
247 { code: '<div onChange={() => {}} />;' },
248 { code: '<div onInput={() => {}} />;' },
249 { code: '<div onSubmit={() => {}} />;' },
250 { code: '<div onSelect={() => {}} />;' },
251 { code: '<div onTouchCancel={() => {}} />;' },
252 { code: '<div onTouchEnd={() => {}} />;' },
253 { code: '<div onTouchMove={() => {}} />;' },
254 { code: '<div onTouchStart={() => {}} />;' },
255 { code: '<div onScroll={() => {}} />;' },
256 { code: '<div onWheel={() => {}} />;' },
257 { code: '<div onAbort={() => {}} />;' },
258 { code: '<div onCanPlay={() => {}} />;' },
259 { code: '<div onCanPlayThrough={() => {}} />;' },
260 { code: '<div onDurationChange={() => {}} />;' },
261 { code: '<div onEmptied={() => {}} />;' },
262 { code: '<div onEncrypted={() => {}} />;' },
263 { code: '<div onEnded={() => {}} />;' },
264 { code: '<div onError={() => {}} />;' },
265 { code: '<div onLoadedData={() => {}} />;' },
266 { code: '<div onLoadedMetadata={() => {}} />;' },
267 { code: '<div onLoadStart={() => {}} />;' },
268 { code: '<div onPause={() => {}} />;' },
269 { code: '<div onPlay={() => {}} />;' },
270 { code: '<div onPlaying={() => {}} />;' },
271 { code: '<div onProgress={() => {}} />;' },
272 { code: '<div onRateChange={() => {}} />;' },
273 { code: '<div onSeeked={() => {}} />;' },
274 { code: '<div onSeeking={() => {}} />;' },
275 { code: '<div onStalled={() => {}} />;' },
276 { code: '<div onSuspend={() => {}} />;' },
277 { code: '<div onTimeUpdate={() => {}} />;' },
278 { code: '<div onVolumeChange={() => {}} />;' },
279 { code: '<div onWaiting={() => {}} />;' },
280 { code: '<div onLoad={() => {}} />;' },
281 { code: '<div onError={() => {}} />;' },
282 { code: '<div onAnimationStart={() => {}} />;' },
283 { code: '<div onAnimationEnd={() => {}} />;' },
284 { code: '<div onAnimationIteration={() => {}} />;' },
285 { code: '<div onTransitionEnd={() => {}} />;' },
286];
287
288const neverValid = [
289 { code: '<div onClick={() => void 0} />;', errors: [expectedError] },
290 { code: '<div onClick={() => void 0} role={undefined} />;', errors: [expectedError] },
291 { code: '<div onClick={() => void 0} {...props} />;', errors: [expectedError] },
292 { code: '<div onKeyUp={() => void 0} aria-hidden={false} />;', errors: [expectedError] },
293 /* Static elements; no inherent role */
294 { code: '<a onClick={() => {}} />;', errors: [expectedError] },
295 { code: '<a onClick={() => void 0} />', errors: [expectedError] },
296 { code: '<a tabIndex="0" onClick={() => void 0} />', errors: [expectedError] },
297 { code: '<acronym onClick={() => {}} />;', errors: [expectedError] },
298 { code: '<applet onClick={() => {}} />;', errors: [expectedError] },
299 { code: '<area onClick={() => {}} />;', errors: [expectedError] },
300 { code: '<b onClick={() => {}} />;', errors: [expectedError] },
301 { code: '<base onClick={() => {}} />;', errors: [expectedError] },
302 { code: '<bdi onClick={() => {}} />;', errors: [expectedError] },
303 { code: '<bdo onClick={() => {}} />;', errors: [expectedError] },
304 { code: '<big onClick={() => {}} />;', errors: [expectedError] },
305 { code: '<blink onClick={() => {}} />;', errors: [expectedError] },
306 { code: '<body onClick={() => {}} />;', errors: [expectedError] },
307 { code: '<center onClick={() => {}} />;', errors: [expectedError] },
308 { code: '<cite onClick={() => {}} />;', errors: [expectedError] },
309 { code: '<col onClick={() => {}} />;', errors: [expectedError] },
310 { code: '<colgroup onClick={() => {}} />;', errors: [expectedError] },
311 { code: '<content onClick={() => {}} />;', errors: [expectedError] },
312 { code: '<data onClick={() => {}} />;', errors: [expectedError] },
313 { code: '<font onClick={() => {}} />;', errors: [expectedError] },
314 { code: '<frame onClick={() => {}} />;', errors: [expectedError] },
315 { code: '<frameset onClick={() => {}} />;', errors: [expectedError] },
316 { code: '<head onClick={() => {}} />;', errors: [expectedError] },
317 { code: '<header onClick={() => {}} />;', errors: [expectedError] },
318 { code: '<hgroup onClick={() => {}} />;', errors: [expectedError] },
319 { code: '<i onClick={() => {}} />;', errors: [expectedError] },
320 { code: '<kbd onClick={() => {}} />;', errors: [expectedError] },
321 { code: '<keygen onClick={() => {}} />;', errors: [expectedError] },
322 { code: '<map onClick={() => {}} />;', errors: [expectedError] },
323 { code: '<meta onClick={() => {}} />;', errors: [expectedError] },
324 { code: '<noembed onClick={() => {}} />;', errors: [expectedError] },
325 { code: '<noscript onClick={() => {}} />;', errors: [expectedError] },
326 { code: '<object onClick={() => {}} />;', errors: [expectedError] },
327 { code: '<param onClick={() => {}} />;', errors: [expectedError] },
328 { code: '<picture onClick={() => {}} />;', errors: [expectedError] },
329 { code: '<q onClick={() => {}} />;', errors: [expectedError] },
330 { code: '<rp onClick={() => {}} />;', errors: [expectedError] },
331 { code: '<rt onClick={() => {}} />;', errors: [expectedError] },
332 { code: '<rtc onClick={() => {}} />;', errors: [expectedError] },
333 { code: '<s onClick={() => {}} />;', errors: [expectedError] },
334 { code: '<samp onClick={() => {}} />;', errors: [expectedError] },
335 { code: '<script onClick={() => {}} />;', errors: [expectedError] },
336 { code: '<section onClick={() => {}} />;', errors: [expectedError] },
337 { code: '<small onClick={() => {}} />;', errors: [expectedError] },
338 { code: '<source onClick={() => {}} />;', errors: [expectedError] },
339 { code: '<spacer onClick={() => {}} />;', errors: [expectedError] },
340 { code: '<span onClick={() => {}} />;', errors: [expectedError] },
341 { code: '<strike onClick={() => {}} />;', errors: [expectedError] },
342 { code: '<style onClick={() => {}} />;', errors: [expectedError] },
343 { code: '<title onClick={() => {}} />;', errors: [expectedError] },
344 { code: '<track onClick={() => {}} />;', errors: [expectedError] },
345 { code: '<tt onClick={() => {}} />;', errors: [expectedError] },
346 { code: '<u onClick={() => {}} />;', errors: [expectedError] },
347 { code: '<var onClick={() => {}} />;', errors: [expectedError] },
348 { code: '<wbr onClick={() => {}} />;', errors: [expectedError] },
349 { code: '<xmp onClick={() => {}} />;', errors: [expectedError] },
350 // Handlers
351 { code: '<div onKeyDown={() => {}} />;', errors: [expectedError] },
352 { code: '<div onKeyPress={() => {}} />;', errors: [expectedError] },
353 { code: '<div onKeyUp={() => {}} />;', errors: [expectedError] },
354 { code: '<div onClick={() => {}} />;', errors: [expectedError] },
355 { code: '<div onMouseDown={() => {}} />;', errors: [expectedError] },
356 { code: '<div onMouseUp={() => {}} />;', errors: [expectedError] },
357 // Custom components
358 { code: '<TestComponent onClick={doFoo} />', settings: componentsSettings, errors: [expectedError] },
359];
360
361const recommendedOptions = configs.recommended.rules[`jsx-a11y/${ruleName}`][1] || {};
362ruleTester.run(`${ruleName}:recommended`, rule, {
363 valid: parsers.all([].concat(
364 alwaysValid,
365 // All the possible handlers
366 { code: '<div onCopy={() => {}} />;' },
367 { code: '<div onCut={() => {}} />;' },
368 { code: '<div onPaste={() => {}} />;' },
369 { code: '<div onCompositionEnd={() => {}} />;' },
370 { code: '<div onCompositionStart={() => {}} />;' },
371 { code: '<div onCompositionUpdate={() => {}} />;' },
372 { code: '<div onFocus={() => {}} />;' },
373 { code: '<div onBlur={() => {}} />;' },
374 { code: '<div onChange={() => {}} />;' },
375 { code: '<div onInput={() => {}} />;' },
376 { code: '<div onSubmit={() => {}} />;' },
377 { code: '<div onContextMenu={() => {}} />;' },
378 { code: '<div onDblClick={() => {}} />;' },
379 { code: '<div onDoubleClick={() => {}} />;' },
380 { code: '<div onDrag={() => {}} />;' },
381 { code: '<div onDragEnd={() => {}} />;' },
382 { code: '<div onDragEnter={() => {}} />;' },
383 { code: '<div onDragExit={() => {}} />;' },
384 { code: '<div onDragLeave={() => {}} />;' },
385 { code: '<div onDragOver={() => {}} />;' },
386 { code: '<div onDragStart={() => {}} />;' },
387 { code: '<div onDrop={() => {}} />;' },
388 { code: '<div onMouseEnter={() => {}} />;' },
389 { code: '<div onMouseLeave={() => {}} />;' },
390 { code: '<div onMouseMove={() => {}} />;' },
391 { code: '<div onMouseOut={() => {}} />;' },
392 { code: '<div onMouseOver={() => {}} />;' },
393 { code: '<div onSelect={() => {}} />;' },
394 { code: '<div onTouchCancel={() => {}} />;' },
395 { code: '<div onTouchEnd={() => {}} />;' },
396 { code: '<div onTouchMove={() => {}} />;' },
397 { code: '<div onTouchStart={() => {}} />;' },
398 { code: '<div onScroll={() => {}} />;' },
399 { code: '<div onWheel={() => {}} />;' },
400 { code: '<div onAbort={() => {}} />;' },
401 { code: '<div onCanPlay={() => {}} />;' },
402 { code: '<div onCanPlayThrough={() => {}} />;' },
403 { code: '<div onDurationChange={() => {}} />;' },
404 { code: '<div onEmptied={() => {}} />;' },
405 { code: '<div onEncrypted={() => {}} />;' },
406 { code: '<div onEnded={() => {}} />;' },
407 { code: '<div onError={() => {}} />;' },
408 { code: '<div onLoadedData={() => {}} />;' },
409 { code: '<div onLoadedMetadata={() => {}} />;' },
410 { code: '<div onLoadStart={() => {}} />;' },
411 { code: '<div onPause={() => {}} />;' },
412 { code: '<div onPlay={() => {}} />;' },
413 { code: '<div onPlaying={() => {}} />;' },
414 { code: '<div onProgress={() => {}} />;' },
415 { code: '<div onRateChange={() => {}} />;' },
416 { code: '<div onSeeked={() => {}} />;' },
417 { code: '<div onSeeking={() => {}} />;' },
418 { code: '<div onStalled={() => {}} />;' },
419 { code: '<div onSuspend={() => {}} />;' },
420 { code: '<div onTimeUpdate={() => {}} />;' },
421 { code: '<div onVolumeChange={() => {}} />;' },
422 { code: '<div onWaiting={() => {}} />;' },
423 { code: '<div onLoad={() => {}} />;' },
424 { code: '<div onError={() => {}} />;' },
425 { code: '<div onAnimationStart={() => {}} />;' },
426 { code: '<div onAnimationEnd={() => {}} />;' },
427 { code: '<div onAnimationIteration={() => {}} />;' },
428 { code: '<div onTransitionEnd={() => {}} />;' },
429 // Expressions should pass in recommended mode
430 { code: '<div role={ROLE_BUTTON} onClick={() => {}} />;' },
431 { code: '<div {...this.props} role={this.props.role} onKeyPress={e => this.handleKeyPress(e)}>{this.props.children}</div>' },
432 // Cases for allowExpressionValues set to true
433 {
434 code: '<div role={BUTTON} onClick={() => {}} />;',
435 options: [{ allowExpressionValues: true }],
436 },
437 // Specific case for ternary operator with literals on both side
438 {
439 code: '<div role={isButton ? "button" : "link"} onClick={() => {}} />;',
440 options: [{ allowExpressionValues: true }],
441 },
442 {
443 code: '<div role={isButton ? "button" : LINK} onClick={() => {}} />;',
444 options: [{ allowExpressionValues: true }],
445 errors: [expectedError],
446 },
447 {
448 code: '<div role={isButton ? BUTTON : LINK} onClick={() => {}} />;',
449 options: [{ allowExpressionValues: true }],
450 errors: [expectedError],
451 },
452 ))
453 .map(ruleOptionsMapperFactory(recommendedOptions))
454 .map(parserOptionsMapper),
455 invalid: parsers.all([].concat(
456 neverValid,
457 ))
458 .map(ruleOptionsMapperFactory(recommendedOptions))
459 .map(parserOptionsMapper),
460});
461
462ruleTester.run(`${ruleName}:strict`, rule, {
463 valid: parsers.all([].concat(
464 alwaysValid,
465 )).map(parserOptionsMapper),
466 invalid: parsers.all([].concat(
467 neverValid,
468 // All the possible handlers
469 { code: '<div onContextMenu={() => {}} />;', errors: [expectedError] },
470 { code: '<div onDblClick={() => {}} />;', errors: [expectedError] },
471 { code: '<div onDoubleClick={() => {}} />;', errors: [expectedError] },
472 { code: '<div onDrag={() => {}} />;', errors: [expectedError] },
473 { code: '<div onDragEnd={() => {}} />;', errors: [expectedError] },
474 { code: '<div onDragEnter={() => {}} />;', errors: [expectedError] },
475 { code: '<div onDragExit={() => {}} />;', errors: [expectedError] },
476 { code: '<div onDragLeave={() => {}} />;', errors: [expectedError] },
477 { code: '<div onDragOver={() => {}} />;', errors: [expectedError] },
478 { code: '<div onDragStart={() => {}} />;', errors: [expectedError] },
479 { code: '<div onDrop={() => {}} />;', errors: [expectedError] },
480 { code: '<div onMouseEnter={() => {}} />;', errors: [expectedError] },
481 { code: '<div onMouseLeave={() => {}} />;', errors: [expectedError] },
482 { code: '<div onMouseMove={() => {}} />;', errors: [expectedError] },
483 { code: '<div onMouseOut={() => {}} />;', errors: [expectedError] },
484 { code: '<div onMouseOver={() => {}} />;', errors: [expectedError] },
485 // Expressions should fail in strict mode
486 { code: '<div role={ROLE_BUTTON} onClick={() => {}} />;', errors: [expectedError] },
487 { code: '<div {...this.props} role={this.props.role} onKeyPress={e => this.handleKeyPress(e)}>{this.props.children}</div>', errors: [expectedError] },
488 // Cases for allowExpressionValues set to false
489 {
490 code: '<div role={BUTTON} onClick={() => {}} />;',
491 options: [{ allowExpressionValues: false }],
492 errors: [expectedError],
493 },
494 // Specific case for ternary operator with literals on both side
495 {
496 code: '<div role={isButton ? "button" : "link"} onClick={() => {}} />;',
497 options: [{ allowExpressionValues: false }],
498 errors: [expectedError],
499 },
500 )).map(parserOptionsMapper),
501});
Note: See TracBrowser for help on using the repository browser.