Merge pull request #682 from creative-commoners/pulls/4.3/re-tinymce-…

…act-events

FIX Changing the value of a TinyMCE field will correctly trigger a change in the React component

client/src/components/HtmlEditorField/HtmlEditorField.js

@@ -72,7 +72,10 @@ class HtmlEditorField extends TextField {
       const unmountEvent = $.Event('EntwineElementsRemoved');
       const editorElement = document.getElementById(this.getInputProps().id);
       // Tell tinyMCE to persist changes into the text field
-      $(editorElement).entwine('ss').getEditor().save();
+      const editor = $(editorElement).entwine('ss').getEditor();
+      if (editor) {
+        editor.save();
+      }
       unmountEvent.targets = [editorElement];
       // Ensure that redux knows of the latest changes before the editor is destroyed.
       // This is pretty awful because TinyMCE triggers jQuery events which aren't picked up

client/src/components/TextField/TextField.js

@@ -69,6 +69,9 @@ class TextField extends Component {
    */
   handleChange(event) {
     if (typeof this.props.onChange === 'function') {
+      if (!event.target) {
+        return;
+      }
       this.props.onChange(event, { id: this.props.id, value: event.target.value });
     }
   }

client/src/legacy/HtmlEditorField.js

@@ -98,6 +98,7 @@ ss.editorWrappers.tinyMCE = (function() {
       // Update change detection
       if(!options.silent) {
         jQuery(instance.getElement()).trigger("change");
+        instance.getElement().dispatchEvent(new Event('input', { bubbles: true }));
       }
     },