From 4d2ed6b1ea99a2449915dfb04d91b1eb79e1b811 Mon Sep 17 00:00:00 2001
From: Damien Duhamel <d.damien@live.fr>
Date: Sun, 23 Jul 2017 19:38:05 +0200
Subject: [PATCH 1/2] Check editor value after update

---
 .../VisualEditor/index.js                     | 49 ++++++++++++-------
 1 file changed, 31 insertions(+), 18 deletions(-)

diff --git a/src/components/Widgets/MarkdownControlElements/VisualEditor/index.js b/src/components/Widgets/MarkdownControlElements/VisualEditor/index.js
index fafadea4..59549b04 100644
--- a/src/components/Widgets/MarkdownControlElements/VisualEditor/index.js
+++ b/src/components/Widgets/MarkdownControlElements/VisualEditor/index.js
@@ -105,29 +105,42 @@ export default class Editor extends Component {
   }
 
   componentDidMount() {
-    const { schema, parser } = this.state;
-    const doc = parser.parse(this.props.value || '');
     this.view = new EditorView(this.ref, {
-      state: EditorState.create({
-        doc,
-        schema,
-        plugins: [
-          inputRules({
-            rules: allInputRules.concat(buildInputRules(schema)),
-          }),
-          keymap(buildKeymap(schema)),
-          keymap(baseKeymap),
-          history.history(),
-          keymap({
-            'Mod-z': history.undo,
-            'Mod-y': history.redo,
-          }),
-        ],
-      }),
+      state: this.createEditorState(),
       onAction: this.handleAction,
     });
   }
 
+  createEditorState() {
+    const { schema, parser } = this.state;
+    const doc = parser.parse(this.props.value || '');
+
+    return EditorState.create({
+      doc,
+      schema,
+      plugins: [
+        inputRules({
+          rules: allInputRules.concat(buildInputRules(schema)),
+        }),
+        keymap(buildKeymap(schema)),
+        keymap(baseKeymap),
+        history.history(),
+        keymap({
+          'Mod-z': history.undo,
+          'Mod-y': history.redo,
+        }),
+      ],
+    });
+  }
+
+  componentDidUpdate(prevProps, prevState) {
+    const editorValue = this.state.serializer.serialize(this.view.state.doc);
+
+    if (editorValue !== this.props.value && editorValue !== prevProps.value) {
+      this.view.updateState(this.createEditorState());
+    }
+  }
+
   handleAction = (action) => {
     const { serializer } = this.state;
     const newState = this.view.state.applyAction(action);

From 1b3aec4ebffb2bba7f1daf04288488e46210a6e2 Mon Sep 17 00:00:00 2001
From: Damien Duhamel <d.damien@live.fr>
Date: Tue, 25 Jul 2017 10:28:35 +0200
Subject: [PATCH 2/2] Add some comments

---
 .../Widgets/MarkdownControlElements/VisualEditor/index.js     | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/components/Widgets/MarkdownControlElements/VisualEditor/index.js b/src/components/Widgets/MarkdownControlElements/VisualEditor/index.js
index 59549b04..a00620ca 100644
--- a/src/components/Widgets/MarkdownControlElements/VisualEditor/index.js
+++ b/src/components/Widgets/MarkdownControlElements/VisualEditor/index.js
@@ -135,8 +135,10 @@ export default class Editor extends Component {
 
   componentDidUpdate(prevProps, prevState) {
     const editorValue = this.state.serializer.serialize(this.view.state.doc);
-
+    // Check that the content of the editor is well synchronized with the props value after rendering.
+    // Sometimes the editor isn't well updated (eg. after items reordering)
     if (editorValue !== this.props.value && editorValue !== prevProps.value) {
+      // If the content of the editor isn't correct, we update its state with a new one.
       this.view.updateState(this.createEditorState());
     }
   }