addMessage() { let name = fD(this.refs.name).value.trim() let message = fD(this.refs.message).value.trim() if (!name || !message) { return console.error('Name and message cannot be empty') } this.props.addMessageCb({ name: name, message: message }) fD(this.refs.name).value = '' fD(this.refs.message).value = '' }
describe('Autocomplete', function() { it('have four initial options', function(){ var options = TestUtils.scryRenderedDOMComponentsWithClass(autocomplete, 'option-list-item') expect(options.length).toBe(4) }) it('change options based on the input', function(){ expect(fD(optionName).value).toBe('') fD(optionName).value = 'r' TestUtils.Simulate.change(fD(optionName)) expect(fD(optionName).value).toBe('r') options = TestUtils.scryRenderedDOMComponentsWithClass(autocomplete, 'option-list-item') expect(options.length).toBe(1) expect(fD(options[0]).textContent).toBe('#react') }) it('offer to save option when there are no matches', function(){ fD(optionName).value = 'ember' TestUtils.Simulate.change(fD(optionName)) options = TestUtils.scryRenderedDOMComponentsWithClass(autocomplete, 'option-list-item') expect(options.length).toBe(0) var optionAdd = TestUtils.findRenderedDOMComponentWithClass(autocomplete, 'option-add') expect(fD(optionAdd).textContent).toBe('Add #ember') }) })
React.createClass({ addMessage: function(){ this.props.addMessageCb({ name: fD(this.refs.name).value, message: fD(this.refs.message).value }) fD(this.refs.name).value = '' fD(this.refs.message).value = '' }, keyup: function (e) { if (e.keyCode == 13) return this.addMessage() }, render: function(){ return ( <div className="row-fluid" id="new-message"> <div className="span12"> <form className="well form-inline" onKeyUp={this.keyup}> <input type="text" name="username" className="input-small" placeholder="Azat" ref="name"/> <input type="text" name="message" className="input-small" placeholder="Hello!" ref="message" /> <a id="send" className="btn btn-primary" onClick={this.addMessage}>POST</a> </form> </div> </div> ) } })
React.createClass({displayName: "NewMessage", addMessage: function(){ this.props.addMessageCb({ name: fD(this.refs.name).value, message: fD(this.refs.message).value }) fD(this.refs.name).value = '' fD(this.refs.message).value = '' }, keyup: function (e) { if (e.keyCode == 13) return this.addMessage() }, render: function(){ return ( React.createElement("div", {className: "row-fluid", id: "new-message"}, React.createElement("div", {className: "span12"}, React.createElement("form", {className: "well form-inline", onKeyUp: this.keyup}, React.createElement("input", {type: "text", name: "username", className: "input-small", placeholder: "Azat", ref: "name"}), React.createElement("input", {type: "text", name: "message", className: "input-small", placeholder: "Hello!", ref: "message"}), React.createElement("a", {id: "send", className: "btn btn-primary", onClick: this.addMessage}, "POST") ) ) ) ) } })