JSFiddle - React, Tailwind, and code Playground

by kirana

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/mocha/1.20.1/mocha.js"></script>
<link rel="stylesheet" href=" //cdnjs.cloudflare.com/ajax/libs/mocha/1.20.1/mocha.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/chai/1.9.1/chai.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/react/0.10.0/react-with-addons.js"></script>
<div id="mocha"></div>

JavaScript

var Events = React.createClass({
    getInitialState: function () {
        return {
            event: ''
        };
    },
    clickHandler: function () {
        this.setState({
            event: 'click'
        });
    },
    mouseEnterHandler: function () {
        this.setState({
            event: 'mouseenter'
        });
    },
    render: function () {
        return React.DOM.div(null, React.DOM.button({
            ref: 'button',
            onClick: this.clickHandler,
            onMouseEnter: this.mouseEnterHandler
        }, 'click or mouseenter'), React.DOM.div(null, this.state.event));
    }
});

mocha.setup("bdd");
chai.should();
var ReactTestUtils = React.addons.TestUtils;

describe('Events', function () {
    it('should have click event state', function (done) {
        var events = Events();
        ReactTestUtils.renderIntoDocument(events);
        ReactTestUtils.Simulate.click(events.refs.button.getDOMNode());
        events.state.event.should.equal('click');
        done();
    });

    // This test is failing 
    it('should have mouseenter event state', function (done) {
        var events = Events();
        ReactTestUtils.renderIntoDocument(events);
        ReactTestUtils.Simulate.mouseEnter(events.refs.button.getDOMNode());
        events.state.event.should.equal('mouseenter');
        done();
    });

});

mocha.run();