diff --git a/editor/components/rich-text/index.js b/editor/components/rich-text/index.js index 6f4054c760c34..5d43e8be510ca 100644 --- a/editor/components/rich-text/index.js +++ b/editor/components/rich-text/index.js @@ -580,25 +580,13 @@ export class RichText extends Component { const rootNode = this.editor.getBody(); - // In case split occurs at the trailing or leading edge of the field, - // shortcut with assumption that the before/after values respectively - // reflect the current value. This also provides an opportunity for the - // parent component to determine whether the before/after value has - // changed using a trivial strict equality operation. - if ( isHorizontalEdge( rootNode ) ) { - onSplit( this.props.value, [], ...blocks ); - return; - } else if ( isHorizontalEdge( rootNode, true ) ) { - onSplit( [], this.props.value, ...blocks ); - return; - } - - const { dom } = this.editor; - const beforeRange = dom.createRng(); - const afterRange = dom.createRng(); - const selectionRange = this.editor.selection.getRng(); - + let before, after; if ( rootNode.childNodes.length ) { + const { dom } = this.editor; + const beforeRange = dom.createRng(); + const afterRange = dom.createRng(); + const selectionRange = this.editor.selection.getRng(); + beforeRange.setStart( rootNode, 0 ); beforeRange.setEnd( selectionRange.startContainer, selectionRange.startOffset ); @@ -609,20 +597,32 @@ export class RichText extends Component { const afterFragment = afterRange.extractContents(); const { format } = this.props; - let before = domToFormat( filterEmptyNodes( beforeFragment.childNodes ), format, this.editor ); - let after = domToFormat( filterEmptyNodes( afterFragment.childNodes ), format, this.editor ); + before = domToFormat( filterEmptyNodes( beforeFragment.childNodes ), format, this.editor ); + after = domToFormat( filterEmptyNodes( afterFragment.childNodes ), format, this.editor ); + } else { + before = []; + after = []; + } - if ( context.paste ) { - before = this.isEmpty( before ) ? null : before; - after = this.isEmpty( after ) ? null : after; - } + // In case split occurs at the trailing or leading edge of the field, + // assume that the before/after values respectively reflect the current + // value. This also provides an opportunity for the parent component to + // determine whether the before/after value has changed using a trivial + // strict equality operation. + if ( this.isEmpty( after ) ) { + before = this.props.value; + } else if ( this.isEmpty( before ) ) { + after = this.props.value; + } - this.restoreContentAndSplit( before, after, blocks ); - } else if ( context.paste ) { - this.restoreContentAndSplit( null, null, blocks ); - } else { - this.restoreContentAndSplit( [], [], blocks ); + // If pasting and the split would result in no content other than the + // pasted blocks, remove the before and after blocks. + if ( context.paste ) { + before = this.isEmpty( before ) ? null : before; + after = this.isEmpty( after ) ? null : after; } + + this.restoreContentAndSplit( before, after, blocks ); } onNewBlock() {