Upgrade react-codemirror2 to 3.X

[leplatrem]

Prerequisites

• I have read the documentation;
• In the case of a bug report, I understand that providing a SSCCE example is tremendously useful to the maintainers.

Description

In react-codemirror2 version 3.X, the CodeMirror component was split in two: Controlled and Uncontrolled.

I had troubles while upgrading. With the first one, the cursor goes to the end of the text box. With the second one, the onChange callback does not refresh the value submitted by the form.

Steps to reproduce

I was working on it via kinto/kinto-admin. Let me build a small demo, I'll post a comment

Version

"react-jsonschema-form": "^0.48.2",

[glasserc]

I had the opposite problems as you. In Controlled, typing doesn't change the value of the text box (because we aren't updating our value). In UnControlled, typing does change the value of the textbox, but the cursor jumps to the end (because we always update the text, bumping the cursor). There's a new autoCursor prop which we will probably have to set to false.

Some information about getting things to work with each alternative:

• Controlled: Change the prop onChange to onBeforeChange. I guess this is a hook that is added with the "next" value so that you can do whatever it is you want with it. However, now the cursor jumps to the end every time the JSON schema changes. Adding autoCursor={false} causes the cursor to never change position; when typing, characters appear after the cursor. I tried explicitly tracking the cursor using editor.getCursor() and cursor={this.state.cursor} but this changed nothing.
• UnControlled: Setting autoCursor to false seems to work OK. There's a quirk that when the JSON schema changes, the cursor jumps back to the position it had been explicitly set to before. I believe this behavior is the closest to the 2.X behavior we rely on.

This lets us update to 3.X. Updating to 4.X doesn't work: the behaviors are the same as if not setting autoCursor. The difference appears to be between v3.0.7 and v4.0.0. I have opened scniro/react-codemirror2#63 to ask for help from the maintainer.

[scniro]

@leplatrem @glasserc Hey guys, just chiming in to mention that I'm happy to help. I elaborated more on the project referenced issue - so let's keep the dialog going there. Whatever the issue is, we'll solve it 😎