[lexical][lexical-playground] Bug Fix: Create line break on paste of …

…content type text/html (facebook#6376) Co-authored-by: Janna Wieneke <[email protected]>
2wheeh · Jul 17, 2024 · 4b15060 · 4b15060
1 parent 220d2a0
commit 4b15060
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 3 deletions.
diff --git a/packages/lexical-utils/src/__tests__/unit/LexicalEventHelpers.test.tsx b/packages/lexical-utils/src/__tests__/unit/LexicalEventHelpers.test.tsx
@@ -668,6 +668,16 @@ describe('LexicalEventHelpers', () => {
           ],
           name: 'two lines + two paragraphs separated by an empty paragraph (2)',
         },
+        {
+          expectedHTML:
+            '<p class="editor-paragraph" dir="ltr"><span data-lexical-text="true">line 1</span><br><span data-lexical-text="true">line 2</span></p>',
+          inputs: [
+            pasteHTML(
+              '<p class="p1"><span>line 1</span><span><br></span><span>line 2</span></p>',
+            ),
+          ],
+          name: 'two lines and br in spans',
+        },
       ];
 
       suite.forEach((testUnit, i) => {

diff --git a/packages/lexical/src/nodes/LexicalLineBreakNode.ts b/packages/lexical/src/nodes/LexicalLineBreakNode.ts
@@ -50,7 +50,7 @@ export class LineBreakNode extends LexicalNode {
   static importDOM(): DOMConversionMap | null {
     return {
       br: (node: Node) => {
-        if (isOnlyChild(node)) {
+        if (isOnlyChildInParagraph(node)) {
           return null;
         }
         return {
@@ -89,9 +89,9 @@ export function $isLineBreakNode(
   return node instanceof LineBreakNode;
 }
 
-function isOnlyChild(node: Node): boolean {
+function isOnlyChildInParagraph(node: Node): boolean {
   const parentElement = node.parentElement;
-  if (parentElement !== null) {
+  if (parentElement !== null && parentElement.tagName === 'P') {
     const firstChild = parentElement.firstChild!;
     if (
       firstChild === node ||