Reproduce https://github.com/jquense/react-formal/issues/15

index.js

import React from 'react';
import { render } from 'react-dom';

import yup from 'yup';
import Form from 'react-formal';


const schema = yup.object({
  test: yup.string()
});


const ExampleForm = (props) => {
  return (
    <Form
      schema={schema}
      defaultValue={schema.default()}
      onSubmit={props.onSubmit}
    >

      <Form.Field name="test" />

      <Form.Button type="submit">Submit</Form.Button>

    </Form>
  );
}


const Loader = () => (<div>Loading...</div>);

const App = React.createClass({
  getInitialState: () => ({
    isLoading: false
  }),

  onSubmit() {
    this.setState({ isLoading: true });
  },

  render() {
    return (
      <div>
        <p>Having fun removing the form from the DOM onSubmit.</p>

        {this.state.isLoading ? <Loader /> : <ExampleForm onSubmit={this.onSubmit} />}
      </div>
    )
  }
})

render(<App />, document.getElementById('root'));