Autofill Safe

autofill.html

<!-- current component -->
<input type="email"
  name="email"
  class="form-control"
  placeholder="Email Address"
  value="{this.login.email}"
  onChange="{this.loginFieldChanged.bind(this)}"
  required/>

<!-- refactored component -->
<AutofillSafe type="email"
  name="email"
  class="form-control"
  placeholder="Email Address"
  value="{this.login.email}"
  onChange="{this.loginFieldChanged.bind(this)}"
  required="{true}"/>


<!-- Shared Component -->
class AutofillSafeInput extends BhApplicationComponent {
  
  static get propTypes(){
   return {
     onChange: React.PropTypes.func.isRequired
   }
  }
  

  render(){
    return (<input 
                   ref={(input)=>{ if (input.value) this.props.onChange({target: input}) }}
                   {...this.props}/>);
  }
}