1 | /* eslint-env mocha */
|
---|
2 | /* eslint no-template-curly-in-string: 0 */
|
---|
3 | import assert from 'assert';
|
---|
4 | import {
|
---|
5 | extractProp,
|
---|
6 | changePlugins,
|
---|
7 | describeIfNotBabylon,
|
---|
8 | setParserName,
|
---|
9 | } from '../helper';
|
---|
10 | import getPropValue from '../../src/getPropValue';
|
---|
11 |
|
---|
12 | describe('getPropValue', () => {
|
---|
13 | beforeEach(() => {
|
---|
14 | setParserName('flow');
|
---|
15 | });
|
---|
16 |
|
---|
17 | it('should export a function', () => {
|
---|
18 | const expected = 'function';
|
---|
19 | const actual = typeof getPropValue;
|
---|
20 |
|
---|
21 | assert.equal(actual, expected);
|
---|
22 | });
|
---|
23 |
|
---|
24 | it('should return undefined when not provided with a JSXAttribute', () => {
|
---|
25 | const expected = undefined;
|
---|
26 | const actual = getPropValue(1);
|
---|
27 |
|
---|
28 | assert.equal(actual, expected);
|
---|
29 | });
|
---|
30 |
|
---|
31 | it('should throw not error when trying to get value from unknown node type', () => {
|
---|
32 | const prop = {
|
---|
33 | type: 'JSXAttribute',
|
---|
34 | value: {
|
---|
35 | type: 'JSXExpressionContainer',
|
---|
36 | },
|
---|
37 | };
|
---|
38 | let counter = 0;
|
---|
39 | // eslint-disable-next-line no-console
|
---|
40 | const errorOrig = console.error;
|
---|
41 | // eslint-disable-next-line no-console
|
---|
42 | console.error = () => {
|
---|
43 | counter += 1;
|
---|
44 | };
|
---|
45 | let value;
|
---|
46 | assert.doesNotThrow(() => {
|
---|
47 | value = getPropValue(prop);
|
---|
48 | }, Error);
|
---|
49 |
|
---|
50 | assert.equal(null, value);
|
---|
51 | assert.equal(counter, 1);
|
---|
52 | // eslint-disable-next-line no-console
|
---|
53 | console.error = errorOrig;
|
---|
54 | });
|
---|
55 |
|
---|
56 | describe('Null', () => {
|
---|
57 | it('should return true when no value is given', () => {
|
---|
58 | const prop = extractProp('<div foo />');
|
---|
59 |
|
---|
60 | const expected = true;
|
---|
61 | const actual = getPropValue(prop);
|
---|
62 |
|
---|
63 | assert.equal(actual, expected);
|
---|
64 | });
|
---|
65 | });
|
---|
66 |
|
---|
67 | describe('Literal', () => {
|
---|
68 | it('should return correct string if value is a string', () => {
|
---|
69 | const prop = extractProp('<div foo="bar" />');
|
---|
70 |
|
---|
71 | const expected = 'bar';
|
---|
72 | const actual = getPropValue(prop);
|
---|
73 |
|
---|
74 | assert.equal(actual, expected);
|
---|
75 | });
|
---|
76 |
|
---|
77 | it('should return correct string if value is a string expression', () => {
|
---|
78 | const prop = extractProp('<div foo={"bar"} />');
|
---|
79 |
|
---|
80 | const expected = 'bar';
|
---|
81 | const actual = getPropValue(prop);
|
---|
82 |
|
---|
83 | assert.equal(actual, expected);
|
---|
84 | });
|
---|
85 |
|
---|
86 | it('should return correct integer if value is a integer expression', () => {
|
---|
87 | const prop = extractProp('<div foo={1} />');
|
---|
88 |
|
---|
89 | const expected = 1;
|
---|
90 | const actual = getPropValue(prop);
|
---|
91 |
|
---|
92 | assert.equal(actual, expected);
|
---|
93 | });
|
---|
94 |
|
---|
95 | it('should convert "true" to boolean type', () => {
|
---|
96 | const prop = extractProp('<div foo="true" />');
|
---|
97 |
|
---|
98 | const expected = true;
|
---|
99 | const actual = getPropValue(prop);
|
---|
100 |
|
---|
101 | assert.equal(actual, expected);
|
---|
102 | });
|
---|
103 |
|
---|
104 | it('should convert "false" to boolean type', () => {
|
---|
105 | const prop = extractProp('<div foo="false" />');
|
---|
106 |
|
---|
107 | const expected = false;
|
---|
108 | const actual = getPropValue(prop);
|
---|
109 |
|
---|
110 | assert.equal(actual, expected);
|
---|
111 | });
|
---|
112 | });
|
---|
113 |
|
---|
114 | describe('JSXElement', () => {
|
---|
115 | it('should return correct representation of JSX element as a string', () => {
|
---|
116 | const prop = extractProp('<div foo={<bar />} />');
|
---|
117 |
|
---|
118 | const expected = '<bar />';
|
---|
119 | const actual = getPropValue(prop);
|
---|
120 |
|
---|
121 | assert.equal(actual, expected);
|
---|
122 | });
|
---|
123 | });
|
---|
124 |
|
---|
125 | describe('Identifier', () => {
|
---|
126 | it('should return string representation of variable identifier', () => {
|
---|
127 | const prop = extractProp('<div foo={bar} />');
|
---|
128 |
|
---|
129 | const expected = 'bar';
|
---|
130 | const actual = getPropValue(prop);
|
---|
131 |
|
---|
132 | assert.equal(actual, expected);
|
---|
133 | });
|
---|
134 |
|
---|
135 | it('should return undefined when identifier is literally `undefined`', () => {
|
---|
136 | const prop = extractProp('<div foo={undefined} />');
|
---|
137 |
|
---|
138 | const expected = undefined;
|
---|
139 | const actual = getPropValue(prop);
|
---|
140 |
|
---|
141 | assert.equal(actual, expected);
|
---|
142 | });
|
---|
143 |
|
---|
144 | it('should return String object when using a reserved JavaScript object', () => {
|
---|
145 | const prop = extractProp('<div foo={String} />');
|
---|
146 |
|
---|
147 | const expected = String;
|
---|
148 | const actual = getPropValue(prop);
|
---|
149 |
|
---|
150 | assert.equal(actual, expected);
|
---|
151 | });
|
---|
152 |
|
---|
153 | it('should return Array object when using a reserved JavaScript object', () => {
|
---|
154 | const prop = extractProp('<div foo={Array} />');
|
---|
155 |
|
---|
156 | const expected = Array;
|
---|
157 | const actual = getPropValue(prop);
|
---|
158 |
|
---|
159 | assert.equal(actual, expected);
|
---|
160 | });
|
---|
161 |
|
---|
162 | it('should return Date object when using a reserved JavaScript object', () => {
|
---|
163 | const prop = extractProp('<div foo={Date} />');
|
---|
164 |
|
---|
165 | const expected = Date;
|
---|
166 | const actual = getPropValue(prop);
|
---|
167 |
|
---|
168 | assert.equal(actual, expected);
|
---|
169 | });
|
---|
170 |
|
---|
171 | it('should return Infinity object when using a reserved JavaScript object', () => {
|
---|
172 | const prop = extractProp('<div foo={Infinity} />');
|
---|
173 |
|
---|
174 | const expected = Infinity;
|
---|
175 | const actual = getPropValue(prop);
|
---|
176 |
|
---|
177 | assert.equal(actual, expected);
|
---|
178 | });
|
---|
179 |
|
---|
180 | it('should return Math object when using a reserved JavaScript object', () => {
|
---|
181 | const prop = extractProp('<div foo={Math} />');
|
---|
182 |
|
---|
183 | const expected = Math;
|
---|
184 | const actual = getPropValue(prop);
|
---|
185 |
|
---|
186 | assert.equal(actual, expected);
|
---|
187 | });
|
---|
188 |
|
---|
189 | it('should return Number object when using a reserved JavaScript object', () => {
|
---|
190 | const prop = extractProp('<div foo={Number} />');
|
---|
191 |
|
---|
192 | const expected = Number;
|
---|
193 | const actual = getPropValue(prop);
|
---|
194 |
|
---|
195 | assert.equal(actual, expected);
|
---|
196 | });
|
---|
197 |
|
---|
198 | it('should return Object object when using a reserved JavaScript object', () => {
|
---|
199 | const prop = extractProp('<div foo={Object} />');
|
---|
200 |
|
---|
201 | const expected = Object;
|
---|
202 | const actual = getPropValue(prop);
|
---|
203 |
|
---|
204 | assert.equal(actual, expected);
|
---|
205 | });
|
---|
206 | });
|
---|
207 |
|
---|
208 | describe('Template literal', () => {
|
---|
209 | it('should return template literal with vars wrapped in curly braces', () => {
|
---|
210 | const prop = extractProp('<div foo={`bar ${baz}`} />');
|
---|
211 |
|
---|
212 | const expected = 'bar {baz}';
|
---|
213 | const actual = getPropValue(prop);
|
---|
214 |
|
---|
215 | assert.equal(actual, expected);
|
---|
216 | });
|
---|
217 |
|
---|
218 | it('should return string "undefined" for expressions that evaluate to undefined', () => {
|
---|
219 | const prop = extractProp('<div foo={`bar ${undefined}`} />');
|
---|
220 |
|
---|
221 | const expected = 'bar undefined';
|
---|
222 | const actual = getPropValue(prop);
|
---|
223 |
|
---|
224 | assert.equal(actual, expected);
|
---|
225 | });
|
---|
226 |
|
---|
227 | it('should return template literal with expression type wrapped in curly braces', () => {
|
---|
228 | const prop = extractProp('<div foo={`bar ${baz()}`} />');
|
---|
229 |
|
---|
230 | const expected = 'bar {CallExpression}';
|
---|
231 | const actual = getPropValue(prop);
|
---|
232 |
|
---|
233 | assert.equal(actual, expected);
|
---|
234 | });
|
---|
235 |
|
---|
236 | it('should ignore non-expressions in the template literal', () => {
|
---|
237 | const prop = extractProp('<div foo={`bar ${<baz />}`} />');
|
---|
238 |
|
---|
239 | const expected = 'bar ';
|
---|
240 | const actual = getPropValue(prop);
|
---|
241 |
|
---|
242 | assert.equal(actual, expected);
|
---|
243 | });
|
---|
244 | });
|
---|
245 |
|
---|
246 | describe('Tagged Template literal', () => {
|
---|
247 | it('should return template literal with vars wrapped in curly braces', () => {
|
---|
248 | const prop = extractProp('<div foo={noop`bar ${baz}`} />');
|
---|
249 |
|
---|
250 | const expected = 'bar {baz}';
|
---|
251 | const actual = getPropValue(prop);
|
---|
252 |
|
---|
253 | assert.equal(actual, expected);
|
---|
254 | });
|
---|
255 |
|
---|
256 | it('should return string "undefined" for expressions that evaluate to undefined', () => {
|
---|
257 | const prop = extractProp('<div foo={noop`bar ${undefined}`} />');
|
---|
258 |
|
---|
259 | const expected = 'bar undefined';
|
---|
260 | const actual = getPropValue(prop);
|
---|
261 |
|
---|
262 | assert.equal(actual, expected);
|
---|
263 | });
|
---|
264 |
|
---|
265 | it('should return template literal with expression type wrapped in curly braces', () => {
|
---|
266 | const prop = extractProp('<div foo={noop`bar ${baz()}`} />');
|
---|
267 |
|
---|
268 | const expected = 'bar {CallExpression}';
|
---|
269 | const actual = getPropValue(prop);
|
---|
270 |
|
---|
271 | assert.equal(actual, expected);
|
---|
272 | });
|
---|
273 |
|
---|
274 | it('should ignore non-expressions in the template literal', () => {
|
---|
275 | const prop = extractProp('<div foo={noop`bar ${<baz />}`} />');
|
---|
276 |
|
---|
277 | const expected = 'bar ';
|
---|
278 | const actual = getPropValue(prop);
|
---|
279 |
|
---|
280 | assert.equal(actual, expected);
|
---|
281 | });
|
---|
282 | });
|
---|
283 |
|
---|
284 | describe('Arrow function expression', () => {
|
---|
285 | it('should return a function', () => {
|
---|
286 | const prop = extractProp('<div foo={ () => { return "bar"; }} />');
|
---|
287 |
|
---|
288 | const expected = 'function';
|
---|
289 | const actual = getPropValue(prop);
|
---|
290 |
|
---|
291 | assert.equal(expected, typeof actual);
|
---|
292 |
|
---|
293 | // For code coverage ¯\_(ツ)_/¯
|
---|
294 | actual();
|
---|
295 | });
|
---|
296 | it('should handle ArrowFunctionExpression as conditional consequent', () => {
|
---|
297 | const prop = extractProp('<div foo={ (true) ? () => null : () => ({})} />');
|
---|
298 |
|
---|
299 | const expected = 'function';
|
---|
300 | const actual = getPropValue(prop);
|
---|
301 |
|
---|
302 | assert.equal(expected, typeof actual);
|
---|
303 |
|
---|
304 | // For code coverage ¯\_(ツ)_/¯
|
---|
305 | actual();
|
---|
306 | });
|
---|
307 | });
|
---|
308 |
|
---|
309 | describe('Function expression', () => {
|
---|
310 | it('should return a function', () => {
|
---|
311 | const prop = extractProp('<div foo={ function() { return "bar"; } } />');
|
---|
312 |
|
---|
313 | const expected = 'function';
|
---|
314 | const actual = getPropValue(prop);
|
---|
315 |
|
---|
316 | assert.equal(expected, typeof actual);
|
---|
317 |
|
---|
318 | // For code coverage ¯\_(ツ)_/¯
|
---|
319 | actual();
|
---|
320 | });
|
---|
321 | });
|
---|
322 |
|
---|
323 | describe('Logical expression', () => {
|
---|
324 | it('should correctly infer result of && logical expression based on derived values', () => {
|
---|
325 | const prop = extractProp('<div foo={bar && baz} />');
|
---|
326 |
|
---|
327 | const expected = 'baz';
|
---|
328 | const actual = getPropValue(prop);
|
---|
329 |
|
---|
330 | assert.equal(actual, expected);
|
---|
331 | });
|
---|
332 |
|
---|
333 | it('should return undefined when evaluating `undefined && undefined` ', () => {
|
---|
334 | const prop = extractProp('<div foo={undefined && undefined} />');
|
---|
335 |
|
---|
336 | const expected = undefined;
|
---|
337 | const actual = getPropValue(prop);
|
---|
338 |
|
---|
339 | assert.equal(actual, expected);
|
---|
340 | });
|
---|
341 |
|
---|
342 | it('should correctly infer result of || logical expression based on derived values', () => {
|
---|
343 | const prop = extractProp('<div foo={bar || baz} />');
|
---|
344 |
|
---|
345 | const expected = 'bar';
|
---|
346 | const actual = getPropValue(prop);
|
---|
347 |
|
---|
348 | assert.equal(actual, expected);
|
---|
349 | });
|
---|
350 |
|
---|
351 | it('should correctly infer result of || logical expression based on derived values', () => {
|
---|
352 | const prop = extractProp('<div foo={undefined || baz} />');
|
---|
353 |
|
---|
354 | const expected = 'baz';
|
---|
355 | const actual = getPropValue(prop);
|
---|
356 |
|
---|
357 | assert.equal(actual, expected);
|
---|
358 | });
|
---|
359 |
|
---|
360 | it('should return undefined when evaluating `undefined || undefined` ', () => {
|
---|
361 | const prop = extractProp('<div foo={undefined || undefined} />');
|
---|
362 |
|
---|
363 | const expected = undefined;
|
---|
364 | const actual = getPropValue(prop);
|
---|
365 |
|
---|
366 | assert.equal(actual, expected);
|
---|
367 | });
|
---|
368 | });
|
---|
369 |
|
---|
370 | describe('Member expression', () => {
|
---|
371 | it('should return string representation of form `object.property`', () => {
|
---|
372 | const prop = extractProp('<div foo={bar.baz} />');
|
---|
373 |
|
---|
374 | const expected = 'bar.baz';
|
---|
375 | const actual = getPropValue(prop);
|
---|
376 |
|
---|
377 | assert.equal(actual, expected);
|
---|
378 | });
|
---|
379 |
|
---|
380 | it('should evaluate to a correct representation of member expression with a nullable member', () => {
|
---|
381 | const prop = extractProp('<div foo={bar?.baz} />');
|
---|
382 |
|
---|
383 | const expected = 'bar?.baz';
|
---|
384 | const actual = getPropValue(prop);
|
---|
385 |
|
---|
386 | assert.equal(actual, expected);
|
---|
387 | });
|
---|
388 | });
|
---|
389 |
|
---|
390 | describe('Call expression', () => {
|
---|
391 | it('should return string representation of callee', () => {
|
---|
392 | const prop = extractProp('<div foo={bar()} />');
|
---|
393 |
|
---|
394 | const expected = 'bar()';
|
---|
395 | const actual = getPropValue(prop);
|
---|
396 |
|
---|
397 | assert.equal(actual, expected);
|
---|
398 | });
|
---|
399 |
|
---|
400 | it('should return string representation of callee', () => {
|
---|
401 | const prop = extractProp('<div foo={bar.call()} />');
|
---|
402 |
|
---|
403 | const expected = 'bar.call()';
|
---|
404 | const actual = getPropValue(prop);
|
---|
405 |
|
---|
406 | assert.equal(actual, expected);
|
---|
407 | });
|
---|
408 | });
|
---|
409 |
|
---|
410 | describe('Unary expression', () => {
|
---|
411 | it('should correctly evaluate an expression that prefixes with -', () => {
|
---|
412 | const prop = extractProp('<div foo={-bar} />');
|
---|
413 |
|
---|
414 | // -"bar" => NaN
|
---|
415 | const expected = true;
|
---|
416 | const actual = Number.isNaN(getPropValue(prop));
|
---|
417 |
|
---|
418 | assert.equal(actual, expected);
|
---|
419 | });
|
---|
420 |
|
---|
421 | it('should correctly evaluate an expression that prefixes with -', () => {
|
---|
422 | const prop = extractProp('<div foo={-42} />');
|
---|
423 |
|
---|
424 | const expected = -42;
|
---|
425 | const actual = getPropValue(prop);
|
---|
426 |
|
---|
427 | assert.equal(actual, expected);
|
---|
428 | });
|
---|
429 |
|
---|
430 | it('should correctly evaluate an expression that prefixes with +', () => {
|
---|
431 | const prop = extractProp('<div foo={+bar} />');
|
---|
432 |
|
---|
433 | // +"bar" => NaN
|
---|
434 | const expected = true;
|
---|
435 | const actual = Number.isNaN(getPropValue(prop));
|
---|
436 |
|
---|
437 | assert.equal(actual, expected);
|
---|
438 | });
|
---|
439 |
|
---|
440 | it('should correctly evaluate an expression that prefixes with +', () => {
|
---|
441 | const prop = extractProp('<div foo={+42} />');
|
---|
442 |
|
---|
443 | const expected = 42;
|
---|
444 | const actual = getPropValue(prop);
|
---|
445 |
|
---|
446 | assert.equal(actual, expected);
|
---|
447 | });
|
---|
448 |
|
---|
449 | it('should correctly evaluate an expression that prefixes with !', () => {
|
---|
450 | const prop = extractProp('<div foo={!bar} />');
|
---|
451 |
|
---|
452 | const expected = false; // !"bar" === false
|
---|
453 | const actual = getPropValue(prop);
|
---|
454 |
|
---|
455 | assert.equal(actual, expected);
|
---|
456 | });
|
---|
457 |
|
---|
458 | it('should correctly evaluate an expression that prefixes with ~', () => {
|
---|
459 | const prop = extractProp('<div foo={~bar} />');
|
---|
460 |
|
---|
461 | const expected = -1; // ~"bar" === -1
|
---|
462 | const actual = getPropValue(prop);
|
---|
463 |
|
---|
464 | assert.equal(actual, expected);
|
---|
465 | });
|
---|
466 |
|
---|
467 | it('should return true when evaluating `delete foo`', () => {
|
---|
468 | const prop = extractProp('<div foo={delete x} />');
|
---|
469 |
|
---|
470 | const expected = true;
|
---|
471 | const actual = getPropValue(prop);
|
---|
472 |
|
---|
473 | assert.equal(actual, expected);
|
---|
474 | });
|
---|
475 |
|
---|
476 | it('should return undefined when evaluating `void foo`', () => {
|
---|
477 | const prop = extractProp('<div foo={void x} />');
|
---|
478 |
|
---|
479 | const expected = undefined;
|
---|
480 | const actual = getPropValue(prop);
|
---|
481 |
|
---|
482 | assert.equal(actual, expected);
|
---|
483 | });
|
---|
484 |
|
---|
485 | // TODO: We should fix this to check to see if we can evaluate it.
|
---|
486 | it('should return undefined when evaluating `typeof foo`', () => {
|
---|
487 | const prop = extractProp('<div foo={typeof x} />');
|
---|
488 |
|
---|
489 | const expected = undefined;
|
---|
490 | const actual = getPropValue(prop);
|
---|
491 |
|
---|
492 | assert.equal(actual, expected);
|
---|
493 | });
|
---|
494 | });
|
---|
495 |
|
---|
496 | describe('Update expression', () => {
|
---|
497 | it('should correctly evaluate an expression that prefixes with ++', () => {
|
---|
498 | const prop = extractProp('<div foo={++bar} />');
|
---|
499 |
|
---|
500 | // ++"bar" => NaN
|
---|
501 | const expected = true;
|
---|
502 | const actual = Number.isNaN(getPropValue(prop));
|
---|
503 |
|
---|
504 | assert.equal(actual, expected);
|
---|
505 | });
|
---|
506 |
|
---|
507 | it('should correctly evaluate an expression that prefixes with --', () => {
|
---|
508 | const prop = extractProp('<div foo={--bar} />');
|
---|
509 |
|
---|
510 | const expected = true;
|
---|
511 | const actual = Number.isNaN(getPropValue(prop));
|
---|
512 |
|
---|
513 | assert.equal(actual, expected);
|
---|
514 | });
|
---|
515 |
|
---|
516 | it('should correctly evaluate an expression that suffixes with ++', () => {
|
---|
517 | const prop = extractProp('<div foo={bar++} />');
|
---|
518 |
|
---|
519 | // "bar"++ => NaN
|
---|
520 | const expected = true;
|
---|
521 | const actual = Number.isNaN(getPropValue(prop));
|
---|
522 |
|
---|
523 | assert.equal(actual, expected);
|
---|
524 | });
|
---|
525 |
|
---|
526 | it('should correctly evaluate an expression that suffixes with --', () => {
|
---|
527 | const prop = extractProp('<div foo={bar--} />');
|
---|
528 |
|
---|
529 | const expected = true;
|
---|
530 | const actual = Number.isNaN(getPropValue(prop));
|
---|
531 |
|
---|
532 | assert.equal(actual, expected);
|
---|
533 | });
|
---|
534 | });
|
---|
535 |
|
---|
536 | describe('This expression', () => {
|
---|
537 | it('should return string value `this`', () => {
|
---|
538 | const prop = extractProp('<div foo={this} />');
|
---|
539 |
|
---|
540 | const expected = 'this';
|
---|
541 | const actual = getPropValue(prop);
|
---|
542 |
|
---|
543 | assert.equal(actual, expected);
|
---|
544 | });
|
---|
545 | });
|
---|
546 |
|
---|
547 | describe('Conditional expression', () => {
|
---|
548 | it('should evaluate the conditional based on the derived values correctly', () => {
|
---|
549 | const prop = extractProp('<div foo={bar ? baz : bam} />');
|
---|
550 |
|
---|
551 | const expected = 'baz';
|
---|
552 | const actual = getPropValue(prop);
|
---|
553 |
|
---|
554 | assert.equal(actual, expected);
|
---|
555 | });
|
---|
556 |
|
---|
557 | it('should evaluate the conditional based on the derived values correctly', () => {
|
---|
558 | const prop = extractProp('<div foo={undefined ? baz : bam} />');
|
---|
559 |
|
---|
560 | const expected = 'bam';
|
---|
561 | const actual = getPropValue(prop);
|
---|
562 |
|
---|
563 | assert.equal(actual, expected);
|
---|
564 | });
|
---|
565 |
|
---|
566 | it('should evaluate the conditional based on the derived values correctly', () => {
|
---|
567 | const prop = extractProp('<div foo={(1 > 2) ? baz : bam} />');
|
---|
568 |
|
---|
569 | const expected = 'bam';
|
---|
570 | const actual = getPropValue(prop);
|
---|
571 |
|
---|
572 | assert.equal(actual, expected);
|
---|
573 | });
|
---|
574 | });
|
---|
575 |
|
---|
576 | describe('Binary expression', () => {
|
---|
577 | it('should evaluate the `==` operator correctly', () => {
|
---|
578 | const trueProp = extractProp('<div foo={1 == "1"} />');
|
---|
579 | const falseProp = extractProp('<div foo={1 == bar} />');
|
---|
580 |
|
---|
581 | const trueVal = getPropValue(trueProp);
|
---|
582 | const falseVal = getPropValue(falseProp);
|
---|
583 |
|
---|
584 | assert.equal(true, trueVal);
|
---|
585 | assert.equal(false, falseVal);
|
---|
586 | });
|
---|
587 |
|
---|
588 | it('should evaluate the `!=` operator correctly', () => {
|
---|
589 | const trueProp = extractProp('<div foo={1 != "2"} />');
|
---|
590 | const falseProp = extractProp('<div foo={1 != "1"} />');
|
---|
591 |
|
---|
592 | const trueVal = getPropValue(trueProp);
|
---|
593 | const falseVal = getPropValue(falseProp);
|
---|
594 |
|
---|
595 | assert.equal(true, trueVal);
|
---|
596 | assert.equal(false, falseVal);
|
---|
597 | });
|
---|
598 |
|
---|
599 | it('should evaluate the `===` operator correctly', () => {
|
---|
600 | const trueProp = extractProp('<div foo={1 === 1} />');
|
---|
601 | const falseProp = extractProp('<div foo={1 === "1"} />');
|
---|
602 |
|
---|
603 | const trueVal = getPropValue(trueProp);
|
---|
604 | const falseVal = getPropValue(falseProp);
|
---|
605 |
|
---|
606 | assert.equal(true, trueVal);
|
---|
607 | assert.equal(false, falseVal);
|
---|
608 | });
|
---|
609 |
|
---|
610 | it('should evaluate the `!==` operator correctly', () => {
|
---|
611 | const trueProp = extractProp('<div foo={1 !== "1"} />');
|
---|
612 | const falseProp = extractProp('<div foo={1 !== 1} />');
|
---|
613 |
|
---|
614 | const trueVal = getPropValue(trueProp);
|
---|
615 | const falseVal = getPropValue(falseProp);
|
---|
616 |
|
---|
617 | assert.equal(true, trueVal);
|
---|
618 | assert.equal(false, falseVal);
|
---|
619 | });
|
---|
620 |
|
---|
621 | it('should evaluate the `<` operator correctly', () => {
|
---|
622 | const trueProp = extractProp('<div foo={1 < 2} />');
|
---|
623 | const falseProp = extractProp('<div foo={1 < 0} />');
|
---|
624 |
|
---|
625 | const trueVal = getPropValue(trueProp);
|
---|
626 | const falseVal = getPropValue(falseProp);
|
---|
627 |
|
---|
628 | assert.equal(true, trueVal);
|
---|
629 | assert.equal(false, falseVal);
|
---|
630 | });
|
---|
631 |
|
---|
632 | it('should evaluate the `>` operator correctly', () => {
|
---|
633 | const trueProp = extractProp('<div foo={1 > 0} />');
|
---|
634 | const falseProp = extractProp('<div foo={1 > 2} />');
|
---|
635 |
|
---|
636 | const trueVal = getPropValue(trueProp);
|
---|
637 | const falseVal = getPropValue(falseProp);
|
---|
638 |
|
---|
639 | assert.equal(true, trueVal);
|
---|
640 | assert.equal(false, falseVal);
|
---|
641 | });
|
---|
642 |
|
---|
643 | it('should evaluate the `<=` operator correctly', () => {
|
---|
644 | const trueProp = extractProp('<div foo={1 <= 1} />');
|
---|
645 | const falseProp = extractProp('<div foo={1 <= 0} />');
|
---|
646 |
|
---|
647 | const trueVal = getPropValue(trueProp);
|
---|
648 | const falseVal = getPropValue(falseProp);
|
---|
649 |
|
---|
650 | assert.equal(true, trueVal);
|
---|
651 | assert.equal(false, falseVal);
|
---|
652 | });
|
---|
653 |
|
---|
654 | it('should evaluate the `>=` operator correctly', () => {
|
---|
655 | const trueProp = extractProp('<div foo={1 >= 1} />');
|
---|
656 | const falseProp = extractProp('<div foo={1 >= 2} />');
|
---|
657 |
|
---|
658 | const trueVal = getPropValue(trueProp);
|
---|
659 | const falseVal = getPropValue(falseProp);
|
---|
660 |
|
---|
661 | assert.equal(true, trueVal);
|
---|
662 | assert.equal(false, falseVal);
|
---|
663 | });
|
---|
664 |
|
---|
665 | it('should evaluate the `<<` operator correctly', () => {
|
---|
666 | const prop = extractProp('<div foo={1 << 2} />');
|
---|
667 |
|
---|
668 | const expected = 4;
|
---|
669 | const actual = getPropValue(prop);
|
---|
670 |
|
---|
671 | assert.equal(actual, expected);
|
---|
672 | });
|
---|
673 |
|
---|
674 | it('should evaluate the `>>` operator correctly', () => {
|
---|
675 | const prop = extractProp('<div foo={1 >> 2} />');
|
---|
676 |
|
---|
677 | const expected = 0;
|
---|
678 | const actual = getPropValue(prop);
|
---|
679 |
|
---|
680 | assert.equal(actual, expected);
|
---|
681 | });
|
---|
682 |
|
---|
683 | it('should evaluate the `>>>` operator correctly', () => {
|
---|
684 | const prop = extractProp('<div foo={2 >>> 1} />');
|
---|
685 |
|
---|
686 | const expected = 1;
|
---|
687 | const actual = getPropValue(prop);
|
---|
688 |
|
---|
689 | assert.equal(actual, expected);
|
---|
690 | });
|
---|
691 |
|
---|
692 | it('should evaluate the `+` operator correctly', () => {
|
---|
693 | const prop = extractProp('<div foo={1 + 1} />');
|
---|
694 |
|
---|
695 | const expected = 2;
|
---|
696 | const actual = getPropValue(prop);
|
---|
697 |
|
---|
698 | assert.equal(actual, expected);
|
---|
699 | });
|
---|
700 |
|
---|
701 | it('should evaluate the `-` operator correctly', () => {
|
---|
702 | const prop = extractProp('<div foo={1 - 1} />');
|
---|
703 |
|
---|
704 | const expected = 0;
|
---|
705 | const actual = getPropValue(prop);
|
---|
706 |
|
---|
707 | assert.equal(actual, expected);
|
---|
708 | });
|
---|
709 |
|
---|
710 | it('should evaluate the `*` operator correctly', () => {
|
---|
711 | const prop = extractProp('<div foo={10 * 10} />');
|
---|
712 |
|
---|
713 | const expected = 100;
|
---|
714 | const actual = getPropValue(prop);
|
---|
715 |
|
---|
716 | assert.equal(actual, expected);
|
---|
717 | });
|
---|
718 |
|
---|
719 | it('should evaluate the `/` operator correctly', () => {
|
---|
720 | const prop = extractProp('<div foo={10 / 2} />');
|
---|
721 |
|
---|
722 | const expected = 5;
|
---|
723 | const actual = getPropValue(prop);
|
---|
724 |
|
---|
725 | assert.equal(actual, expected);
|
---|
726 | });
|
---|
727 |
|
---|
728 | it('should evaluate the `%` operator correctly', () => {
|
---|
729 | const prop = extractProp('<div foo={10 % 3} />');
|
---|
730 |
|
---|
731 | const expected = 1;
|
---|
732 | const actual = getPropValue(prop);
|
---|
733 |
|
---|
734 | assert.equal(actual, expected);
|
---|
735 | });
|
---|
736 |
|
---|
737 | it('should evaluate the `|` operator correctly', () => {
|
---|
738 | const prop = extractProp('<div foo={10 | 1} />');
|
---|
739 |
|
---|
740 | const expected = 11;
|
---|
741 | const actual = getPropValue(prop);
|
---|
742 |
|
---|
743 | assert.equal(actual, expected);
|
---|
744 | });
|
---|
745 |
|
---|
746 | it('should evaluate the `^` operator correctly', () => {
|
---|
747 | const prop = extractProp('<div foo={10 ^ 1} />');
|
---|
748 |
|
---|
749 | const expected = 11;
|
---|
750 | const actual = getPropValue(prop);
|
---|
751 |
|
---|
752 | assert.equal(actual, expected);
|
---|
753 | });
|
---|
754 |
|
---|
755 | it('should evaluate the `&` operator correctly', () => {
|
---|
756 | const prop = extractProp('<div foo={10 & 1} />');
|
---|
757 |
|
---|
758 | const expected = 0;
|
---|
759 | const actual = getPropValue(prop);
|
---|
760 |
|
---|
761 | assert.equal(actual, expected);
|
---|
762 | });
|
---|
763 |
|
---|
764 | it('should evaluate the `in` operator correctly', () => {
|
---|
765 | const prop = extractProp('<div foo={foo in bar} />');
|
---|
766 |
|
---|
767 | const expected = false;
|
---|
768 | const actual = getPropValue(prop);
|
---|
769 |
|
---|
770 | assert.equal(actual, expected);
|
---|
771 | });
|
---|
772 |
|
---|
773 | it('should evaluate the `instanceof` operator correctly', () => {
|
---|
774 | const prop = extractProp('<div foo={{} instanceof Object} />');
|
---|
775 |
|
---|
776 | const expected = true;
|
---|
777 | const actual = getPropValue(prop);
|
---|
778 |
|
---|
779 | assert.equal(actual, expected);
|
---|
780 | });
|
---|
781 |
|
---|
782 | it('should evaluate the `instanceof` operator when right side is not a function', () => {
|
---|
783 | const prop = extractProp('<div foo={"bar" instanceof Baz} />');
|
---|
784 |
|
---|
785 | const expected = false;
|
---|
786 | const actual = getPropValue(prop);
|
---|
787 |
|
---|
788 | assert.equal(actual, expected);
|
---|
789 | });
|
---|
790 | });
|
---|
791 |
|
---|
792 | describe('Object expression', () => {
|
---|
793 | it('should evaluate to a correct representation of the object in props', () => {
|
---|
794 | const prop = extractProp('<div foo={ { bar: "baz" } } />');
|
---|
795 |
|
---|
796 | const expected = { bar: 'baz' };
|
---|
797 | const actual = getPropValue(prop);
|
---|
798 |
|
---|
799 | assert.deepEqual(actual, expected);
|
---|
800 | });
|
---|
801 |
|
---|
802 | it('should evaluate to a correct representation of the object, ignore spread properties', () => {
|
---|
803 | const prop = extractProp('<div foo={{bar: "baz", ...{baz: "bar", foo: {...{bar: "meh"}}}}} />');
|
---|
804 |
|
---|
805 | const expected = { bar: 'baz', baz: 'bar', foo: { bar: 'meh' } };
|
---|
806 | const actual = getPropValue(prop);
|
---|
807 |
|
---|
808 | assert.deepEqual(actual, expected);
|
---|
809 | });
|
---|
810 |
|
---|
811 | it('should evaluate to a correct representation of the object, ignore spread properties', () => {
|
---|
812 | const prop = extractProp('<div foo={{ pathname: manageRoute, state: {...data}}} />');
|
---|
813 |
|
---|
814 | const expected = { pathname: 'manageRoute', state: {} };
|
---|
815 | const actual = getPropValue(prop);
|
---|
816 |
|
---|
817 | assert.deepEqual(actual, expected);
|
---|
818 | });
|
---|
819 | });
|
---|
820 |
|
---|
821 | describe('New expression', () => {
|
---|
822 | it('should return a new empty object', () => {
|
---|
823 | const prop = extractProp('<div foo={new Bar()} />');
|
---|
824 |
|
---|
825 | const expected = {};
|
---|
826 | const actual = getPropValue(prop);
|
---|
827 |
|
---|
828 | assert.deepEqual(actual, expected);
|
---|
829 | });
|
---|
830 | });
|
---|
831 |
|
---|
832 | describe('Sequence array expression', () => {
|
---|
833 | it('should evaluate to correct representation of the the array in props', () => {
|
---|
834 | const prop = extractProp('<div foo={[{"type":"Literal","start":821,"end":827}]} />');
|
---|
835 |
|
---|
836 | const expected = [{
|
---|
837 | type: 'Literal',
|
---|
838 | start: 821,
|
---|
839 | end: 827,
|
---|
840 | }];
|
---|
841 | const actual = getPropValue(prop);
|
---|
842 |
|
---|
843 | assert.deepEqual(actual, expected);
|
---|
844 | });
|
---|
845 | });
|
---|
846 |
|
---|
847 | describe('Array expression', () => {
|
---|
848 | it('should evaluate to correct representation of the the array in props', () => {
|
---|
849 | const prop = extractProp('<div foo={["bar", 42, null]} />');
|
---|
850 |
|
---|
851 | const expected = ['bar', 42, null];
|
---|
852 | const actual = getPropValue(prop);
|
---|
853 |
|
---|
854 | assert.deepEqual(actual, expected);
|
---|
855 | });
|
---|
856 |
|
---|
857 | it('should evaluate to a correct representation of an array with spread elements', () => {
|
---|
858 | const prop = extractProp('<div foo={[...this.props.params, bar]} />');
|
---|
859 |
|
---|
860 | const expected = [undefined, 'bar'];
|
---|
861 | const actual = getPropValue(prop);
|
---|
862 |
|
---|
863 | assert.deepEqual(actual, expected);
|
---|
864 | });
|
---|
865 | });
|
---|
866 |
|
---|
867 | it('should return an empty array provided an empty array in props', () => {
|
---|
868 | const prop = extractProp('<div foo={[]} />');
|
---|
869 |
|
---|
870 | const expected = [];
|
---|
871 | const actual = getPropValue(prop);
|
---|
872 |
|
---|
873 | assert.deepEqual(actual, expected);
|
---|
874 | });
|
---|
875 |
|
---|
876 | describe('Bind expression', () => {
|
---|
877 | it('should return string representation of bind function call when object is null', () => {
|
---|
878 | const prop = extractProp('<div foo={::this.handleClick} />');
|
---|
879 |
|
---|
880 | const expected = null;
|
---|
881 | const actual = getPropValue(prop);
|
---|
882 |
|
---|
883 | assert.deepEqual(actual, expected);
|
---|
884 | });
|
---|
885 |
|
---|
886 | it('should return string representation of bind function call when object is not null', () => {
|
---|
887 | const prop = extractProp('<div foo={foo::bar} />');
|
---|
888 |
|
---|
889 | const expected = 'foo';
|
---|
890 | const actual = getPropValue(prop);
|
---|
891 |
|
---|
892 | assert.deepEqual(actual, expected);
|
---|
893 | });
|
---|
894 |
|
---|
895 | it('should return string representation of bind function call when binding to object properties', () => {
|
---|
896 | const prop = extractProp('<div foo={a.b::c} />');
|
---|
897 | const otherProp = extractProp('<div foo={::a.b.c} />');
|
---|
898 |
|
---|
899 | const expected = 'a.b';
|
---|
900 | const actual = getPropValue(prop);
|
---|
901 |
|
---|
902 | const otherExpected = null;
|
---|
903 | const otherActual = getPropValue(otherProp);
|
---|
904 |
|
---|
905 | assert.deepEqual(actual, expected);
|
---|
906 | assert.deepEqual(otherActual, otherExpected);
|
---|
907 | });
|
---|
908 | });
|
---|
909 |
|
---|
910 | describe('Type Cast Expression', () => {
|
---|
911 | it('should return the expression from a type cast', () => {
|
---|
912 | const prop = extractProp('<div foo={(this.handleClick: (event: MouseEvent) => void))} />');
|
---|
913 |
|
---|
914 | const expected = 'this.handleClick';
|
---|
915 | const actual = getPropValue(prop);
|
---|
916 |
|
---|
917 | assert.deepEqual(actual, expected);
|
---|
918 | });
|
---|
919 | });
|
---|
920 |
|
---|
921 | describeIfNotBabylon('Typescript', () => {
|
---|
922 | beforeEach(() => {
|
---|
923 | changePlugins((pls) => [...pls, 'typescript']);
|
---|
924 | });
|
---|
925 |
|
---|
926 | it('should return string representation of variable identifier wrapped in a Typescript non-null assertion', () => {
|
---|
927 | const prop = extractProp('<div foo={bar!} />');
|
---|
928 |
|
---|
929 | const expected = 'bar';
|
---|
930 | const actual = getPropValue(prop);
|
---|
931 |
|
---|
932 | assert.equal(actual, expected);
|
---|
933 | });
|
---|
934 |
|
---|
935 | it('should return string representation of variable identifier wrapped in a deep Typescript non-null assertion', () => {
|
---|
936 | const prop = extractProp('<div foo={(bar!)!} />');
|
---|
937 |
|
---|
938 | const expected = 'bar';
|
---|
939 | const actual = getPropValue(prop);
|
---|
940 |
|
---|
941 | assert.equal(actual, expected);
|
---|
942 | });
|
---|
943 |
|
---|
944 | it('should return string representation of variable identifier wrapped in a Typescript type coercion', () => {
|
---|
945 | changePlugins((pls) => [...pls, 'typescript']);
|
---|
946 | const prop = extractProp('<div foo={bar as any} />');
|
---|
947 |
|
---|
948 | const expected = 'bar';
|
---|
949 | const actual = getPropValue(prop);
|
---|
950 |
|
---|
951 | assert.equal(actual, expected);
|
---|
952 | });
|
---|
953 | });
|
---|
954 |
|
---|
955 | describe('JSX empty expression', () => {
|
---|
956 | it('should work with an empty expression', () => {
|
---|
957 | const prop = extractProp('<div>\n{/* Hello there */}\n</div>', 'children');
|
---|
958 | const expected = undefined;
|
---|
959 | const actual = getPropValue(prop);
|
---|
960 | assert.equal(actual, expected);
|
---|
961 | });
|
---|
962 | });
|
---|
963 | });
|
---|