test('It should simulate submit action ', ()=>{
   let contactUs = shallow(<ContactUs />);
   sinon.spy(ContactUs.prototype, 'submitMessage');// Verify this method call
   let form = contactUs.find(Form)
   expect(form.length).toBe(1);//Failing over here
   let button = form.dive().find(Button);
   expect(button.length).toBe(1);
   button.setState({disabled : false});//Need to achieve this
   expect(button).toBeDefined();
   expect(button.length).toBe(1);
   expect(button.props().label).toBe('SEND MESSAGE');

   button.find('a').get(0).simulate('click');
  expect(ContactUs.prototype.submitMessage).toHaveProperty('callCount',
 1);
});

import React, {Component,PropTypes} from 'react';
import Form from './form';
import {sendSubscriptionMessage} from '../../network';
import Button from '../Fields/Button';

export default class ContactUs extends Component {

constructor(props) {
    super(props);
    this.state = {
        contactData: {}
    }
}

onChangeHandler(event) {
    let value = event.target.value;
    this.state.contactData[event.target.name] = value;
}

submitMessage(event) {
    event.preventDefault();
    sendSubscriptionMessage(this.state.contactData);
}

render() {
    return (<div className = "row pattern-black contact logo-container" id = "contact">
        <div className = "container" >
        <h2 className = "sectionTitle f-damion c-white mTop100" >
        Get in Touch!

       <Form onChangeHandler = {
            this.onChangeHandler.bind(this)
        } >
        <Button onClick = {
            this.submitMessage.bind(this)
        }
        className = "gradientButton pink inverse mTop50"
        label = "SEND MESSAGE" / >
        </Form> </div>
        </div>
    );
  }
 }

import React,{Component , PropTypes} from 'react';
import TextField from '../Fields/TextField';

export default class Form extends Component{

  static propTypes ={
    onChangeHandler : PropTypes.func.isRequired
  }


render(){

return(
 <form>
  <div className="col-lg-8 col-centered">
    <div className="col-lg-6">
        <TextField name="name" label="Name" required={true}
          onChangeHandler = {this.props.onChangeHandler}/>
    </div>
    <div className="col-lg-6">
        <TextField name="email" type="email" label="Email" required=
          {true} onChangeHandler = {this.props.onChangeHandler}/>
    </div>
  </div>
  <div className="col-lg-10 col-centered">
    <div className="col-lg-12">
       <TextField name="message" label="Message" required={true}
          onChangeHandler = {this.props.onChangeHandler}/>
    </div>
   </div>
   {this.props.children}
 </form>
   )
 }


}

import React,{Component,PropTypes} from 'react';
import classNames from 'classnames';

export default class Button extends Component{

static propTypes = {
  onClick : PropTypes.func.isRequired,
  label : PropTypes.string,
   wrapperClass : PropTypes.string,
   btnClass : PropTypes.string,
   url : PropTypes.string,
}

static defaultProps = {
  wrapperClass : 'col-lg-12 t-center',
  btnClass : '',
  label : 'SEND MESSAGE'
}

constructor(props){
  super(props);
  this.state = {
    disabled : false
  };
}

componentDidMount() {
  let forms = document.querySelectorAll('form');

  for (let form of forms) {

    if (form.contains(this.buttonEl)) {
      this.formEl = form;
      break;
    }
  }

  if (this.formEl) {
    this.toggleDisabled();
    this.formEl.addEventListener( 'click',
    this.toggleDisabled.bind(this));
    this.formEl.addEventListener('input',
    this.toggleDisabled.bind(this));
  }
}

toggleDisabled() {
  setTimeout(() => {
    this.setState({
      disabled: !this.formEl.checkValidity(),
    });
  }, 100);

}


render(){
  let btnCls = `${this.props.btnClass} gradientButton pink inverse
  mTop50`;
  let btnClass =  classNames({
    [btnCls] : true,
    'disable-link' : this.state.disabled
  });

  return(
    <div ref={(x) => this.buttonEl = x} className=
      {this.props.wrapperClass} >
      <a href={this.props.url ? this.props.url : null} onClick =
      {this.props.onClick} className={btnClass}>{this.props.label}</a>
    </div>
  );
 }

}