From 012f7fc6947d386cc14c3b85f15e7819586a79d2 Mon Sep 17 00:00:00 2001 From: Sahejkm Date: Tue, 9 Apr 2024 16:59:20 +0800 Subject: [PATCH 1/3] Fix styling from td not persisted on copy paste --- .../lexical-table/src/LexicalTableCellNode.ts | 23 +++++++++++++++++++ 1 file changed, 23 insertions(+) diff --git a/packages/lexical-table/src/LexicalTableCellNode.ts b/packages/lexical-table/src/LexicalTableCellNode.ts index ad603913468..b4e0affc578 100644 --- a/packages/lexical-table/src/LexicalTableCellNode.ts +++ b/packages/lexical-table/src/LexicalTableCellNode.ts @@ -24,6 +24,7 @@ import { $createParagraphNode, $isElementNode, $isLineBreakNode, + $isTextNode, ElementNode, } from 'lexical'; @@ -315,6 +316,14 @@ export function convertTableCellNodeElement( tableCellNode.__backgroundColor = backgroundColor; } + const hasBoldFontWeight = + domNode_.style.fontWeight === '700' || domNode_.style.fontWeight === 'bold'; + const hasLinethroughTextDecoration = + domNode_.style.textDecoration === 'line-through'; + const hasItalicFontStyle = domNode_.style.fontStyle === 'italic'; + const hasUnderlineTextDecoration = + domNode_.style.textDecoration === 'underline'; + return { after: (childLexicalNodes) => { if (childLexicalNodes.length === 0) { @@ -331,6 +340,20 @@ export function convertTableCellNodeElement( ) { return null; } + if ($isTextNode(lexicalNode)) { + if (hasBoldFontWeight) { + lexicalNode.toggleFormat('bold'); + } + if (hasLinethroughTextDecoration) { + lexicalNode.toggleFormat('strikethrough'); + } + if (hasItalicFontStyle) { + lexicalNode.toggleFormat('italic'); + } + if (hasUnderlineTextDecoration) { + lexicalNode.toggleFormat('underline'); + } + } paragraphNode.append(lexicalNode); return paragraphNode; } From 614ef744d2c312551670bb999d838525ea9e4b2e Mon Sep 17 00:00:00 2001 From: Sahejkm Date: Tue, 9 Apr 2024 17:10:57 +0800 Subject: [PATCH 2/3] extract variable --- packages/lexical-table/src/LexicalTableCellNode.ts | 11 +++++------ 1 file changed, 5 insertions(+), 6 deletions(-) diff --git a/packages/lexical-table/src/LexicalTableCellNode.ts b/packages/lexical-table/src/LexicalTableCellNode.ts index b4e0affc578..d9cc43c696a 100644 --- a/packages/lexical-table/src/LexicalTableCellNode.ts +++ b/packages/lexical-table/src/LexicalTableCellNode.ts @@ -316,13 +316,12 @@ export function convertTableCellNodeElement( tableCellNode.__backgroundColor = backgroundColor; } + const style = domNode_.style; const hasBoldFontWeight = - domNode_.style.fontWeight === '700' || domNode_.style.fontWeight === 'bold'; - const hasLinethroughTextDecoration = - domNode_.style.textDecoration === 'line-through'; - const hasItalicFontStyle = domNode_.style.fontStyle === 'italic'; - const hasUnderlineTextDecoration = - domNode_.style.textDecoration === 'underline'; + style.fontWeight === '700' || style.fontWeight === 'bold'; + const hasLinethroughTextDecoration = style.textDecoration === 'line-through'; + const hasItalicFontStyle = style.fontStyle === 'italic'; + const hasUnderlineTextDecoration = style.textDecoration === 'underline'; return { after: (childLexicalNodes) => { From 21295651156ff74a3f6e390f33547ff7a66533db Mon Sep 17 00:00:00 2001 From: Sahejkm Date: Tue, 9 Apr 2024 17:56:31 +0800 Subject: [PATCH 3/3] Add tests --- .../__tests__/e2e/CodeBlock.spec.mjs | 63 +++++++++++++++++++ 1 file changed, 63 insertions(+) diff --git a/packages/lexical-playground/__tests__/e2e/CodeBlock.spec.mjs b/packages/lexical-playground/__tests__/e2e/CodeBlock.spec.mjs index 1fa8f5084a3..3297e42f191 100644 --- a/packages/lexical-playground/__tests__/e2e/CodeBlock.spec.mjs +++ b/packages/lexical-playground/__tests__/e2e/CodeBlock.spec.mjs @@ -980,6 +980,64 @@ test.describe('CodeBlock', () => { `; + const EXPECTED_HTML_GOOGLE_SPREADSHEET = html` + + + + + + + + + + + +
+

+ + Surface + +

+
+

+ + MWP_WORK_LS_COMPOSER + +

+
+

+ + 77349 + +

+
+

+ Lexical +

+
+

+ XDS_RICH_TEXT_AREA +

+
+ sdvd sdfvsfs +
+ `; const CODE_PASTING_TESTS = [ { expectedHTML: EXPECTED_HTML, @@ -1052,6 +1110,11 @@ test.describe('CodeBlock', () => { // semantically it should be wrapped in a pre pastedHTML: `1
2
`, }, + { + expectedHTML: EXPECTED_HTML_GOOGLE_SPREADSHEET, + name: 'Google Spreadsheet', + pastedHTML: `
SurfaceMWP_WORK_LS_COMPOSER77349
LexicalXDS_RICH_TEXT_AREAsdvd sdfvsfs
`, + }, ]; CODE_PASTING_TESTS.forEach((testCase, i) => {