I have some code like this inside a NodeView. We use TipTap but I don’t think it should be affecting this problem.
deleteButton.addEventListener('click', () => {
if (typeof getPos === 'function') {
listItem.classList.add('executingDeletion');
// Remove checkbox after short period to allow fade to display
setTimeout(() => {
const position = getPos();
const $pos = editor.view.state.doc.resolve(position);
editor.commands.deleteTaskItemOrListAtPosition($pos);
listItem.classList.remove('executingDeletion'); // TODO: Sometimes the next item has the classList applied to it. I don't know why or how (hard to reproduce except on iOS)
}, 75); // Timeout must match transition-duration in CSS
}
});
// ...
return {
dom: listItem,
contentDOM: content,
ignoreMutation: mutation => {
// Allow adding our custom classes
if (ALLOWED_ATTRIBUTE_NAME_CHANGES.has(mutation.attributeName))
return true;
},
};
I wish I had an easy way to repro this but I only have an ancient iPhone I hardly know how to use, and otherwise this is extremely difficult to reproduce.