Transform editor content with WrappedRange helpers

This page focuses on the low-level range helpers that still produce clear, visible changes in the editor. The underlying splitText() helper still exists, but on its own it mainly changes text-node boundaries, not the serialized markup.

deleteContents(), insertNode(), pasteHTML()

boldu

HTML output

Ready.

wrapBodyInlineWithPara()

bolditalic

Wrapped output

Ready.

Example configuration - Content Transforms

summernote.create('#range-transform-editor', {
  height: 220,
});

summernote.create('#range-wrap-editor', {
  height: 180,
});

const rangeUtil = summernote.summernote.range;
const rng = rangeUtil.create(textNode, 1, textNode, 3);
rng.deleteContents();
rng.insertNode(document.createElement('span'));
rng.pasteHTML('<span>span</span><i>italic</i>');
rng.wrapBodyInlineWithPara();