setState are not allowed while an update is in progress

I got this error
Calls to EditorView.setState are not allowed while an update is in progress.
Can someone explain to me when will this happens? and what is the best way to avoid it?

The stack trace for the error should tell you where you are doing this. You’re probably calling EditorView.dispatch from some place that is called during an update. That’s not allowed—you can only update the view after the current update is finished.

I try to understand how one can call a dispatch inside an view.update. How can that happens?

1 Like

If you call it from a plugin update function, for example, those will be called during the editor update.

My stacktrace looks like this. Still not very sure how this happened.

    at EditorView.setState (index.js?4948:6237:1)
    at setCodeTextAndStates (libCodeEditor.tsx?047f:269:18)
    at eval (CodeEditor.tsx?6ea9:408:33)
    at invokePassiveEffectCreate (react-dom.development.js?61bb:23487:1)
    at HTMLUnknownElement.callCallback (react-dom.development.js?61bb:3945:1)
    at Object.invokeGuardedCallbackDev (react-dom.development.js?61bb:3994:1)
    at invokeGuardedCallback (react-dom.development.js?61bb:4056:1)
    at flushPassiveEffectsImpl (react-dom.development.js?61bb:23574:1)
    at unstable_runWithPriority (scheduler.development.js?3069:468:1)
    at runWithPriority$1 (react-dom.development.js?61bb:11276:1)
    at flushPassiveEffects (react-dom.development.js?61bb:23447:1)
    at flushDiscreteUpdates (react-dom.development.js?61bb:22356:1)
    at flushDiscreteUpdatesIfNeeded (react-dom.development.js?61bb:3768:1)
    at dispatchDiscreteEvent (react-dom.development.js?61bb:5886:1)
    at eval (index.js?4948:2614:1)
    at DOMObserver.ignore (index.js?4948:5632:1)
    at DocView.updateSelection (index.js?4948:2592:1)
    at EditorView.update (index.js?4948:6215:1)
    at DOMObserver.flush (index.js?4948:5736:1)
    at DOMObserver.forceFlush (index.js?4948:5692:1)
    at EditorView.measure (index.js?4948:6304:1)
    at eval (index.js?4948:6453:1)```

Looks like you’re dispatching an update from some hook on a React component, but I don’t know enough about React to really figure out what’s going on there.

for anyone who runs into the same issue, i fixed this by upgrade to react 18.2.0.