Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Bug: Selecting text in a link to/from the end of the link and deleting deletes the text that is not selected #6991

Open
amanharwara opened this issue Dec 23, 2024 · 4 comments

Comments

@amanharwara
Copy link
Contributor

amanharwara commented Dec 23, 2024

Lexical version: 0.21.0

Steps To Reproduce

  1. Have a link node with a single text node, and another text node as the next sibling of the link node.
  2. In the link, select text from the middle to the end or vice-versa. Either the anchor or the focus should have type element, offset 1 and key of the link node. This can be achieved by starting the selection from the middle then selecting the first character of the next text node and then back to the end of the link, or by starting the selection from the end of the link's text node.
  3. Press backspace or delete to delete the characters

It doesn't seem possible to get the selection into this state if the link node has multiple child text nodes or if the link node does not have a text node sibling next to it.

Link to code example: https://playground.lexical.dev (as of 23rd dec)

The current behavior

Pressing backspace or delete causes the text which is not selected to be deleted and the selection to be collapsed at the start of that text node.

lexical-link-text-deletion.mov

The expected behavior

Only the text that was selected should be deleted.

Impact of fix

This affects any user that tries to delete text at the end of a link and isn't careful about overselecting text initially. If the user starts selecting from the end of the link, then this happens even without overselecting from the sibling text node.

@etrepum
Copy link
Collaborator

etrepum commented Dec 30, 2024

Can you be more specific about how exactly you're creating this element selection? With Chrome 131.0.6778.205 on macOS 15.2 I can only get it to land on text points for both anchor and focus with either mouse or keyboard selection.

@amanharwara
Copy link
Contributor Author

Hmm it seems like this might be an issue on Firefox only. I tested right now on Chrome and Safari and was not able to replicate.

On Firefox, I'm able to replicate in a few ways:

  • Select from the end of the link to middle using either keyboard or mouse (anchor will be element)
  • Select from middle of link to the end using mouse (focus will be element)
  • Select from middle of link to the first character of the sibling and then back to the end of the link using either keyboard or mouse (focus will be element)

@amanharwara
Copy link
Contributor Author

I'm also able to get it to happen at the start of the link if I select from the start to the middle using the keyboard. But that doesn't seem to affect deletion in a negative way.

@etrepum
Copy link
Collaborator

etrepum commented Dec 31, 2024

I think there are two issues here that when combined you see this bug:

  1. Cross-browser: getNodes is returning the wrong thing in this scenario (related to, but not fixed by, [lexical] Bug Fix: Fix getNodes over-selection #7006)
  2. Firefox: for whatever reason this selection movement creates a point that is not normalized in the same way as other browsers (normally the point would normalize to text)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants