fix(richtext-lexical): prevent extra paragraph when inserting blocks or uploadNodes. Add preemptive selection normalization #12077
Conversation
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
…locks or uploadNodes. Add a preventative plugin to normalize the selection
GermanJablo
commented
Apr 21, 2025
Comment on lines
+62
to
+63
| // Insert blocks node BEFORE potentially removing focusNode, as $insertNodeToNearestRoot errors if the focusNode doesn't exist | ||
| $insertNodeToNearestRoot(blockNode) |
There was a problem hiding this comment.
This is the key point of the fix. We still insert before removing focusNode, but after getting focusNode, since $insertNodeToNearestRoot can change the selection.
GermanJablo
commented
Apr 21, 2025
Comment on lines
-65
to
67
| // First, delete currently selected node if it's an empty paragraph and if there are sufficient | ||
| // paragraph nodes (more than 1) left in the parent node, so that we don't "trap" the user | ||
| if ( | ||
| $isParagraphNode(focusNode) && | ||
| focusNode.getTextContentSize() === 0 && | ||
| focusNode | ||
| .getParentOrThrow() | ||
| .getChildren() | ||
| .filter((node) => $isParagraphNode(node)).length > 1 | ||
| ) { | ||
| // Delete the node it it's an empty paragraph | ||
| if ($isParagraphNode(focusNode) && !focusNode.__first) { | ||
| focusNode.remove() |
There was a problem hiding this comment.
Since PR #10530 this is no longer necessary
GermanJablo
commented
Apr 21, 2025
| @@ -112,6 +107,7 @@ export const LexicalEditor: React.FC< | |||
| } | |||
| ErrorBoundary={LexicalErrorBoundary} | |||
| /> | |||
| <NormalizeSelectionPlugin /> | |||
There was a problem hiding this comment.
The issue was resolved with the changes above, so this isn't strictly necessary, but I decided to add it to make the editor more robust and prevent errors in the future. Additionally, I believe this will fix a bug in the email builder plugin.
paulpopus
approved these changes
Apr 29, 2025
|
🚀 This is included in version v3.36.0 |
kendelljoseph
pushed a commit
that referenced
this pull request
May 15, 2025
…or uploadNodes. Add preemptive selection normalization (#12077) Fixes #11628 PR #6389 caused bug #11628, which is a regression, as it had already been fixed in #4441 It is likely that some things have changed because [Lexical had recently made improvements](facebook/lexical#7046) to address selection normalization. Although it wasn't necessary to resolve the issue, I added a `NormalizeSelectionPlugin` to the editor, which makes selection handling in the editor more robust. I'm also adding a new collection to the Lexical test suite, intending it to be used by default for most tests going forward. I've left an explanatory comment on the dashboard. ___ Looking at #11628's video, it seems users also want to be able to prevent the first paragraph from being empty. This makes sense to me, so I think in another PR we could add a button at the top, just [like we did at the bottom of the editor](#10530).
kendelljoseph
pushed a commit
that referenced
this pull request
May 19, 2025
…or uploadNodes. Add preemptive selection normalization (#12077) Fixes #11628 PR #6389 caused bug #11628, which is a regression, as it had already been fixed in #4441 It is likely that some things have changed because [Lexical had recently made improvements](facebook/lexical#7046) to address selection normalization. Although it wasn't necessary to resolve the issue, I added a `NormalizeSelectionPlugin` to the editor, which makes selection handling in the editor more robust. I'm also adding a new collection to the Lexical test suite, intending it to be used by default for most tests going forward. I've left an explanatory comment on the dashboard. ___ Looking at #11628's video, it seems users also want to be able to prevent the first paragraph from being empty. This makes sense to me, so I think in another PR we could add a button at the top, just [like we did at the bottom of the editor](#10530).
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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 #11628
PR #6389 caused bug #11628, which is a regression, as it had already been fixed in #4441
It is likely that some things have changed because Lexical had recently made improvements to address selection normalization.
Although it wasn't necessary to resolve the issue, I added a
NormalizeSelectionPluginto the editor, which makes selection handling in the editor more robust.I'm also adding a new collection to the Lexical test suite, intending it to be used by default for most tests going forward. I've left an explanatory comment on the dashboard.
Looking at #11628's video, it seems users also want to be able to prevent the first paragraph from being empty. This makes sense to me, so I think in another PR we could add a button at the top, just like we did at the bottom of the editor.