diff --git a/blots/scroll.ts b/blots/scroll.ts index d3583b1802..69df3a66fd 100644 --- a/blots/scroll.ts +++ b/blots/scroll.ts @@ -192,8 +192,10 @@ class Scroll extends ScrollBlot { renderBlocks.forEach(renderBlock => { if (renderBlock.type === 'block') { - const block = this.createBlock(renderBlock.attributes); - this.insertBefore(block, refBlot || undefined); + const block = this.createBlock( + renderBlock.attributes, + refBlot || undefined, + ); insertInlineContents(block, 0, renderBlock.delta); } else { const blockEmbed = this.create( @@ -382,7 +384,7 @@ class Scroll extends ScrollBlot { return renderBlocks; } - private createBlock(attributes: AttributeMap) { + private createBlock(attributes: AttributeMap, refBlot?: Blot) { let blotName: string | undefined; const formats: AttributeMap = {}; @@ -400,6 +402,8 @@ class Scroll extends ScrollBlot { blotName ? attributes[blotName] : undefined, ) as ParentBlot; + this.insertBefore(block, refBlot || undefined); + const length = block.length(); Object.entries(formats).forEach(([key, value]) => { block.formatAt(0, length, key, value); diff --git a/test/unit/core/editor.js b/test/unit/core/editor.js index c82a004335..7117fc7fed 100644 --- a/test/unit/core/editor.js +++ b/test/unit/core/editor.js @@ -1,6 +1,12 @@ import Delta from 'quill-delta'; import Editor from '../../../core/editor'; +import Block from '../../../blots/block'; import Selection, { Range } from '../../../core/selection'; +import Scroll from '../../../blots/scroll'; +import { Registry } from 'parchment'; +import Text from '../../../blots/text'; +import Emitter from '../../../core/emitter'; +import Break from '../../../blots/break'; describe('Editor', function () { describe('insert', function () { @@ -843,6 +849,37 @@ describe('Editor', function () { ]); }); + it('insert before formatting', function () { + class MyBlot extends Block { + static className = 'my-blot'; + static blotName = 'my-blot'; + + formatAt(index, length, name, value) { + super.formatAt(index, length, name, value); + if (name === 'test-style' && !!this.prev) { + this.domNode.setAttribute('test-style', value); + } + } + } + + const registry = new Registry(); + registry.register(MyBlot, Block, Break, Text); + const editor = new Editor( + new Scroll(registry, document.createElement('div'), { + emitter: new Emitter(), + }), + ); + + editor.insertContents( + 0, + new Delta() + .insert('\n') + .insert('hi') + .insert('\n', { 'my-blot': true, 'test-style': 'random' }), + ); + expect(editor.scroll.domNode.innerHTML).toContain('test-style="random"'); + }); + describe('prepend to block embed', function () { it('without ending with \\n', function () { const editor = this.initialize(Editor, `${video}`);