JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.13.3/react.js"></script>
<div id="test"></div>

JavaScript

var d = React.DOM;

var AppClass = React.createClass({
    render() {
        return d.div(null,
                     d.h1(null, 'App'),
                     this.props.children);
    }
});


var HomePageClass = React.createClass({
    render() {
        return d.h1(null, 'Home Page');
    }
});

var UserPageClass = React.createClass({
    render() {
        return d.h1(null, 'User Page');
    }
});

var ViolationPageClass = React.createClass({
    render() {
        // return undefined to cause an Invariant Violation error.
        return;
    }
});


var ErrorPageClass = React.createClass({
    render() {
        return d.div(null,
                     d.h1(null, 'An Error happened'),
                     d.p(null, this.props.error.message));
    }
});


var App = React.createFactory(AppClass),

    HomePage = React.createFactory(HomePageClass),
    UserPage = React.createFactory(UserPageClass),
    ViolationPage = React.createFactory(ViolationPageClass),
    ErrorPage = React.createFactory(ErrorPageClass);

var mount = document.getElementById('test');

function go(page) {
    try {
        React.render(App(null, page), mount);
    } catch(e) {
        React.render(App(null, ErrorPage({error: e})), mount);
    }
}

// Display the home page
// -> works
go(HomePage(null));


// Display the user page
// -> works
setTimeout(function() {
    go(UserPage(null));
}, 500);


// Try to show the defect page
// -> Uncaught TypeError: Cannot read property '_currentElement' of null

setTimeout(function() {
    go(ViolationPage(null));
}, 1000);

// and now React is in an unstable state.