remove extra force re-renders on onCompositionStart/End (#1711)

packages/slate-react/src/components/content.js

@@ -71,7 +71,6 @@ class Content extends React.Component {
   constructor(props) {
     super(props)
     this.tmp = {}
-    this.tmp.key = 0
     this.tmp.isUpdatingSelection = false
 
     EVENT_HANDLERS.forEach(handler => {
@@ -276,12 +275,6 @@ class Content extends React.Component {
   onEvent(handler, event) {
     debug('onEvent', handler)
 
-    // COMPAT: Composition events can change the DOM out of under React, so we
-    // increment this key to ensure that a full re-render happens. (2017/10/16)
-    if (handler == 'onCompositionEnd') {
-      this.tmp.key++
-    }
-
     // Ignore `onBlur`, `onFocus` and `onSelect` events generated
     // programmatically while updating selection.
     if (
@@ -491,7 +484,6 @@ class Content extends React.Component {
       <Container
         {...handlers}
         data-slate-editor
-        key={this.tmp.key}
         ref={this.ref}
         data-key={document.key}
         contentEditable={readOnly ? null : true}

packages/slate-react/src/plugins/before.js

@@ -143,7 +143,10 @@ function BeforePlugin() {
       // HACK: we need to re-render the editor here so that it will update its
       // placeholder in case one is currently rendered. This should be handled
       // differently ideally, in a less invasive way?
-      editor.setState({ isComposing: false })
+      // (apply force re-render if isComposing changes)
+      if (editor.state.isComposing) {
+        editor.setState({ isComposing: false })
+      }
     })
 
     debug('onCompositionEnd', { event })
@@ -164,7 +167,10 @@ function BeforePlugin() {
     // HACK: we need to re-render the editor here so that it will update its
     // placeholder in case one is currently rendered. This should be handled
     // differently ideally, in a less invasive way?
-    editor.setState({ isComposing: true })
+    // (apply force re-render if isComposing changes)
+    if (!editor.state.isComposing) {
+      editor.setState({ isComposing: true })
+    }
 
     debug('onCompositionStart', { event })
   }