diff --git a/.changeset/2026-08-17-fix-blockquote-unset-text-style.md b/.changeset/2026-08-17-fix-blockquote-unset-text-style.md new file mode 100644 index 0000000000..ff86af042b --- /dev/null +++ b/.changeset/2026-08-17-fix-blockquote-unset-text-style.md @@ -0,0 +1,5 @@ +--- +'@tiptap/extension-text-style': patch +--- + +Unsetting one text style inside a blockquote no longer removes the other text styles in it. diff --git a/packages/extension-text-style/__tests__/font-size-commands.spec.ts b/packages/extension-text-style/__tests__/font-size-commands.spec.ts index e4c6b00e97..713401a7f0 100644 --- a/packages/extension-text-style/__tests__/font-size-commands.spec.ts +++ b/packages/extension-text-style/__tests__/font-size-commands.spec.ts @@ -1,8 +1,9 @@ import { Editor } from '@tiptap/core' +import Blockquote from '@tiptap/extension-blockquote' import Document from '@tiptap/extension-document' import Paragraph from '@tiptap/extension-paragraph' import Text from '@tiptap/extension-text' -import { FontSize, TextStyle } from '@tiptap/extension-text-style' +import { Color, FontSize, TextStyle } from '@tiptap/extension-text-style' import { afterEach, beforeEach, describe, expect, it } from 'vitest' describe('FontSize commands', () => { @@ -40,3 +41,43 @@ describe('FontSize commands', () => { expect(editor.getHTML()).not.toContain(' { + let editor: Editor + + const editorWith = (content: string) => { + const element = document.createElement('div') + document.body.appendChild(element) + editor = new Editor({ + element, + extensions: [Document, Paragraph, Text, Blockquote, TextStyle, Color, FontSize], + content, + }) + editor.commands.selectAll() + return editor + } + + afterEach(() => { + editor.destroy() + }) + + it('keeps the other text styles when unsetting inside a blockquote', () => { + editorWith( + '

Example Text

', + ) + + editor.commands.unsetFontSize() + + expect(editor.getHTML()).toContain('color: #ff0000') + expect(editor.getHTML()).not.toContain('font-size') + }) + + it('keeps the other text styles when unsetting inside a paragraph', () => { + editorWith('

Example Text

') + + editor.commands.unsetFontSize() + + expect(editor.getHTML()).toContain('color: #ff0000') + expect(editor.getHTML()).not.toContain('font-size') + }) +}) diff --git a/packages/extension-text-style/src/text-style/index.ts b/packages/extension-text-style/src/text-style/index.ts index ec6334eeb8..2481901588 100644 --- a/packages/extension-text-style/src/text-style/index.ts +++ b/packages/extension-text-style/src/text-style/index.ts @@ -144,9 +144,8 @@ export const TextStyle = Mark.create({ // removes everything from all the nodes // within the selection range. tr.doc.nodesBetween(selection.from, selection.to, (node, pos) => { - // Check if it's a paragraph element, if so, skip this node as we apply - // the text style to inline text nodes only (span). - if (node.isTextblock) { + // Skip non-inline nodes, the text style only applies to spans + if (!node.isInline) { return true }