Only warn with non-empty children

Author: mjackson

packages/react-router/modules/Route.js

@@ -4,6 +4,9 @@ import React from 'react'
 import PropTypes from 'prop-types'
 import matchPath from './matchPath'
 
+const isEmptyChildren = (children) =>
+  React.Children.count(children) === 0
+
 /**
  * The public API for matching a single path and rendering.
  */
@@ -66,20 +69,18 @@ class Route extends React.Component {
   }
 
   componentWillMount() {
-    const { component, render, children } = this.props
-
     warning(
-      !(component && render),
+      !(this.props.component && this.props.render),
       'You should not use <Route component> and <Route render> in the same route; <Route render> will be ignored'
     )
 
     warning(
-      !(component && children),
+      !(this.props.component && this.props.children && !isEmptyChildren(this.props.children)),
       'You should not use <Route component> and <Route children> in the same route; <Route children> will be ignored'
     )
 
     warning(
-      !(render && children),
+      !(this.props.render && this.props.children && !isEmptyChildren(this.props.children)),
       'You should not use <Route render> and <Route children> in the same route; <Route children> will be ignored'
     )
   }
@@ -115,7 +116,7 @@ class Route extends React.Component {
       ) : children ? ( // children come last, always called
         typeof children === 'function' ? (
           children(props)
-        ) : !Array.isArray(children) || children.length ? ( // Preact defaults to empty children array
+        ) : !isEmptyChildren(children) ? (
           React.Children.only(children)
         ) : (
           null