React - getChildContext and context types

Checking if getChildContext is propagated down the chain even if intermediate components don't define contextTypes

by ryansukale

HTML

<script src="http://fb.me/JSXTransformer-0.12.1.js"></script>
<script src="http://fb.me/react-with-addons-0.12.1.js"></script>
<script src="http://facebook.github.io/react/js/jsfiddle-integration.js"></script>

JavaScript 1.7

var Grandparent = React.createClass({
    childContextTypes: {
         message: React.PropTypes.string.isRequired
    },

    getChildContext: function() {
         return { message: "From Grandparent" };
    },

    render: function() {
         return <Parent />;
    }
});

var Parent = React.createClass({
    // Notice how this component does not have either the
    // getChildContext method or the childContextTypes map.
    render: function() {
        return <Child />;
    }
});

var Child = React.createClass({
    contextTypes: {
        message: React.PropTypes.string.isRequired
    },

    render: function() {
        return <div>message: {this.context.message}</div>;
    }
});

// Outputs: "message: From Grandparent"
React.render(<Grandparent />, document.body);