Backspacing through a nested list doesn't work properly

[dilizarov]

What’s the bug you are facing?

When backspacing through a list and not starting at the last item, it clears the current item and the text of it's parent... but that is about it.

Video provided

https://www.loom.com/share/0dc205342dae40ecba2b73e715abf030

Which browser was this experienced in? Are any special extensions installed?

Version 99.0.4844.51 (Official Build) (x86_64)

How can we reproduce the bug on our side?

My video above demonstrates the bug.

This is done within your sandbox on tiptap.dev

Can you provide a CodeSandbox?

No response

What did you expect to happen?

I expect to naturally backspace through the list.

Anything to add? (optional)

No response

Did you update your dependencies?

• Yes, I’ve updated my dependencies to use the latest version of all packages.

Are you sponsoring us?

• Yes, I’m a sponsor. 💖

[pcbowers]

@dilizarov I believe this is not an issue with tiptap as a product and potentially more as an issue with documentation. I have used nested lists several times and am able to backspace appropriately.

That said, I tried to recreate the error myself on the homepage and was unable to do so. Here is my own video for reference:

Nested.List.Removal.Test.mp4

I held the spacebar for the first two levels and then started tapping for the next two. On both, it handled it just fine.

Did you try reloading the page/refreshing cache/restarting the browser?

[dilizarov]

You're backspacing from the very last item

Notice in my video that I don't start from the very end of the list, but on a nested item somewhere in the middle of the list.

[bkempe]

Maybe this helps #2493

[pcbowers]

@dilizarov I somehow missed that on your first comment! Thanks for clarifying.

[dilizarov]

@bkempe Yeah, I think your issue is actually basically this.

I'm not sure I understand your workaround though - seems like a completely different text editor? I see it uses ProseMIrror under the hood though... Are you suggesting a ListItem extension plugin that handles backspacing like in your workaround?

I feel like that could work - but then I suppose I'll need to get OrderedList and BulletList to use the new extended listItem, yeah?

[bkempe]

Yes, you'd need some like

const ListItemFixed = ListItem.extend({
  addKeyboardShortcuts() {
    return {
      ...this.parent?.(),
      Backspace: () => backspaceKeyCommand(this.editor, this.name),
    };
  },
});
useEditor({
  extensions: [
    StarterKit.configure({
      listItem: false,
    }),
    ListItemFixed,
  ],
  // ...
});

for TipTap and adjust the code in backspaceKeyCommand

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[bkempe]

activity

[bkempe]

BTW, the behavior of Remirror is more intuitive than Bangle in backspacing on (nested) lists.

[github-actions]

This issue is stale because it has been open 45 days with no activity. Remove stale label or comment or this will be closed in 7 days

[dilizarov]

saw the bot closed this, but feels like it should stay open as its a bug, yeah? @bkempe just confirmed it is still a bug on the tiptap.dev main website editor.

[Nantris]

Anyone following this should follow #3128 and/or #3819 instead.