diff --git a/resources/js/wysiwyg/lexical/html/__tests__/unit/LexicalHtml.test.ts b/resources/js/wysiwyg/lexical/html/__tests__/unit/LexicalHtml.test.ts index e5064121a..b466ee34a 100644 --- a/resources/js/wysiwyg/lexical/html/__tests__/unit/LexicalHtml.test.ts +++ b/resources/js/wysiwyg/lexical/html/__tests__/unit/LexicalHtml.test.ts @@ -146,7 +146,7 @@ describe('HTML', () => { }); expect(html).toBe( - '
Hello
World
', + 'Hello
\nWorld
', ); }); diff --git a/resources/js/wysiwyg/lexical/html/index.ts b/resources/js/wysiwyg/lexical/html/index.ts index 5018e10b4..de5e53bb8 100644 --- a/resources/js/wysiwyg/lexical/html/index.ts +++ b/resources/js/wysiwyg/lexical/html/index.ts @@ -85,7 +85,18 @@ export function $generateHtmlFromNodes( $appendNodesToHTML(editor, topLevelNode, container, selection); } - return container.innerHTML; + const nodeCode = []; + for (const node of container.childNodes) { + if ("outerHTML" in node) { + nodeCode.push(node.outerHTML) + } else { + const wrap = document.createElement('div'); + wrap.appendChild(node.cloneNode(true)); + nodeCode.push(wrap.innerHTML); + } + } + + return nodeCode.join('\n'); } function $appendNodesToHTML( diff --git a/resources/js/wysiwyg/lexical/utils/__tests__/unit/LexicalUtilsSplitNode.test.ts b/resources/js/wysiwyg/lexical/utils/__tests__/unit/LexicalUtilsSplitNode.test.ts index 54cd8b54f..6a415d008 100644 --- a/resources/js/wysiwyg/lexical/utils/__tests__/unit/LexicalUtilsSplitNode.test.ts +++ b/resources/js/wysiwyg/lexical/utils/__tests__/unit/LexicalUtilsSplitNode.test.ts @@ -38,7 +38,7 @@ describe('LexicalUtils#splitNode', () => { { _: 'split paragraph in between two text nodes', expectedHtml: - 'Hello
world
', + 'Hello
\nworld
', initialHtml: 'Helloworld
', splitOffset: 1, splitPath: [0], @@ -46,7 +46,7 @@ describe('LexicalUtils#splitNode', () => { { _: 'split paragraph before the first text node', expectedHtml: - 'Helloworld
', + 'Helloworld
', initialHtml: 'Helloworld
', splitOffset: 0, splitPath: [0], @@ -54,7 +54,7 @@ describe('LexicalUtils#splitNode', () => { { _: 'split paragraph after the last text node', expectedHtml: - 'Helloworld
Helloworld
\nHelloworld
', splitOffset: 2, // Any offset that is higher than children size splitPath: [0], @@ -62,7 +62,7 @@ describe('LexicalUtils#splitNode', () => { { _: 'split list items between two text nodes', expectedHtml: - 'Hello
world
', + 'Hello
\nworld
', initialHtml: 'Helloworld
', selectionOffset: 5, // Selection on text node after "Hello" world selectionPath: [0, 0], @@ -57,8 +57,8 @@ describe('LexicalUtils#insertNodeToNearestRoot', () => { 'Hello world
' + - 'Hello world
\n' + + 'Hello world
', selectionOffset: 12, // Selection on text node after "Hello" world @@ -92,8 +92,8 @@ describe('LexicalUtils#insertNodeToNearestRoot', () => { { _: 'insert in the beginning of paragraph', expectedHtml: - 'Hello world
', initialHtml: 'Hello world
', selectionOffset: 0, // Selection on text node after "Hello" world @@ -102,9 +102,9 @@ describe('LexicalUtils#insertNodeToNearestRoot', () => { { _: 'insert with selection on root start', expectedHtml: - 'Before
' + + 'Before
\n' + 'After
', initialHtml: 'Before
' + - 'Before
\n' + + 'After
', initialHtml: 'Before
After
', selectionOffset: 1, @@ -126,7 +126,7 @@ describe('LexicalUtils#insertNodeToNearestRoot', () => { { _: 'insert with selection on root end', expectedHtml: - 'Before
' + + 'Before
\n' + 'Before
', selectionOffset: 1, diff --git a/resources/sass/_editor.scss b/resources/sass/_editor.scss index de43540a3..a7f5ab387 100644 --- a/resources/sass/_editor.scss +++ b/resources/sass/_editor.scss @@ -681,6 +681,14 @@ textarea.editor-form-field-input { } } +// Specific field styles +textarea.editor-form-field-input[name="source"] { + width: 1000px; + height: 600px; + max-height: 60vh; + max-width: 80vw; +} + // Editor theme styles .editor-theme-bold { font-weight: bold;