Problem with non draggable node type with embeded content

1

I’ve added an inline schema node type for embeded content with draggable:false setting. The embeded div block may contain an iframe as for example a google maps iframe.

<div data-oembed="https://...">
    <iframe ..></iframe>
</div>

When rendering the node I just clone a dom node from outside of the editor and return it within in the toDOM function.

Now, if I set the iframes pointer-events:none style, and try to drag the node I expect nothing to happen, but somehow the node disappears.

I’am pretty new to Prosemirror and don’t know if this type of node rendering is intended and causes this strange drag issue (I don’t need collaborative support in the editor). Beside the drag issue it seems to work fine. Also I’am not sure about the isolating and atom node settings in this case.

Here is my schema: https://github.com/buddh4/humhub-prosemirror/blob/master/src/editor/markdown/schema.js#L182

2

Trying to ‘cache’ the DOM node in the attrs object is not going to work. Attributes should be a JSON-serializeable, plain-data representation of the node. The editor will only render the node once for each time it occurs anyway, so caching its DOM representation is completely unneccesary.

Selected nodes can always be dragged, and the draggable config only has an effect when the node is directly dragged. So if you don’t want to make such nodes draggable, you also have to set them to have selectable: false. However, from what I can see, I’m not sure why you’d want to prevent dragging to begin with.

I did find a bug in prosemirror-view while reproducing this, and will release an updated version in a moment.

Generally, your node definition looks like a bit of a mess (fromDOM fails to fill in required attributes, for example), and it might help to read the docs on node specs a bit closer.

Neither are relevant for leaf nodes (nodes without child nodes) — atom is implicitly true for such nodes, and isolating only has an effect when the node contains children.

3

Thanks for the detailed answer!

Yes, the schema is a bit messy, I’am still playing around and try to find a way to implement our current richtext features (and some additional ones), I will definetly clean things up once I’am more familiar with the API.

Ideally I would allow dragging the embedded nodes, but since they disappeared in my tests I thought I just disallow it for now.

By the way, would be great if there were a collection of available plugins or existing (open source) editors which already solved common editor issues as for example mentionings, emoji, additional markdown syntax etc. I’d like to contribute by sharing my solutions in the future, but as you can see I’am still in learning mode :wink: Just a thought, your examples on the homepage are already very helpful.

Update: The caching of the dom node was actually the cause of the drag issue, thanks for the support.