title: How to test meta.valid react final form
body: <p>I am using react-final-form to validate the input field as below:</p>
  
  <pre><code>buildInputComponent() {
  return (
    &lt;InputField
      id="input-field"
      label="description"
      isInvalid={meta.touched &amp;&amp; !meta.valid}
      error={meta.error}
      value=input.value
      required
      onChange={(event) =&gt; {
        input.onChange(event.target.value);
      }}
    /&gt;);
  }
  </code></pre>
  
  <p>i have tested it as follows:</p>
  
  <pre><code>it('sets the frequency state to the value in the frequency select', () 
  =&gt;   {
         const inputValue = '30';
         testInput.find('input-field').find('input').hostNodes()
            .simulate('change', { target: { value: inputValue } });
       testInput.update();
  
     expect(testInput.find('ReactFinalForm').instance().state.schedule.frequency).toEqual(frequency);
  
    });'
  </code></pre>
  
  <p>This covers the test for meta.touched, but the coverage report shows it does not cover the test for !meta.valid
  I have no idea how to cover the test for !meta.valid
  I tried having empty field as below:</p>
  
  <pre><code>testInput.find('input-field').find('input').hostNodes()
        .simulate('change', { target: { value: frequency } });
  </code></pre>
  
  <p>But this did not cover it, Please help</p>