title: React Native Navigator Not Working
body: <p>I've been struggling with Navigator in React Native Web for a good 2 days now and can't figure out what the problem is. It is worth noting that before attempting to use the Navigator, everything was working fine, and this code is running on a browser. I have the following code below and keep getting the error message:</p>
  
  <p>"bundle.js:784 Warning: React.createElement: type should not be null, undefined, boolean, or number. It should be a string (for DOM elements) or a ReactClass (for composite components). Check the render method of <code>Home</code>."</p>
  
  <p>Followed by:</p>
  
  <p>"bundle.js:640 Uncaught Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. Check the render method of <code>Home</code>."</p>
  
  <p>Basically, I have a component called "Home" and I am trying to renderScene using the Navigator fairly deeply nested in this component but it isn't working. I have used this same Navigator code on another app and it worked, minus a few changes in the props passed. Any help would be greatly appreciated!</p>
  
  <pre><code>const React = require('react-native-web')
  const {
    Text,
    View,
    StyleSheet,
    Image,
    Navigator,
    TouchableHighlight,
    Component
  } = React;
  
  
  
  
  var Home = React.createClass({
      renderScene(route, navigator) {
        if(route.name == 'Baseball') {
          return &lt;Baseball navigator={navigator} {...route.passProps} /&gt;
        }
        if(route.name == 'Football') {
          return &lt;Football navigator={navigator} {...route.passProps} /&gt;
        }
      },
  
      render() {
          return (
              &lt;View&gt;
                  &lt;View&gt;
                      &lt;Image
                          style={styles.homeImage}
                          source={require('./img/baseball.png')}&gt;
                          &lt;View style={styles.tagLineWrapper}&gt;
                              &lt;Text style={styles.tagLine}&gt;
                                  Real Sports.
                              &lt;/Text&gt;
                              &lt;Text style={styles.tagLine}&gt;
                                  Real Skill.
                              &lt;/Text&gt;
                              &lt;Text style={styles.tagLine}&gt;
                                  Real Prizes.
                              &lt;/Text&gt;
                          &lt;/View&gt;
                      &lt;/Image&gt;
              &lt;/View&gt;
              &lt;View style = {styles.appStoreBar}&gt;
                  &lt;Text style={styles.darkText}&gt;
                      Available Now!
                  &lt;/Text&gt;
                  &lt;View style={styles.appStoreButton}&gt;
                  &lt;Image
                      style={styles.button}
                      source={require('./img/app-store-button-yellow.png')}
                  /&gt;
                  &lt;/View&gt;
              &lt;/View&gt;
                  &lt;Text style = {styles.instructionsHeader}&gt;
                      How Pick a Play Works
                  &lt;/Text&gt;
              &lt;View style = {styles.doubleIphoneWrapper}&gt;
                  &lt;View style = {styles.singleIphoneWrapper}&gt;
                      &lt;Text style = {styles.instructionsSubHeaderText}&gt;
                          1. Pick a Contest
                      &lt;/Text&gt;
                      &lt;View style={styles.instructionsWrapper}&gt;
                          &lt;Text style={styles.instructions}&gt;
                              Pick 5, 6, or 7 correctly and win the amount shown on the right.
                          &lt;/Text&gt;
                      &lt;/View&gt;
                          &lt;View style={styles.iphoneAndChevronWrapper}&gt;
                              &lt;Image
                                  style={styles.chevronIcons}
                                  source={require('./img/chevron-left.png')}
                              /&gt;
                              &lt;View style={styles.iphoneAndScreenWrapper}&gt;
                                  &lt;Image
                                      style={styles.iphone}
                                      source={require('./img/iphone5-vertical.png')} &gt;
                                      &lt;Navigator
                                        initialRoute={{name: 'Baseball'}}
                                        renderScene={this.renderScene} /&gt;
                                  &lt;/Image&gt;
                              &lt;/View&gt;
                              &lt;Image
                                  style={styles.chevronIcons}
                                  source={require('./img/chevron-right.png')}
                              /&gt;
                          &lt;/View&gt;
                  &lt;/View&gt;
  
                  &lt;View style = {styles.singleIphoneWrapper}&gt;
                      &lt;Text style = {styles.instructionsSubHeaderText}&gt;
                          1. Pick a Game
                      &lt;/Text&gt;
                      &lt;View style={styles.instructionsWrapper}&gt;
                          &lt;Text style={styles.instructions}&gt;
                              Make sure it’s a game you are available to watch in real time.
                          &lt;/Text&gt;
                      &lt;/View&gt;
                      &lt;View style={styles.iphoneAndChevronWrapper}&gt;
                          &lt;Image
                              style={styles.chevronIcons}
                              source={require('./img/chevron-left.png')}
                          /&gt;
                          &lt;Image
                              style={styles.iphone}
                              source={require('./img/iphone5-vertical.png')}&gt;
  
                          &lt;/Image&gt;
                          &lt;Image
                              style={styles.chevronIcons}
                              source={require('./img/chevron-right.png')}
                          /&gt;
                      &lt;/View&gt;
                  &lt;/View&gt;
                  &lt;/View&gt;
   &lt;/View&gt;
  )
  }
  })
  
  var Baseball = React.createClass({
      _navigate(name) {
    this.props.navigator.push({
    name: 'Football',
    passProps: {
    name: name
    }
   })
  },
      render() {
          return (
              &lt;View style={[styles.screenView, {backgroundColor: 'blue'}]}&gt;
              &lt;/View&gt;
          )
      }
  })
  
  var Football = React.createClass({
      _navigate(name) {
    this.props.navigator.push({
    name: 'Baseball',
    passProps: {
    name: name
    }
   })
  },
      render() {
          return (
              &lt;View style={[styles.screenView, {backgroundColor: 'green'}]}&gt;
              &lt;/View&gt;
          )
      }
  })
  
   const styles = StyleSheet.create({
    homeText: {
      color: '#1C1C1C',
      fontFamily: '"Helvetica Neue", Helvetica, Arial, sans-serif'
    },
    homeImage: {
     maxHeight: 350,
     flex: 0
    },
    tagLineWrapper: {
     alignSelf: 'flex-end',
     marginRight: 200,
     marginTop: 220
    },
    tagLine: {
     fontSize: 20,
     fontStyle: 'italic',
     color: 'white',
     alignSelf: 'flex-start',
     marginTop: 10,
     fontFamily: '"Helvetica Neue", Helvetica, Arial, sans-serif'
    },
    instructionsHeader: {
     fontSize: 27,
     fontWeight: 'bold',
     marginTop: 40,
     color: '#1C1C1C',
     alignSelf: 'center'
    },
    doubleIphoneWrapper: {
     flexDirection: 'row',
     justifyContent: 'center'
    },
    singleIphoneWrapper: {
     flexDirection: 'column',
     justifyContent: 'center',
     alignItems: 'center',
     margin: 40
    },
    instructionsSubHeaderText: {
     fontSize: 18,
     color: '#1C1C1C',
     marginTop: 60,
     alignSelf: 'center'
    },
    instructionsWrapper: {
     width: 194,
     height: 64,
     alignSelf: 'center'
    },
    instructions: {
     fontSize: 13,
     padding: 20,
     textAlign: "center"
    },
    appStoreBar: {
     alignSelf: 'stretch',
     flexDirection: 'row',
     justifyContent: 'center',
     alignItems: 'center',
     padding: 30,
     backgroundColor: '#ededed'
  
    },
    darkText: {
     fontSize: 24,
     color: '#1C1C1C',
     marginRight: 10
    },
    appStoreButton: {
     width: 200,
     marginLeft: 10
    },
    iphone: {
     width: 300,
     margin: 30
    },
    chevronIcons: {
     height: 30,
     alignSelf: 'center',
     margin: 0
    },
    iphoneAndChevronWrapper: {
     flexDirection: 'row',
     justifyContent: 'center',
     alignItems: 'center'
    },
    screenView: {
     height: 338,
     width: 192,
     alignSelf: 'center',
     marginTop: 100,
    },
    iphoneAndScreenWrapper: {
     justifyContent: 'center',
     alignItems: 'center',
    }
   })
  
  
  
  module.exports = Home;
  </code></pre>