onChange fires when value is changed programatically

onChange is called when the Codemirror component receives a new value when rendering.

Test case: https://gist.github.com/insin/9e507894f3858028c7e5 Live version: http://bl.ocks.org/insin/raw/9e507894f3858028c7e5/

Every call to onChange is alert()-ed, Clicking the “Change value” button changes the value in the component’s state.

Just got bit by this using Redux, as updating some state which was being passed to Codemirror resulted in another dispatch firing via onChange, resulting in old state being retained. Worked around it myself by having onChange check if it received the same value as was being used for rendering, but is this behaviour something that’s possible to control, or it is a consequence of how Codemirror itself is implemented?

[atis--]

The example doesn’t really work for me (some errors in the console). However, the change event from CodeMirror instance has a second argument which describes the change. If value comes from setValue() call, then change.origin == 'setValue', so I think that may be used to differentiate between the changes.

[scniro]

Hey all. I too was struggling with some related issues and decided to roll another wrapper for this at react-codemirror2. No external deps, state free, and works well for my use case. Please give it a look if you are feeling adventurous. I’d like to actively maintain it moving forward. I’m also looking for suggestions to craft it in the best fashion moving forward, so feel free to open up an issue with any wants/tips/etc you may want. Thanks!