title: react-quill loses focus when onChange is called
body: <p>I have a component wrapper in <code>antd</code> <code>Form.create()</code> HOC where I want to implement validation for my <code>react-quill</code> editor.</p>
  <pre><code>          &lt;Form.Item&gt;
              {getFieldDecorator('input', {
                rules: [RequiredRule],
                initialValue: text,
                onChange: this.onChangeText
              })(
                &lt;ReactQuill
                  className=&quot;question-form__rich-text&quot;
                  modules={quillToolbar}
                /&gt;,
              )}
            &lt;/Form.Item&gt;
  </code></pre>
  <p>If I start typing inside my <code>quill</code> editor text field it triggers the <code>onChangeText</code> function which in its turn changes the local state and initiates rerender of the component</p>
  <pre><code>  onChangeText = (_, __, ___, editor) =&gt; {
      this.setState({
        textVal: editor.getText(),
      });
    };
  </code></pre>
  <pre><code> this.state = {
        textVal: '',
      };
  </code></pre>
  <p>Every time the component rerenders my text field loses focus, so I have to click inside the field to type another letter.
  I noticed that it happens only if the <code>&lt;ReactQuill&gt;</code> component is wrapped by <code>antd</code> <code>&lt;Form.Item&gt;</code></p>
  <p>It also shows some weird behaviour if I put <code>console.log</code> inside <code>onChangeText</code> function and try to check what's inside the text field:
  <a href="https://i.stack.imgur.com/Vw3VH.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Vw3VH.png" alt="enter image description here" /></a></p>
  <p>Let's say my text field is initially empty. I type letter 'a' and it calls the function 3 times. First, it shows that the text field contains letter 'a', then it calls the function again showing that the field is empty and then the 3rd time letter 'a' appears again. This behaviour persists as I keep typing.
  Also, there is an warning saying <code>addRange(): The given range isn't in document.</code> which I have no idea what it means.</p>
  <p>I've been struggling with that issue for a few days now, any help would be greatly appreciated. Thank you</p>