Merge adjacent links with the same URL when pasting#719
Open
yanfroes wants to merge 3 commits intobasecamp:mainfrom
Open
Merge adjacent links with the same URL when pasting#719yanfroes wants to merge 3 commits intobasecamp:mainfrom
yanfroes wants to merge 3 commits intobasecamp:mainfrom
Conversation
When pasting a URL over a selection that spans multiple text nodes or existing links, Lexical creates separate LinkNodes for each segment. This results in multiple adjacent anchor tags with the same URL, which is semantically incorrect and causes issues when editing. After applying a link via paste, scan the parent elements of the selection and merge any consecutive LinkNodes that share the same URL by moving children from the second link into the first and removing the duplicate. Fixes basecamp#594
There was a problem hiding this comment.
Pull request overview
This PR fixes issue #594 where pasting a URL over a selection containing multiple words creates separate LinkNode elements instead of a single merged link. The solution adds link merging functionality that runs after $toggleLink() to consolidate adjacent links with the same URL.
Changes:
- Added
$isLinkNodeimport from@lexical/linkfor type checking - Implemented
#mergeAdjacentLinks()to collect parent elements and trigger merging - Implemented
#mergeAdjacentLinksInElement()to merge consecutive sibling links with matching URLs
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Fixes #594
Problem:
When pasting a URL over a selection containing multiple words or existing links, Lexical creates separate
LinkNodeelements for each text segment. This results in HTML like:<a href="https://example.com">link1</a><a href="https://example.com"> </a><a href="https://example.com">link2</a>Instead of the expected single link:
<a href="https://example.com">link1 link2</a>This also affects selections spanning multiple list items or other block elements.
Solution:
After $toggleLink() applies the URL, we now scan all parent elements touched by the selection and merge any consecutive LinkNode siblings that share the same URL. The merge moves children from the second link into the first, then removes the duplicate node.
Changes:
Added #mergeAdjacentLinks() method to collect parent elements from selection nodes
Added #mergeAdjacentLinksInElement() method to scan and merge consecutive links with matching URLs
Added $isLinkNode import from @lexical/link