How do you get a mutation observer to detect a value change of a textarea?

Question

I have seen mutation observers used to obtain the properties of doms when they are modified such as with the google chrome developer tools. I can't, however, find how to call a function when the text within a textarea changes due to a user typing or pasting. In my code, as the user types the callbacks don't get called, even with all the observe options set to true. What is the code for this?

Answer 1

The mutation observers listen for changes of the DOM. The current state of form elements, however, is not reflected by the DOM.

For example, create an input element input without setting the value attribute. When text is being entered into the input field, input.value reflects this text. On the other hand, input.getAttribute('value') still returns null.

Therefore, the mutation observers can't observe this change in the form field's status.

(Object.observe of the proposed ECMAScript 6th edition also doesn't help. Although one can listen on changes of host objects in recent versions of Chrome, changes of host object properties like value of input above are not being observed.)