jodit 4.13.26 → 4.14.0

package/esm/core/global.js

@@ -7,6 +7,7 @@ import { isJoditObject } from "./helpers/checker/is-jodit-object.js";
 import { isString } from "./helpers/checker/is-string.js";
 import { isViewObject } from "./helpers/checker/is-view-object.js";
 import { kebabCase } from "./helpers/string/kebab-case.js";
+import { attr } from "./helpers/utils/attr.js";
 import { css } from "./helpers/utils/css.js";
 import { getClassName } from "./helpers/utils/get-class-name.js";
 import { PluginSystem } from "./plugin/plugin-system.js";
@@ -76,10 +77,10 @@ export function getContainer(jodit, classFunc, tag = 'div', createInsideEditor =
         });
         // Let a strict CSP accept the injected <style>/<script> box
         if (view.o.nonce && (tag === 'style' || tag === 'script')) {
-            box.setAttribute('nonce', view.o.nonce);
+            attr(box, 'nonce', view.o.nonce);
         }
         box.classList.add(`jodit_theme_${view.o.theme || 'default'}`);
-        body.appendChild(box);
+        Dom.append(body, box);
         data[key] = box;
         jodit.hookStatus('beforeDestruct', () => {
             view.events.off(box);

package/esm/core/helpers/html/apply-styles.js

@@ -9,6 +9,8 @@
 import { globalDocument, IS_PROD } from "../../constants.js";
 import { Dom } from "../../dom/dom.js";
 import { trim } from "../string/trim.js";
+import { attr } from "../utils/attr.js";
+import { css } from "../utils/css.js";
 import { $$ } from "../utils/selector.js";
 function normalizeCSS(s) {
     return s
@@ -48,8 +50,8 @@ export function applyStyles(html) {
         html = html.substring(0, closeIndex + '</html>'.length);
     }
     const iframe = globalDocument.createElement('iframe');
-    iframe.style.display = 'none';
-    globalDocument.body.appendChild(iframe);
+    css(iframe, 'display', 'none');
+    Dom.append(globalDocument.body, iframe);
     let convertedString = '', collection = [];
     try {
         const iframeDoc = iframe.contentDocument ||
@@ -65,7 +67,7 @@ export function applyStyles(html) {
             // style normalization strips the `mso-list` hint. See #948
             Dom.each(iframeDoc.body, (node) => {
                 if (Dom.isElement(node) &&
-                    /mso-list:\s*ignore/i.test(node.getAttribute('style') || '')) {
+                    /mso-list:\s*ignore/i.test(attr(node, 'style') || '')) {
                     Dom.safeRemove(node);
                 }
             });
@@ -77,6 +79,9 @@ export function applyStyles(html) {
                             continue;
                         }
                         collection = $$(rules[idx].selectorText, iframeDoc.body);
+                        // `style.cssText` on purpose: the CSSOM parses the text,
+                        // drops invalid declarations and re-serializes it. The raw
+                        // `style` attribute would keep Word-only junk verbatim
                         collection.forEach((elm) => {
                             elm.style.cssText = normalizeCSS(rules[idx].style.cssText +
                                 ';' +
@@ -92,14 +97,13 @@ export function applyStyles(html) {
             }
             Dom.each(iframeDoc.body, node => {
                 if (Dom.isElement(node)) {
-                    const elm = node;
-                    const css = elm.getAttribute('style');
-                    if (css) {
-                        elm.style.cssText = normalizeCSS(css);
+                    const cssText = attr(node, 'style');
+                    if (cssText) {
+                        node.style.cssText =
+                            normalizeCSS(cssText);
                     }
-                    if (elm.hasAttribute('style') &&
-                        !elm.getAttribute('style')) {
-                        elm.removeAttribute('style');
+                    if (!attr(node, 'style')) {
+                        attr(node, 'style', null);
                     }
                 }
             });

package/esm/core/helpers/html/clean-from-word.js

@@ -10,6 +10,7 @@ import { globalDocument } from "../../constants.js";
 import { Dom } from "../../dom/dom.js";
 import { toArray } from "../array/to-array.js";
 import { trim } from "../string/trim.js";
+import { attr, attrRaw } from "../utils/attr.js";
 /**
  * The method automatically cleans up content from Microsoft Word and other HTML sources to ensure clean, compliant
  * content that matches the look and feel of the site.
@@ -48,18 +49,21 @@ export function cleanFromWord(html) {
                                 // with `mso-list:Ignore`. They are display-only
                                 // and must not be imported, otherwise the marker
                                 // text leaks into the content. See #948
-                                if (/mso-list:\s*ignore/i.test(node.getAttribute('style') || '')) {
+                                if (/mso-list:\s*ignore/i.test(attr(node, 'style') || '')) {
                                     marks.push(node);
                                     break;
                                 }
-                                toArray(node.attributes).forEach((attr) => {
+                                toArray(node.attributes).forEach((attribute) => {
                                     if ([
                                         'src',
                                         'href',
                                         'rel',
                                         'content'
-                                    ].indexOf(attr.name.toLowerCase()) === -1) {
-                                        node.removeAttribute(attr.name);
+                                    ].indexOf(attribute.name.toLowerCase()) === -1) {
+                                        // `attrRaw`: SVG keeps camelCase names
+                                        // (`viewBox`), `attr()` would kebab-case
+                                        // them and silently skip the removal
+                                        attrRaw(node, attribute.name, null);
                                     }
                                 });
                         }

package/esm/core/helpers/html/safe-html.js

@@ -3,11 +3,9 @@
  * Released under MIT see LICENSE.txt in the project root for license information.
  * Copyright (c) 2013-2026 Valerii Chupurnov. All rights reserved. https://xdsoft.net
  */
-/**
- * @module helpers/html
- */
 import { Dom } from "../../dom/dom.js";
 import { attr } from "../utils/index.js";
+import { attrRaw } from "../utils/attr.js";
 const HTML_NAMESPACE = 'http://www.w3.org/1999/xhtml';
 /**
  * Integration points where HTML is legitimately allowed inside MathML/SVG foreign content.
@@ -23,9 +21,10 @@ const HTML_INTEGRATION_POINTS = new Set([
  * HTML (e.g. `mglyph` / `style` under `<math>`) that a reparse can hoist into a live node. Legitimate
  * MathML/SVG children and HTML below an integration point are kept.
  */
+const isMathOrSvg = (node) => Boolean(node && /^(math|svg)$/i.test(node.nodeName));
 function isSmuggledForeignHtml(elm) {
     if (elm.namespaceURI !== HTML_NAMESPACE ||
-        elm.closest('math,svg') == null) {
+        Dom.up(elm, isMathOrSvg) == null) {
         return false;
     }
     for (let parent = elm.parentElement; parent; parent = parent.parentElement) {
@@ -48,11 +47,17 @@ export function safeHTML(box, options) {
         return;
     }
     // Drop HTML smuggled into MathML/SVG before the walk: a reparse would otherwise hoist its hidden
-    // markup into a live node.
-    const foreign = box.querySelectorAll('math *, svg *');
-    for (let i = 0; i < foreign.length; i++) {
-        if (box.contains(foreign[i]) && isSmuggledForeignHtml(foreign[i])) {
-            Dom.safeRemove(foreign[i]);
+    // markup into a live node. Collect the candidates first (like the static
+    // `querySelectorAll` snapshot did) so removals don't affect the traversal.
+    const foreign = [];
+    Dom.each(box, node => {
+        if (Dom.isElement(node) && Dom.up(node.parentNode, isMathOrSvg)) {
+            foreign.push(node);
+        }
+    });
+    for (const elm of foreign) {
+        if (Dom.isOrContains(box, elm) && isSmuggledForeignHtml(elm)) {
+            Dom.safeRemove(elm);
         }
     }
     const removeEvents = (_a = options.removeEventAttributes) !== null && _a !== void 0 ? _a : options.removeOnError;
@@ -70,8 +75,8 @@ export function safeHTML(box, options) {
         sanitizeHTMLElement(node, options);
         if (options.safeLinksTarget &&
             node.nodeName === 'A' &&
-            node.getAttribute('target') === '_blank') {
-            const rel = node.getAttribute('rel') || '';
+            attr(node, 'target') === '_blank') {
+            const rel = attr(node, 'rel') || '';
             const parts = rel.split(/\s+/).filter(Boolean);
             if (!parts.includes('noopener')) {
                 parts.push('noopener');
@@ -100,7 +105,9 @@ function removeAllEventAttributes(elm) {
         }
     }
     for (const name of toRemove) {
-        elm.removeAttribute(name);
+        // `attrRaw` on purpose: `attr()` kebab-cases the key
+        // (`onLoad` → `on-load`), which must not happen in a sanitizer
+        attrRaw(elm, name, null);
         effected = true;
     }
     return effected;
@@ -151,7 +158,7 @@ export function sanitizeHTMLElement(elm, { safeJavaScriptLink, removeOnError } =
         effected = true;
     }
     const tagName = elm.nodeName.toLowerCase();
-    const href = elm.getAttribute('href');
+    const href = attr(elm, 'href');
     // Neutralize executable-scheme `href`s with the same normalization used for
     // every other URL attribute (`isDangerousUrl`), which strips control bytes,
     // tabs and newlines and lowercases before matching the scheme. The previous
@@ -171,8 +178,10 @@ export function sanitizeHTMLElement(elm, { safeJavaScriptLink, removeOnError } =
             effected = true;
         }
         // Strip executable schemes from any other URL-bearing attribute.
+        // `attrRaw`: the list contains `xlink:href` and the sanitizer must
+        // read exactly the attribute it will remove.
         for (const name of URL_ATTRIBUTES) {
-            const value = elm.getAttribute(name);
+            const value = attrRaw(elm, name);
             if (value && isDangerousUrl(value, tagName)) {
                 attr(elm, name, null);
                 effected = true;

package/esm/core/helpers/html/strip-tags.js

@@ -6,7 +6,6 @@
 import { Dom } from "../../dom/dom.js";
 import { isString } from "../checker/is-string.js";
 import { trim } from "../string/trim.js";
-import { $$ } from "../utils/index.js";
 const NEW_LINE_TAGS = new Set([
     'div',
     'p',
@@ -30,9 +29,15 @@ export function stripTags(html, doc = document, exclude = null, blockBr = false)
         tmp.innerHTML = html;
     }
     else {
-        tmp.appendChild(html);
+        Dom.append(tmp, html);
     }
-    $$('*', tmp).forEach(p => {
+    // Snapshot of all elements (like `querySelectorAll('*')` did) — the loop
+    // below removes and unwraps nodes while iterating
+    const all = [];
+    Dom.each(tmp, node => {
+        Dom.isElement(node) && all.push(node);
+    });
+    all.forEach(p => {
         const pr = p.parentNode;
         if (!pr) {
             return;
@@ -62,7 +67,7 @@ export function stripTags(html, doc = document, exclude = null, blockBr = false)
             // plain text). When `blockBr` is set, separate them with a line
             // break instead, so paragraph structure survives — e.g. the
             // "Insert only Text" paste option. See #1232
-            pr.insertBefore(doc.createTextNode(blockBr ? '%%%jodit-single-br%%%' : ' '), nx);
+            Dom.before(nx, doc.createTextNode(blockBr ? '%%%jodit-single-br%%%' : ' '));
         }
     });
     return restoreTags(trim(tmp.innerText));

package/esm/core/helpers/utils/align.d.ts

@@ -15,7 +15,4 @@ export declare function hAlignElement(image: HTMLElement, align: ImageHAlign): v
  * Remove text-align style for all selected children
  */
 export declare function clearAlign(node: Node): void;
-/**
- * Apply align for element
- */
 export declare function alignElement(command: string, box: HTMLElement): void;

package/esm/core/helpers/utils/align.js

@@ -4,7 +4,8 @@
  * Copyright (c) 2013-2026 Valerii Chupurnov. All rights reserved. https://xdsoft.net
  */
 import { Dom } from "../../dom/index.js";
-import { clearCenterAlign, css } from "./css.js";
+import { attr } from "./attr.js";
+import { clearCenterAlign, css, cssInline } from "./css.js";
 /**
  * Align image
  */
@@ -37,10 +38,10 @@ export function hAlignElement(image, align) {
 export function clearAlign(node) {
     Dom.each(node, elm => {
         if (Dom.isHTMLElement(elm)) {
-            if (elm.style.textAlign) {
-                elm.style.textAlign = '';
-                if (!elm.style.cssText.trim().length) {
-                    elm.removeAttribute('style');
+            if (cssInline(elm, 'textAlign')) {
+                css(elm, 'textAlign', '');
+                if (!(attr(elm, 'style') || '').trim().length) {
+                    attr(elm, 'style', null);
                 }
             }
         }
@@ -49,22 +50,18 @@ export function clearAlign(node) {
 /**
  * Apply align for element
  */
+const ALIGN_BY_COMMAND = new Map([
+    ['justifyfull', 'justify'],
+    ['justifyright', 'right'],
+    ['justifyleft', 'left'],
+    ['justifycenter', 'center']
+]);
 export function alignElement(command, box) {
     if (Dom.isNode(box) && Dom.isElement(box)) {
         clearAlign(box);
-        switch (command.toLowerCase()) {
-            case 'justifyfull':
-                box.style.textAlign = 'justify';
-                break;
-            case 'justifyright':
-                box.style.textAlign = 'right';
-                break;
-            case 'justifyleft':
-                box.style.textAlign = 'left';
-                break;
-            case 'justifycenter':
-                box.style.textAlign = 'center';
-                break;
+        const align = ALIGN_BY_COMMAND.get(command.toLowerCase());
+        if (align) {
+            css(box, 'textAlign', align);
         }
     }
 }

package/esm/core/helpers/utils/append-script.js

@@ -3,7 +3,9 @@
  * Released under MIT see LICENSE.txt in the project root for license information.
  * Copyright (c) 2013-2026 Valerii Chupurnov. All rights reserved. https://xdsoft.net
  */
+import { Dom } from "../../dom/dom.js";
 import { isString } from "../checker/is-string.js";
+import { attr } from "./attr.js";
 import { completeUrl } from "./complete-url.js";
 export const alreadyLoadedList = new Map();
 const cacheLoaders = (loader) => {
@@ -32,10 +34,10 @@ export const appendScriptAsync = cacheLoaders((jodit, url) => {
             src: completeUrl(url)
         });
         if (jodit.o.nonce) {
-            script.setAttribute('nonce', jodit.o.nonce);
+            attr(script, 'nonce', jodit.o.nonce);
         }
         jodit.e.one(script, 'error', reject).one(script, 'load', resolve);
-        jodit.od.body.appendChild(script);
+        Dom.append(jodit.od.body, script);
     });
 });
 /**
@@ -46,22 +48,23 @@ export const appendStyleAsync = cacheLoaders((jodit, url) => {
         if (jodit.isInDestruct) {
             return reject();
         }
-        const link = jodit.c.element('link');
-        link.rel = 'stylesheet';
-        link.media = 'all';
-        link.crossOrigin = 'anonymous';
+        const link = jodit.c.element('link', {
+            rel: 'stylesheet',
+            media: 'all',
+            crossorigin: 'anonymous'
+        });
         if (jodit.o.nonce) {
-            link.setAttribute('nonce', jodit.o.nonce);
+            attr(link, 'nonce', jodit.o.nonce);
         }
         const callback = () => resolve(link);
         !jodit.isInDestruct &&
             jodit.e.on(link, 'load', callback).on(link, 'error', reject);
-        link.href = completeUrl(url);
+        attr(link, 'href', completeUrl(url));
         if (jodit.o.shadowRoot) {
-            jodit.o.shadowRoot.appendChild(link);
+            Dom.append(jodit.o.shadowRoot, link);
         }
         else {
-            jodit.od.body.appendChild(link);
+            Dom.append(jodit.od.body, link);
         }
     });
 });

package/esm/core/helpers/utils/attr.d.ts

@@ -6,7 +6,7 @@
 /**
  * @module helpers/utils
  */
-import type { IDictionary } from "../../../types/index";
+import type { IDictionary, VElement } from "../../../types/index";
 /**
  * Get attribute
  */
@@ -23,3 +23,5 @@ export declare function attr(elm: Element, key: string, value: string | number |
  * Set or remove several attributes
  */
 export declare function attr(elm: Element, attributes: IDictionary<string | number | boolean | null>): null;
+export declare function attrRaw(elm: VElement, name: string): null | string;
+export declare function attrRaw(elm: VElement, name: string, value: string | null): void;

package/esm/core/helpers/utils/attr.js

@@ -56,3 +56,21 @@ export function attr(elm, keyOrAttributes, value) {
     }
     return elm.getAttribute(key);
 }
+/**
+ * Exact-name attribute access: no camelCase → kebab-case conversion, no
+ * `data-` fallback and no `px` stripping. Use it where the attribute name must
+ * be taken verbatim — sanitizers and attribute comparison (`onLoad`, `viewBox`,
+ * `xlink:href`). `null` removes the attribute.
+ */
+export function attrRaw(elm, name, value) {
+    if (value === undefined) {
+        return elm.getAttribute(name);
+    }
+    if (value == null) {
+        if (elm.hasAttribute(name)) {
+            elm.removeAttribute(name);
+        }
+        return;
+    }
+    elm.setAttribute(name, value);
+}

package/esm/core/helpers/utils/css.d.ts

@@ -6,13 +6,30 @@
 /**
  * @module helpers/utils
  */
-import type { IStyle, StyleValue } from "../../../types/index";
+import type { IStyle, StyleValue, VHTMLElement } from "../../../types/index";
 export declare function css(element: HTMLElement, key: 'left' | 'top' | 'bottom' | 'right' | 'width' | 'min' | 'max' | 'height' | 'margin' | 'padding' | 'fontsize' | 'font-size'): number;
 export declare function css(element: HTMLElement, key: keyof CSSStyleDeclaration): string | number;
 export declare function css(element: HTMLElement, key: string | IStyle): string | number;
 export declare function css(element: HTMLElement, key: string | IStyle, value: StyleValue): string | number;
+/**
+ * @deprecated Use `cssInline(element, key)` for an exact inline read.
+ * The boolean mode still normalizes the value (`'0px'` → `0`, `bold` → `700`).
+ */
 export declare function css(element: HTMLElement, key: string | IStyle, onlyStyleMode: boolean): string | number;
 /**
  * Clear center align
  */
+/**
+ * Read the exact inline value of a CSS property (the `style` attribute).
+ * Unlike `css()` it never touches computed styles (no layout access) and does
+ * not normalize the result, so it is safe for exact string comparisons and
+ * save/restore. Returns an empty string when the property is not set inline.
+ *
+ * @example
+ * ```js
+ * cssInline(elm, 'zIndex'); // '' or '100'
+ * cssInline(elm, 'width'); // '0px' (css(elm, 'width', true) would return 0)
+ * ```
+ */
+export declare function cssInline(element: VHTMLElement, key: string): string;
 export declare const clearCenterAlign: (image: HTMLElement) => void;

package/esm/core/helpers/utils/css.js

@@ -62,6 +62,21 @@ export function css(element, key, value, onlyStyleMode = false) {
 /**
  * Clear center align
  */
+/**
+ * Read the exact inline value of a CSS property (the `style` attribute).
+ * Unlike `css()` it never touches computed styles (no layout access) and does
+ * not normalize the result, so it is safe for exact string comparisons and
+ * save/restore. Returns an empty string when the property is not set inline.
+ *
+ * @example
+ * ```js
+ * cssInline(elm, 'zIndex'); // '' or '100'
+ * cssInline(elm, 'width'); // '0px' (css(elm, 'width', true) would return 0)
+ * ```
+ */
+export function cssInline(element, key) {
+    return element.style.getPropertyValue(kebabCase(key));
+}
 export const clearCenterAlign = (image) => {
     if (css(image, 'display') === 'block') {
         css(image, 'display', '');

package/esm/core/helpers/utils/print.js

@@ -7,32 +7,35 @@ import { Dom } from "../../dom/dom.js";
 import { isString } from "../checker/is-string.js";
 import { attr } from "./attr.js";
 import { css } from "./css.js";
-import { $$ } from "./selector.js";
 /**
  * Fixes image sizes and sets absolute paths to images
  */
 function fixedAssetsSizeAndAbsoluteLinks(editor, points) {
     const restoreAttributes = [];
+    const images = [];
+    Dom.each(editor.editor, node => {
+        Dom.isTag(node, 'img') && images.push(node);
+    });
     try {
-        $$('img', editor.editor).forEach(item => {
+        images.forEach(item => {
             const previousAttrs = [
                 attr(item, 'width'),
                 attr(item, 'height'),
-                item.src
+                attr(item, 'src')
             ];
             attr(item, {
                 width: item.offsetWidth + points,
                 height: item.offsetHeight + points
             });
             const a = editor.createInside.a();
-            editor.ed.body.appendChild(a);
-            a.href = item.src;
-            item.src = a.href;
+            Dom.append(editor.ed.body, a);
+            attr(a, 'href', attr(item, 'src') || '');
+            // reading the `href` property resolves the URL to an absolute one
+            attr(item, 'src', a.href);
             Dom.safeRemove(a);
             restoreAttributes.push(() => {
-                var _a;
-                item.src = (_a = previousAttrs[2]) !== null && _a !== void 0 ? _a : '';
                 attr(item, {
+                    src: previousAttrs[2],
                     width: previousAttrs[0] || null,
                     height: previousAttrs[1] || null
                 });
@@ -62,7 +65,7 @@ export function previewBox(editor, defaultValue, points = 'px', container = null
         }
         let div = editor.c.div('jodit__preview-box jodit-context');
         if (container) {
-            container.appendChild(div);
+            Dom.append(container, div);
         }
         css(div, {
             position: 'relative',
@@ -77,7 +80,7 @@ export function previewBox(editor, defaultValue, points = 'px', container = null
                 minHeight: 600,
                 border: 0
             });
-            div.appendChild(iframe);
+            Dom.append(div, iframe);
             const myWindow = iframe.contentWindow;
             if (myWindow) {
                 editor.e.fire('generateDocumentStructure.iframe', myWindow.document, editor);
@@ -87,7 +90,7 @@ export function previewBox(editor, defaultValue, points = 'px', container = null
                     const elm = myWindow.document.body;
                     const resizeObserver = new ResizeObserver(editor.async.debounce(() => {
                         resizeObserver.unobserve(elm);
-                        iframe.style.height = `${elm.offsetHeight + 20}px`;
+                        css(iframe, 'height', elm.offsetHeight + 20);
                         editor.async.requestAnimationFrame(() => {
                             !destructed && resizeObserver.observe(elm);
                         });
@@ -120,7 +123,7 @@ export function previewBox(editor, defaultValue, points = 'px', container = null
                 if (Dom.isElement(c)) {
                     const newNode = box.ownerDocument.createElement(c.nodeName);
                     for (let j = 0; j < c.attributes.length; j += 1) {
-                        attr(newNode, c.attributes[j].nodeName, c.attributes[j].nodeValue);
+                        attr(newNode, c.attributes[j].name, c.attributes[j].value);
                     }
                     if (c.childNodes.length === 0 || Dom.isTag(c, 'table')) {
                         switch (c.nodeName) {
@@ -140,13 +143,13 @@ export function previewBox(editor, defaultValue, points = 'px', container = null
                         setHTML(newNode, c);
                     }
                     try {
-                        box.appendChild(newNode);
+                        Dom.append(box, newNode);
                     }
                     catch (_a) { }
                 }
                 else {
                     try {
-                        box.appendChild(c.cloneNode(true));
+                        Dom.append(box, c.cloneNode(true));
                     }
                     catch (_b) { }
                 }

package/esm/core/helpers/utils/reset.js

@@ -18,6 +18,9 @@ const map = {};
 export function reset(key) {
     var _a, _b;
     if (!(key in map)) {
+        // Raw DOM API on purpose: this bootstrap helper is imported by
+        // `to-array`, which the `Dom` module itself depends on — importing
+        // `Dom` here would create a circular dependency
         const iframe = globalDocument.createElement('iframe');
         try {
             iframe.src = 'about:blank';

package/esm/core/helpers/utils/selector.js

@@ -66,14 +66,18 @@ export const refs = (root) => {
     if ('container' in root) {
         root = root.container;
     }
-    return $$('[ref],[data-ref]', root).reduce((def, child) => {
-        const key = attr(child, '-ref');
-        if (key && isString(key)) {
-            def[camelCase(key)] = child;
-            def[key] = child;
+    const def = {};
+    Dom.each(root, child => {
+        if (Dom.isElement(child) &&
+            (child.hasAttribute('ref') || child.hasAttribute('data-ref'))) {
+            const key = attr(child, '-ref');
+            if (key && isString(key)) {
+                def[camelCase(key)] = child;
+                def[key] = child;
+            }
         }
-        return def;
-    }, {});
+    });
+    return def;
 };
 /**
  * Calculate full CSS selector

package/esm/core/selection/helpers/move-node-inside-start.js

@@ -17,7 +17,7 @@ export function moveNodeInsideStart(j, node, start) {
         Dom.isContentEditable(sibling, j.editor) &&
         (!anotherSibling || !Dom.closest(node, Dom.isElement, j.editor))) {
         if (start || !sibling.firstChild) {
-            sibling.appendChild(node);
+            Dom.append(sibling, node);
         }
         else {
             Dom.before(sibling.firstChild, node);