ianstormtaylor / slate

A completely customizable framework for building rich text editors. (Currently in beta.)
http://slatejs.org
MIT License
30.02k stars 3.26k forks source link

Delete backward is replacing the previous node by the current node #3408

Open zbeyens opened 4 years ago

zbeyens commented 4 years ago

Do you want to request a feature or report a bug?

Bug

What's the current behavior?

hJj77Yhl15

li (with empty text) is replaced by a p on deleteBackward.

Workaround until it's fixed:

// ...
editor.deleteBackward = (...args) => {
    deleteBackward(...args); 

    const match = Editor.above(editor, {
      match: n => unwrapTypes.includes(n.type),
    });

    if (match) {
      // quick fix for list item
      Transforms.setNodes(editor, { type: ListType.LIST_ITEM });
    }
};

Slate: 0.57.1 Browser: Chrome / Safari / Firefox / Edge OS: Mac / Windows / Linux / iOS / Android

What's the expected behavior?

It should not replace the node

pottedmeat commented 4 years ago

This is due to this code in mergeNodes which has the comment:

"If the target node that we're merging with is empty, remove it instead of merging the two. This is a common rich text editor behavior to prevent losing formatting when deleting entire nodes when you have a hanging selection."

You can see this more clearly exemplified in the table example where, if you clear the content of the final cell, then press backspace at the start of the next paragraph, it removes the cell:

2020-06-04 16 34 54

pottedmeat commented 4 years ago

To provide even more information, the code I referenced above removes the lowest empty block you're deleting into. What this means is that as long as you have paragraphs within these nodes, the paragraph will be deleted (great!) and not the empty block containing it. This is a gotcha, but it may not be a bug.

iamdhrooov commented 1 year ago

Hi @pottedmeat Is there any solution to this yet in the tables? This happens even when you shift select cells and press backspace. It removes the cells and the table looks messed.