facebook / facebook/lexical

Bug: Isolated decorator node can be selected via SELECT_ALL_COMMAND (ctrl/command + A)

Open
#4,974 1 comment 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
23.9k
Forks
2.2k
Avg merge
1d 16h
Merged PRs (30d)
61

Description

Lexical version: 0.12.0

## Steps To Reproduce

1. Open [playground](https://playground.lexical.dev/)
2. Toolbar -> Insert -> Sticky Note
3. Press ctrl/command + A, the node got selected and can be deleted

## The current behavior

Isolated node can be selected via SELECT_ALL_COMMAND.

## The expected behavior

Isolated node cannot be selected.

## Analysis of current implementation
There is a flaw of current implementation:
A selection is represented as two endpoints, all the nodes in between are assumed to be selected. Therefore, Isolated nodes must be inserted at the beginning or at the beginning or at the end of the root, or it could be selected by mistake. Current Playground implementation of sticky note node intentionally does that, but there is no documentation or check from the framework.
https://github.com/facebook/lexical/blob/d679e1ff28e0a9151ac40cfa22b9cef6992a4f06/packages/lexical-playground/src/plugins/ToolbarPlugin/index.tsx#L1115-L1121
Anyway, it is a minor flaw.

---
To solve the problem, with the assumption that isolated node must appear at the beginning or at the end, the implementation of `ElementNode.select` can be modified. If anchor or offset is an isolated node, make the selection narrower.
https://github.com/facebook/lexical/blob/d679e1ff28e0a9151ac40cfa22b9cef6992a4f06/packages/lexical/src/nodes/LexicalElementNode.ts#L295

Contributor guide

Open the contributing guide

Research direction

Reproduce the sticky-note behavior in the playground through ToolbarPlugin/index.tsx, then inspect ElementNode.select in packages/lexical/src/nodes/LexicalElementNode.ts. Verify how SELECT_ALL_COMMAND represents the isolated node and confirm that the expected behavior is preserved after the selection handling is adjusted.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
38/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.