Split into multiple invariants
That way the messages are extracted by the error code transform.
Andrew Clark committed
Feb 6, 2017 at 17:59 UTC
0564b08cf23a32124bdd21a4fc4f5f94dff65a75
2 files changed
+58
-32
src/renderers/dom/fiber/ReactDOMFiber.js
+29
-16
@@ -378,23 +378,36 @@ var ReactDOM = {
378
// Top-level check occurs here instead of inside child reconciler because
379
// because requirements vary between renderers. E.g. React Art
380
// allows arrays.
381
- invariant(
382
- isValidElement(element),
383
- 'ReactDOM.render(): Invalid component element.%s',
384
- (
385
- typeof element === 'string' ?
386
- ' Instead of passing a string like \'div\', pass ' +
387
- 'React.createElement(\'div\') or <div />.' :
388
- typeof element === 'function' ?
389
- ' Instead of passing a class like Foo, pass ' +
390
- 'React.createElement(Foo) or <Foo />.' :
381
+ if (!isValidElement(element)) {
382
+ if (typeof element === 'string') {
383
+ invariant(
384
+ false,
385
+ 'ReactDOM.render(): Invalid component element. Instead of ' +
386
+ 'passing a string like \'div\', pass ' +
387
+ 'React.createElement(\'div\') or <div />.'
388
+ );
389
+ } else if (typeof element === 'function') {
390
+ invariant(
391
+ false,
392
+ 'ReactDOM.render(): Invalid component element. Instead of ' +
393
+ 'passing a class like Foo, pass React.createElement(Foo) ' +
394
+ 'or <Foo />.'
395
+ );
396
+ } else if (element != null && typeof element.props !== 'undefined') {
397
// Check if it quacks like an element
392
- element != null && element.props !== undefined ?
393
- ' This may be caused by unintentionally loading two independent ' +
394
- 'copies of React.' :
395
- ''
396
- )
397
- );
398
+ invariant(
399
+ false,
400
+ 'ReactDOM.render(): Invalid component element. This may be ' +
401
+ 'caused by unintentionally loading two independent copies ' +
402
+ 'of React.'
403
+ );
404
+ } else {
405
+ invariant(
406
+ false,
407
+ 'ReactDOM.render(): Invalid component element.'
408
+ );
409
+ }
410
+ }
411
}
412
413
if (__DEV__) {
src/renderers/dom/stack/client/ReactMount.js
+29
-16
@@ -434,23 +434,36 @@ var ReactMount = {
434
435
_renderSubtreeIntoContainer: function(parentComponent, nextElement, container, callback) {
436
validateCallback(callback, 'ReactDOM.render');
437
- invariant(
438
- React.isValidElement(nextElement),
439
- 'ReactDOM.render(): Invalid component element.%s',
440
- (
441
- typeof nextElement === 'string' ?
442
- ' Instead of passing a string like \'div\', pass ' +
443
- 'React.createElement(\'div\') or <div />.' :
444
- typeof nextElement === 'function' ?
445
- ' Instead of passing a class like Foo, pass ' +
446
- 'React.createElement(Foo) or <Foo />.' :
437
+ if (!React.isValidElement(nextElement)) {
438
+ if (typeof nextElement === 'string') {
439
+ invariant(
440
+ false,
441
+ 'ReactDOM.render(): Invalid component element. Instead of ' +
442
+ 'passing a string like \'div\', pass ' +
443
+ 'React.createElement(\'div\') or <div />.'
444
+ );
445
+ } else if (typeof nextElement === 'function') {
446
+ invariant(
447
+ false,
448
+ 'ReactDOM.render(): Invalid component element. Instead of ' +
449
+ 'passing a class like Foo, pass React.createElement(Foo) ' +
450
+ 'or <Foo />.'
451
+ );
452
+ } else if (nextElement != null && typeof nextElement.props !== 'undefined') {
453
// Check if it quacks like an element
448
- nextElement != null && nextElement.props !== undefined ?
449
- ' This may be caused by unintentionally loading two independent ' +
450
- 'copies of React.' :
451
- ''
452
- )
453
- );
454
+ invariant(
455
+ false,
456
+ 'ReactDOM.render(): Invalid component element. This may be ' +
457
+ 'caused by unintentionally loading two independent copies ' +
458
+ 'of React.'
459
+ );
460
+ } else {
461
+ invariant(
462
+ false,
463
+ 'ReactDOM.render(): Invalid component element.'
464
+ );
465
+ }
466
+ }
467
468
warning(
469
!container || !container.tagName ||