React Base Fiddle (JSX)

Starting point for creating JSFiddles with React. This uses React with Addons.

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.24/browser.js"></script>
<script src="https://npmcdn.com/react@15.3.1/dist/react-with-addons.js"></script>
<script src="https://npmcdn.com/react-dom@15.3.1/dist/react-dom.js"></script>
<script src="https://facebook.github.io/react/js/jsfiddle-integration-babel.js"></script>

<div id="container">
    <!-- This element's contents will be replaced with your component. -->
</div>

CSS

button + button {
  margin-left: 0.5em;
}

div {
  margin-bottom: 0.5em;
}

JavaScript 1.7

function logFormData(form) {
	console.log('test =', form.elements[0].value)
}

function FormTest(props) {
 	let formRef = null;
  
	const handleSubmit = (e) => {
  	e.preventDefault();
    logFormData(e.target);
  }
  
  const handleClick = () => {
  	if (formRef) {
    	logFormData(formRef);
    }
  }
  
  const typeValue = props.typeValue || '';
  
	return (
  	<form method="post" onSubmit={handleSubmit} ref={(ref) => { formRef = ref; }}>
    	<pre>{`
prop typeValue=${typeValue}
      `}</pre>
    	<div>
      	<select ref={(ref) => { window.selectDebugRef = ref; }} name="test" id={`test-${props.formId}`} value={typeValue} onChange={props.onTestChange} required>
          <option value="1">One</option>
          <option value="2">Two</option>
          <option value="3">Three</option>
          <option value="4">Four</option>
        </select>
      </div>
			<button type="button" onClick={handleClick}>Log form</button>    	
      <button type="submit">Sumbit</button>
    </form>
  )
}

var TestContainer = React.createClass({
	getInitialState() {
  	return {
      currentTypeValue: '2'
    }
  },
  
  handleTestChange(e) {
  	this.setState({ currentTypeValue: e.target.value });
  },
  
  render: function() {
    return (
    	<div>
      	<p> React Version: {React.version}</p>
      	<p>In IE Edge try to submit, even though the required select box has a value selected a "You must choose an item from the list" will be shown.</p>
        <p>Log form / Submit buttons will write values to console.</p>
				
        <FormTest
          formId={1}
          typeValue={this.state.currentTypeValue}
          onTestChange={this.handleTestChange}
         />
      </div>
    );
  }
});

ReactDOM.render(
  <TestContainer />,
  document.getElementById('container')
);