Fix modifying state during onChange triggered by beforeinput

[sophiebits]

Fixes #92.

If an onChange handler replaces every "x" with an "abc", then when you type "x", we trigger onChange from beforeinput and rerender immediately with the content "abc", then the browser still inserts an "x" character!

This fix is surprisingly simple: instead of triggering an update during beforeinput, we simply wait until the input event to do so. This means that when we rerender, the browser would have already inserted the "x" character and React will correctly delete it when rerendering.

Test Plan: In plaintext example, change the handler to

this.onChange = (editorState) => {
  var content = editorState.getCurrentContent();
  return this.setState({
    editorState: EditorState.set(editorState, {
      currentContent: Modifier.removeInlineStyle(content, content.getSelectionAfter(), 'OVERFLOW');
    }),
  });
};

then type. Characters don't get duplicated like they did before.

[sophiebits]

cc @hellendag – This fix felt too obvious to me. Am I missing some reason why it can't work?

[sophiebits]

This doesn't work; typing #a in the tweet example only inserts a #. Need to investigate.

[sophiebits]

Fixed – I had a silly mistake. :)

@stopachka I choose you! Think this makes sense? And @hellendag too if you have time.

[hellendag]

Thanks! This seems reasonable to me!

I may not have considered this because I regard the post-mutation nature of the input event to be generally useless for Draft purposes (except for things like spellcheck, as used here), but this seems like a pretty clever way to use it.

This is enough of a core input change that it's worth staying on your toes to make sure it doesn't lead to any mysterious editing issues.

🦄

[paulyoung]

If there's anything I can do to help move this along, please let me know.

[davidgeilfus]

Hi, any idea when this will be merged? Thank you