I’m trying to implement a plugin which would replace the ProseMirror code_block with a CodeMirror instance, using CodeMirror 6.
My starting point was the example in the ProseMirror examples section, I’m using a little bit different style though:
The editor loses focus after i propagate the changes to ProseMirror, and does not get it back, even though I’m calling .focus() on the CodeMirror instance.
As far as I understand CodeMirror should lose focus, but get it back after the setSelection method is called from ProseMirror. setSelection isn’t called here for some reason.
Related: I don’t think CM.refresh, updating, incomingChanges are necessary here. I’ve added updating it could be removed IMO.
Thanks for the help, CodeMirror 6 looks amazing, the typings are great and coming from ProseMirror it’s a very smooth switch!
Hey Marijn, did some more investigation.
After the CodeMirror transaction gets forwarded to ProseMirror then another transaction comes into ProseMirror which originates from the DOMObserver of PM, even though I set ignoreMutation to always return false. That transaction has a selection which points after the CodeMirror block.
Even if I discard that transaction in prosemirror ( by just not updating the editorView ) CodeMirror loses focus and I can’t get it back by calling focus() on the CodeMirror view ( I’ve tried some brutal hacks, for example I’ve created a button which calls focus() on the CodeMirror editor. If I click it by hand then it focuses, if I call click() it from code then it doesn’t get the focus back.
Do you have any pointers? I’ve linked the CodeMirror state/view for debugging, I didn’t see anything weird there.
We’re stranded here: using YJS the nodeviews are re-created all the time ( we insert a drag handler decoration which also triggers a re-draw ), and CM5 takes time to load, which causes a flicker.
I’m out of ideas.
I’ve updated the codesandbox above so it has the stack traces if you want to check them out.