Remove a node if the node is empty on leave


#1

Hi,

i have an NodeView for an image that can on click add a caption to the document and sets the cursor in the caption.

the schema is something like

caption: {
    content: 'text*',
    parseDOM: [{tag: 'div'}],
    toDOM() {
        return ['div', 0];
    },
},
image: {
    content: 'caption?',
    group: 'figure',
    parseDOM: ...
    toDOM...
},

what i would like is that if i “leave” the caption node and the node is empty (no text) to remove the node to not clutter the document with empty captions

i have no idea where to start to tackle something like that. some code or a starting point would be much appreciated


#2

A plugin with an appendTransaction property seems like a good approach here. It could look for an empty caption node that’s doesn’t have the selection, and if it finds one, add a transaction that deletes it (possibly optimizing by checking whether the selection was in an empty caption node before the transaction).


#3

thanks, i will code this out after the weekend, but this seems in a first test to to be working like a charm. the only problem i can see is that i don’t get the cleanup if i blur the full editor and i was in the caption node. but i can maybe ignore that case.