diff --git a/CHANGELOG.md b/CHANGELOG.md index 1a1ffbc790..2553a39e17 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,7 @@ # [Unreleased] +- **Clipboard** Convert newlines between inline elements to a space. + # 2.0.0-beta.2 - Fix IME not working correctly in Safari. diff --git a/packages/quill/src/modules/clipboard.ts b/packages/quill/src/modules/clipboard.ts index 8776716560..50af925a4f 100644 --- a/packages/quill/src/modules/clipboard.ts +++ b/packages/quill/src/modules/clipboard.ts @@ -330,6 +330,15 @@ function isLine(node: Element) { ].includes(node.tagName.toLowerCase()); } +function isBetweenInlineElements(node: HTMLElement) { + return ( + node.previousElementSibling && + node.nextElementSibling && + !isLine(node.previousElementSibling) && + !isLine(node.nextElementSibling) + ); +} + const preNodes = new WeakMap(); function isPre(node: Node | null) { if (node == null) return false; @@ -573,7 +582,11 @@ function matchText(node: HTMLElement, delta: Delta) { return delta.insert(text.trim()); } if (!isPre(node)) { - if (text.trim().length === 0 && text.includes('\n')) { + if ( + text.trim().length === 0 && + text.includes('\n') && + !isBetweenInlineElements(node) + ) { return delta; } const replacer = (collapse: unknown, match: string) => { diff --git a/packages/quill/test/unit/modules/clipboard.spec.ts b/packages/quill/test/unit/modules/clipboard.spec.ts index f0e93bb224..5044d674bd 100644 --- a/packages/quill/test/unit/modules/clipboard.spec.ts +++ b/packages/quill/test/unit/modules/clipboard.spec.ts @@ -229,6 +229,30 @@ describe('Clipboard', () => { ); }); + test('newlines between inline elements', () => { + const html = 'foo\nbar'; + const delta = createClipboard().convert({ html }); + expect(delta).toEqual(new Delta().insert('foo bar')); + }); + + test('multiple newlines between inline elements', () => { + const html = 'foo\n\n\n\nbar'; + const delta = createClipboard().convert({ html }); + expect(delta).toEqual(new Delta().insert('foo bar')); + }); + + test('newlines between block elements', () => { + const html = '
foo
\nbar
'; + const delta = createClipboard().convert({ html }); + expect(delta).toEqual(new Delta().insert('foo\nbar')); + }); + + test('multiple newlines between block elements', () => { + const html = 'foo
\n\n\n\nbar
'; + const delta = createClipboard().convert({ html }); + expect(delta).toEqual(new Delta().insert('foo\nbar')); + }); + test('break', () => { const html = '