Inline Codemirror inside Prosemirror?

1

Hi.

Is it possible to embed an inline CodeMirror view inside ProseMirror? The flow would be:

  1. someone types ``` (just like they write code)
  2. an inline, CodeMirror backed, custom node would popup that expands horizontally as the user is typing.

I’m trying to figure out if this is even possible.

Thanks!

2

Yes, it is, there’s even an example like that on the ProseMirror website.

1 Like
3

Yes! But I was thinking as an inline node, meaning instead of being a full width div, it just expands as the user types.

For instance, consider this paragraph with code as an inline codemirror in the middle of it. The part with code as an inline codemirror would be the codemirror instance.

4

Ah, no, CodeMirror assumes it is a block element, so for this you’d have to wrap it in some kind of inline-block container and add a kludge that constantly resizes it to match its content size. It won’t work as a regular content-fitting inline element.

5

@nostef I’m looking for the same solution. Did you ever get this working?