CLassicist vs Mockist

State vs Behavior

Classicist

Testing State

var React   = require("react");
var Store   = require("../stores/counter");
var Header  = require("./Header");
var Form    = require("./Form");
var Counter = require("./Counter");

var mapCounter = (d, i) => {
    return <Counter {...d} key={"Counter-" + i}/>
};

var getStateFromStore = () => {
    return {
        counters : CounterStore.getCounters(),
        total    : CounterStore.getTotal()
    };
};

module.exports = React.createClass({
    displayName            : "Counters",
    getInitialState        : getStateFromStore,
    componentWillMount()   { CounterStore.sub(this.updateState); },
    componentWillUnmount() { CounterStore.unsub(this.updateState); },
    updateState()          { this.setState(getStateFromStore()); },

    render() {
        return  <div className="Counters">
                    <Header {...this.state}/>
                    <Form/>
                    { this.state.counters.map(mapCounter) }
                </div>
    }
});