[d565449] | 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 | });
|
---|