cursor moves to the beginning of the line while typing quickly if the CodeMirror is controlled and the render of the component containing CodeMirror takes too long

[andreimatei]

Hello! I believe I'm running into a bug. My symptoms are similar to the old #199, but I'm using the latest version (4.23.6) and also the workaround from #199 (comment) does not work for me.

So, I'm typing into my controlled <CodeMirror> and, every few keystrokes, the cursor jumps to the beginning of the text box. I believe triggering the issue is dependent on <CodeMirror> being used in a "heavy" component: if the parent of <CodeMirror> (which supplies the value) is simple, then I don't get the cursor jump. If the parent component has a bunch of other sub-components (and so the render takes longer), then I do get the bug -- so I suspect the issue is some sort of race condition whereby an update of value arrives "too late", after more key presses.

My CodeMirror invocation looks like this:

    const [value, setValue] = useState("");
    <CodeMirror
      value={value}
      onChange={(value) => setValue(value)}
    />
    
    <MyOtherHeavyComponent/>

If I remove <MyOtherHeavyComponent/>, then it all works fine. Also, if I type slowly, it again works fine.

[azizghuloum]

Yeah. This is pretty bad. I now have to type code character by character otherwise the cursor jumps to the beginning and messes everything up.

[adamnieto]

This helped me but not sure if it will help you. So I was looking at this issue and I modified the code here to also call the user provided onChange and it stopped moving the cursor to the beginning.