[Fix]: Handle native inputs changes (#815)

Author: gohabereg

Diff for: dist/editor.js

@@ -4,6 +4,7 @@
 
 - `Improvements` — Inline Toolbar now works on mobile devices [#706](https://github.com/codex-team/editor.js/issues/706)
 - `Improvements` — Toolbar looks better on mobile devices [#706](https://github.com/codex-team/editor.js/issues/706)
+- `Fix` — EditorConfig's `onChange` callback now fires when native inputs\` content has been changed [#794](https://github.com/codex-team/editor.js/issues/794)
 - `New` — New [`blocks.insert()`](api.md) API method [#715](https://github.com/codex-team/editor.js/issues/715).  
 - `Deprecated` — [`blocks.insertNewBlock()`](api.md) method is deprecated. Use `blocks.insert()` instead.  
 - `Fix` — Resolve bug with deleting leading new lines [#726](https://github.com/codex-team/editor.js/issues/726)

Diff for: docs/CHANGELOG.md

@@ -32,16 +32,24 @@ export default class ModificationsObserver extends Module {
    * @type {Function}
    */
   private mutationDebouncer = _.debounce( () => {
+    this.updateNativeInputs();
     this.config.onChange();
   }, ModificationsObserver.DebounceTimer);
 
+  /**
+   * Array of native inputs in Blocks.
+   * Changes in native inputs are not handled by modification observer, so we need to set change event listeners on them
+   */
+  private nativeInputs: HTMLElement[] = [];
+
   /**
    * Clear timeout and set null to mutationDebouncer property
    */
   public destroy() {
     this.mutationDebouncer = null;
     this.observer.disconnect();
     this.observer = null;
+    this.nativeInputs.forEach((input) => this.Editor.Listeners.off(input, 'input', this.mutationDebouncer));
   }
 
   /**
@@ -142,4 +150,19 @@ export default class ModificationsObserver extends Module {
       this.mutationDebouncer();
     }
   }
+
+  /**
+   * Gets native inputs and set oninput event handler
+   */
+  private updateNativeInputs(): void {
+    if (this.nativeInputs) {
+      this.nativeInputs.forEach((input) => {
+        this.Editor.Listeners.off(input, 'input');
+      });
+    }
+
+    this.nativeInputs = Array.from(this.Editor.UI.nodes.redactor.querySelectorAll('textarea, input, select'));
+
+    this.nativeInputs.forEach((input) => this.Editor.Listeners.on(input, 'input', this.mutationDebouncer));
+  }
 }