lexical icon indicating copy to clipboard operation
lexical copied to clipboard

[lexical-list] Bug Fix: Treat whitespace-only list items as empty when pressing Enter

Open mike-atticus opened this issue 1 week ago • 1 comments

Description

Current behavior: When a list item contains only whitespace (e.g., a trailing space that was carried over when pressing Enter mid-line), pressing Enter does not exit the list. The user perceives the list item as empty and expects pressing Enter to exit the list, but because it contains an invisible space character, Lexical treats it as non-empty and creates new list items indefinitely. This can lead to a frustrating impression the automatic list behaviour is broken.

Reproduction steps:

  1. Create a bullet list item with text followed by a trailing space: "Some text "
  2. Position cursor before the trailing space: "Some text| "
  3. Press Enter - the trailing space moves to the new list item
  4. The new list item appears empty but contains the space
  5. Press Enter again - instead of exiting the list, another list item is created
  6. This continues indefinitely

Changes in this PR:

  • Modified $handleListInsertParagraph() in formatList.ts to detect whitespace-only list items
  • A list item is now treated as empty if:
    • All its children are TextNodes, AND
    • The combined text content is only whitespace
  • Added unit tests covering: empty list items, whitespace-only list items, non-whitespace content, and decorator nodes

Test plan

Before

https://github.com/user-attachments/assets/ffbc180d-b46b-4934-8bfa-84e26056999f

After

https://github.com/user-attachments/assets/5da721a3-53ae-4e13-b2d8-742e21e915dc

Unit tests added:

  • exits list when list item is completely empty
  • exits list when list item contains only whitespace
  • extends list when list item contains non-whitespace content
  • extends list when list item contains a decorator node

mike-atticus avatar Jan 08 '26 01:01 mike-atticus