Skip to content

Commit

Permalink
fix: copy-paste markdown/raw text inconsistencies (#5487)
Browse files Browse the repository at this point in the history
* fix: traverse through nodes in order to determine the correct copy-paste behavior

---------

Signed-off-by: Elizabeth Danzberger <[email protected]>
Signed-off-by: Max <[email protected]>
Co-authored-by: Max <[email protected]>
  • Loading branch information
2 people authored and backportbot[bot] committed Apr 10, 2024
1 parent 829d299 commit 0a611db
Show file tree
Hide file tree
Showing 2 changed files with 47 additions and 1 deletion.
12 changes: 11 additions & 1 deletion src/extensions/Markdown.js
Original file line number Diff line number Diff line change
Expand Up @@ -108,7 +108,17 @@ const Markdown = Extension.create({
return parser.parseSlice(dom, { preserveWhitespace: true, context: $context })
},
clipboardTextSerializer: (slice) => {
return createMarkdownSerializer(this.editor.schema).serialize(slice.content)
const traverseNodes = (slice) => {
if (slice.content.childCount > 1) {
return createMarkdownSerializer(this.editor.schema).serialize(slice.content)
} else if (slice.isLeaf) {
return slice.textContent
} else {
return traverseNodes(slice.content.firstChild)
}
}

return traverseNodes(slice)
},
transformPastedHTML,
},
Expand Down
36 changes: 36 additions & 0 deletions src/tests/extensions/Markdown.spec.js
Original file line number Diff line number Diff line change
@@ -1,12 +1,15 @@
import { Markdown } from './../../extensions/index.js'
import { createMarkdownSerializer } from './../../extensions/Markdown.js'
import CodeBlock from '@tiptap/extension-code-block'
import Blockquote from '@tiptap/extension-blockquote'
import Image from './../../nodes/Image.js'
import ImageInline from './../../nodes/ImageInline.js'
import TaskList from './../../nodes/TaskList.js'
import TaskItem from './../../nodes/TaskItem.js'
import Underline from './../../marks/Underline.js'
import TiptapImage from '@tiptap/extension-image'
import { getExtensionField } from '@tiptap/core'
import { __serializeForClipboard as serializeForClipboard } from '@tiptap/pm/view'
import { createCustomEditor } from '../helpers.js'

describe('Markdown extension unit', () => {
Expand Down Expand Up @@ -77,4 +80,37 @@ describe('Markdown extension integrated in the editor', () => {
expect(serializer.serialize(editor.state.doc)).toBe('inline image ![Hello](test) inside text')
})

it('copies task lists to plaintext like markdown', () => {
const editor = createCustomEditor({
content: '<p><ul class="contains-task-list"><li><input type="checkbox">Hello</li></ul></p>',
extensions: [Markdown, TaskList, TaskItem],
})
editor.commands.selectAll()
const slice = editor.state.selection.content()
const { text } = serializeForClipboard(editor.view, slice)
expect(text).toBe('\n- [ ] Hello')
})

it('copies code block content to plaintext according to their spec', () => {
const editor = createCustomEditor({
content: '<pre><code>Hello</code></pre>',
extensions: [Markdown, CodeBlock],
})
editor.commands.selectAll()
const slice = editor.state.selection.content()
const { text } = serializeForClipboard(editor.view, slice)
expect(text).toBe('Hello')
})

it('copies nested task list nodes to markdown like syntax', () => {
const editor = createCustomEditor({
content: '<blockquote><p><ul class="contains-task-list"><li><input type="checkbox">Hello</li></ul></blockquote>',
extensions: [Markdown, Blockquote, TaskList, TaskItem],
})
editor.commands.selectAll()
const slice = editor.state.selection.content()
const { text } = serializeForClipboard(editor.view, slice)
expect(text).toBe('\n- [ ] Hello')
})

})

0 comments on commit 0a611db

Please sign in to comment.