Bug: SELECTION_CHANGE_COMMAND is not triggered if the anchor and focus are on nodes of the same type

[levensta]

Lexical version: 0.51.0

Steps To Reproduce

1. Select a part of the text such that the anchor node and the focus node are located on an unformatted TextNode
2. Press Backspace

Link to code example

The current behavior

SELECTION_CHANGE_COMMAND is not triggered in any browser. Note, however, that the command is dispatched if the selection boundary is located on a formatted text node or inside an inline node

selectionchange.in.partial.selection.mov

It has also been locally confirmed that the bug reproduces on version 0.50.0

The expected behavior

SELECTION_CHANGE_COMMAND is dispatched if a selection with boundaries is removed from any type of node

Impact of fix

Handlers tied to selection changes via a Lexical command do not receive the event, even though the selection has actually changed. Despite the specific conditions required to reproduce the bug, it appears that it may occur quite frequently

[levensta]

I also noticed that the bug reproduces if the anchor and focus are on nodes of the same type — for example, inside on inline nodes of the same class such as LinkNode or TextNode with the same formatting

selectionchange.in.same.type.nodes.mov

[etrepum]

While this should still be fixed (so long as there still is a SELECTION_CHANGE_COMMAND), if I was writing an app I would use an update listener to observe and react to selection changes.

[levensta]

This command is more convenient than an update listener, because with an update listener, you have to filter the argument values ​​to determine exactly what changed in the state

[etrepum]

The current heuristic is really just that the selection object changed, it doesn't really track when the selection itself changed

While handling 'selectionchange' DOM event, inside of an update:

    const previousSelection = $getPreviousSelection();
    const hasSelectionChanged =
      isSelectionChangeFromDOMUpdate ||
      (selection !== null
        ? selection.dirty ||
          !$isRangeSelection(selection) ||
          !selection.is(previousSelection)
        : previousSelection !== null);

    if (hasSelectionChanged) {
      dispatchCommand(editor, SELECTION_CHANGE_COMMAND);
    }

After committing the update, only fires when the selection changes to something like a NodeSelection or TableSelection:

  if (
    !$isRangeSelection(pendingSelection) &&
    pendingSelection !== null &&
    (currentSelection === null || !currentSelection.is(pendingSelection))
  ) {
    editor.dispatchCommand(SELECTION_CHANGE_COMMAND);
  }

Checking whether the selection changed in an update listener is just about the same amount of code as one of these, but you can decide what a selection change means to you.

I suspect that this command mostly exists for parity with DOM 'selectionchange' but probably didn't get a lot of use so nobody paid much attention to whether it works "correctly" or not. The two primary use cases I see in the monorepo are tracking which editor has focus (since SELECTION_CHANGE_COMMAND bubbles to the parent) and triggering a toolbar update. The first use case should work well enough as-is (might actually work better as-is when programmatic updates are not tracked) and the latter is something that's harder to notice.

[levensta]

It’s not about how much code is required to check the element selection, but rather the tracking method. As a user, I find it more convenient to subscribe to SELECTION_CHANGE_COMMAND and know specifically that the selection within the editor has changed. It’s like choosing KEY_ESCAPE_COMMAND over KEY_DOWN_COMMAND to handle the Escape key—it’s a matter of declarativeness

[etrepum]

Right, but here you have a command that's never really worked correctly. Sometimes it fires mid-commit, sometimes it fires after the commit, and sometimes it doesn't fire at all. It also fires across editors (the only real utility of this function that works today - to track which editor is focused). You probably also already have an update listener that this code can be fused into.