@ckeditor/ckeditor5-engine 38.2.0-alpha.0 → 38.2.0-alpha.1

package/src/view/domconverter.js

@@ -6,16 +6,16 @@
  * @module engine/view/domconverter
  */
 /* globals Node, NodeFilter, DOMParser, Text */
-import ViewText from './text';
-import ViewElement from './element';
-import ViewUIElement from './uielement';
-import ViewPosition from './position';
-import ViewRange from './range';
-import ViewSelection from './selection';
-import ViewDocumentFragment from './documentfragment';
-import ViewTreeWalker from './treewalker';
-import { default as Matcher } from './matcher';
-import { BR_FILLER, INLINE_FILLER_LENGTH, NBSP_FILLER, MARKED_NBSP_FILLER, getDataWithoutFiller, isInlineFiller, startsWithFiller } from './filler';
+import ViewText from './text.js';
+import ViewElement from './element.js';
+import ViewUIElement from './uielement.js';
+import ViewPosition from './position.js';
+import ViewRange from './range.js';
+import ViewSelection from './selection.js';
+import ViewDocumentFragment from './documentfragment.js';
+import ViewTreeWalker from './treewalker.js';
+import { default as Matcher } from './matcher.js';
+import { BR_FILLER, INLINE_FILLER_LENGTH, NBSP_FILLER, MARKED_NBSP_FILLER, getDataWithoutFiller, isInlineFiller, startsWithFiller } from './filler.js';
 import { global, logWarning, indexOf, getAncestors, isText, isComment, isValidAttributeName, first } from '@ckeditor/ckeditor5-utils';
 const BR_FILLER_REF = BR_FILLER(global.document); // eslint-disable-line new-cap
 const NBSP_FILLER_REF = NBSP_FILLER(global.document); // eslint-disable-line new-cap
@@ -67,9 +67,9 @@ export default class DomConverter {
          */
         this._rawContentElementMatcher = new Matcher();
         /**
-         * A set of encountered raw content DOM nodes. It is used for preventing left trimming of the following text node.
+         * Matcher for inline object view elements. This is an extension of a simple {@link #inlineObjectElements} array of element names.
          */
-        this._encounteredRawContentDomNodes = new WeakSet();
+        this._inlineObjectElementMatcher = new Matcher();
         this.document = document;
         this.renderingMode = renderingMode;
         this.blockFillerMode = blockFillerMode || (renderingMode === 'editing' ? 'br' : 'nbsp');
@@ -472,68 +472,22 @@ export default class DomConverter {
      * or the given node is an empty text node.
      */
     domToView(domNode, options = {}) {
-        if (this.isBlockFiller(domNode)) {
+        const inlineNodes = [];
+        const generator = this._domToView(domNode, options, inlineNodes);
+        // Get the first yielded value or a returned value.
+        const node = generator.next().value;
+        if (!node) {
             return null;
         }
-        // When node is inside a UIElement or a RawElement return that parent as it's view representation.
-        const hostElement = this.getHostViewElement(domNode);
-        if (hostElement) {
-            return hostElement;
-        }
-        if (isComment(domNode) && options.skipComments) {
+        // Trigger children handling.
+        generator.next();
+        // Whitespace cleaning.
+        this._processDomInlineNodes(null, inlineNodes, options);
+        // Text not got trimmed to an empty string so there is no result node.
+        if (node.is('$text') && node.data.length == 0) {
             return null;
         }
-        if (isText(domNode)) {
-            if (isInlineFiller(domNode)) {
-                return null;
-            }
-            else {
-                const textData = this._processDataFromDomText(domNode);
-                return textData === '' ? null : new ViewText(this.document, textData);
-            }
-        }
-        else {
-            if (this.mapDomToView(domNode)) {
-                return this.mapDomToView(domNode);
-            }
-            let viewElement;
-            if (this.isDocumentFragment(domNode)) {
-                // Create view document fragment.
-                viewElement = new ViewDocumentFragment(this.document);
-                if (options.bind) {
-                    this.bindDocumentFragments(domNode, viewElement);
-                }
-            }
-            else {
-                // Create view element.
-                viewElement = this._createViewElement(domNode, options);
-                if (options.bind) {
-                    this.bindElements(domNode, viewElement);
-                }
-                // Copy element's attributes.
-                const attrs = domNode.attributes;
-                if (attrs) {
-                    for (let l = attrs.length, i = 0; i < l; i++) {
-                        viewElement._setAttribute(attrs[i].name, attrs[i].value);
-                    }
-                }
-                // Treat this element's content as a raw data if it was registered as such.
-                // Comment node is also treated as an element with raw data.
-                if (this._isViewElementWithRawContent(viewElement, options) || isComment(domNode)) {
-                    const rawContent = isComment(domNode) ? domNode.data : domNode.innerHTML;
-                    viewElement._setCustomProperty('$rawContent', rawContent);
-                    // Store a DOM node to prevent left trimming of the following text node.
-                    this._encounteredRawContentDomNodes.add(domNode);
-                    return viewElement;
-                }
-            }
-            if (options.withChildren !== false) {
-                for (const child of this.domChildrenToView(domNode, options)) {
-                    viewElement._appendChild(child);
-                }
-            }
-            return viewElement;
-        }
+        return node;
     }
     /**
      * Converts children of the DOM element to view nodes using
@@ -542,16 +496,27 @@ export default class DomConverter {
      *
      * @param domElement Parent DOM element.
      * @param options See {@link module:engine/view/domconverter~DomConverter#domToView} options parameter.
+     * @param inlineNodes An array that will be populated with inline nodes. It's used internally for whitespace processing.
      * @returns View nodes.
      */
-    *domChildrenToView(domElement, options) {
+    *domChildrenToView(domElement, options = {}, inlineNodes = []) {
         for (let i = 0; i < domElement.childNodes.length; i++) {
             const domChild = domElement.childNodes[i];
-            const viewChild = this.domToView(domChild, options);
+            const generator = this._domToView(domChild, options, inlineNodes);
+            // Get the first yielded value or a returned value.
+            const viewChild = generator.next().value;
             if (viewChild !== null) {
+                // Whitespace cleaning before entering a block element (between block elements).
+                if (this._isBlockViewElement(viewChild)) {
+                    this._processDomInlineNodes(domElement, inlineNodes, options);
+                }
                 yield viewChild;
+                // Trigger children handling.
+                generator.next();
             }
         }
+        // Whitespace cleaning before leaving a block element (content of block element).
+        this._processDomInlineNodes(domElement, inlineNodes, options);
     }
     /**
      * Converts DOM selection to view {@link module:engine/view/selection~Selection}.
@@ -925,6 +890,19 @@ export default class DomConverter {
     registerRawContentMatcher(pattern) {
         this._rawContentElementMatcher.add(pattern);
     }
+    /**
+     * Registers a {@link module:engine/view/matcher~MatcherPattern} for inline object view elements.
+     *
+     * This is affecting how {@link module:engine/view/domconverter~DomConverter#domToView} and
+     * {@link module:engine/view/domconverter~DomConverter#domChildrenToView} process DOM nodes.
+     *
+     * This is an extension of a simple {@link #inlineObjectElements} array of element names.
+     *
+     * @param pattern Pattern matching a view element which should be treated as an inline object.
+     */
+    registerInlineObjectMatcher(pattern) {
+        this._inlineObjectElementMatcher.add(pattern);
+    }
     /**
      * Returns the block {@link module:engine/view/filler filler} node based on the current {@link #blockFillerMode} setting.
      */
@@ -964,6 +942,194 @@ export default class DomConverter {
         }
         return true;
     }
+    /**
+     * Internal generator for {@link #domToView}. Also used by {@link #domChildrenToView}.
+     * Separates DOM nodes conversion from whitespaces processing.
+     *
+     * @param domNode DOM node or document fragment to transform.
+     * @param inlineNodes An array of recently encountered inline nodes truncated to the block element boundaries.
+     * Used later to process whitespaces.
+     */
+    *_domToView(domNode, options, inlineNodes) {
+        if (this.isBlockFiller(domNode)) {
+            return null;
+        }
+        // When node is inside a UIElement or a RawElement return that parent as it's view representation.
+        const hostElement = this.getHostViewElement(domNode);
+        if (hostElement) {
+            return hostElement;
+        }
+        if (isComment(domNode) && options.skipComments) {
+            return null;
+        }
+        if (isText(domNode)) {
+            if (isInlineFiller(domNode)) {
+                return null;
+            }
+            else {
+                const textData = domNode.data;
+                if (textData === '') {
+                    return null;
+                }
+                const textNode = new ViewText(this.document, textData);
+                inlineNodes.push(textNode);
+                return textNode;
+            }
+        }
+        else {
+            let viewElement = this.mapDomToView(domNode);
+            if (viewElement) {
+                if (this._isInlineObjectElement(viewElement)) {
+                    inlineNodes.push(viewElement);
+                }
+                return viewElement;
+            }
+            if (this.isDocumentFragment(domNode)) {
+                // Create view document fragment.
+                viewElement = new ViewDocumentFragment(this.document);
+                if (options.bind) {
+                    this.bindDocumentFragments(domNode, viewElement);
+                }
+            }
+            else {
+                // Create view element.
+                viewElement = this._createViewElement(domNode, options);
+                if (options.bind) {
+                    this.bindElements(domNode, viewElement);
+                }
+                // Copy element's attributes.
+                const attrs = domNode.attributes;
+                if (attrs) {
+                    for (let l = attrs.length, i = 0; i < l; i++) {
+                        viewElement._setAttribute(attrs[i].name, attrs[i].value);
+                    }
+                }
+                // Treat this element's content as a raw data if it was registered as such.
+                if (this._isViewElementWithRawContent(viewElement, options)) {
+                    viewElement._setCustomProperty('$rawContent', domNode.innerHTML);
+                    if (!this._isBlockViewElement(viewElement)) {
+                        inlineNodes.push(viewElement);
+                    }
+                    return viewElement;
+                }
+                // Comment node is also treated as an element with raw data.
+                if (isComment(domNode)) {
+                    viewElement._setCustomProperty('$rawContent', domNode.data);
+                    return viewElement;
+                }
+            }
+            // Yield the element first so the flow of nested inline nodes is not reversed inside elements.
+            yield viewElement;
+            const nestedInlineNodes = [];
+            if (options.withChildren !== false) {
+                for (const child of this.domChildrenToView(domNode, options, nestedInlineNodes)) {
+                    viewElement._appendChild(child);
+                }
+            }
+            // Check if this is an inline object after processing child nodes so matcher
+            // for inline objects can verify if the element is empty.
+            if (this._isInlineObjectElement(viewElement)) {
+                inlineNodes.push(viewElement);
+            }
+            else {
+                // It's an inline element that is not an object (like <b>, <i>) or a block element.
+                for (const inlineNode of nestedInlineNodes) {
+                    inlineNodes.push(inlineNode);
+                }
+            }
+        }
+    }
+    /**
+     * Internal helper that walks the list of inline view nodes already generated from DOM nodes
+     * and handles whitespaces and NBSPs.
+     *
+     * @param domParent The DOM parent of the given inline nodes. This should be a document fragment or
+     * a block element to whitespace processing start cleaning.
+     * @param inlineNodes An array of recently encountered inline nodes truncated to the block element boundaries.
+     */
+    _processDomInlineNodes(domParent, inlineNodes, options) {
+        if (!inlineNodes.length) {
+            return;
+        }
+        // Process text nodes only after reaching a block or document fragment,
+        // do not alter whitespaces while processing an inline element like <b> or <i>.
+        if (domParent && !this.isDocumentFragment(domParent) && !this._isBlockDomElement(domParent)) {
+            return;
+        }
+        let prevNodeEndsWithSpace = false;
+        for (let i = 0; i < inlineNodes.length; i++) {
+            const node = inlineNodes[i];
+            if (!node.is('$text')) {
+                prevNodeEndsWithSpace = false;
+                continue;
+            }
+            let data;
+            let nodeEndsWithSpace = false;
+            if (_hasViewParentOfType(node, this.preElements)) {
+                data = getDataWithoutFiller(node.data);
+            }
+            else {
+                // Change all consecutive whitespace characters (from the [ \n\t\r] set –
+                // see https://github.com/ckeditor/ckeditor5-engine/issues/822#issuecomment-311670249) to a single space character.
+                // That's how multiple whitespaces are treated when rendered, so we normalize those whitespaces.
+                // We're replacing 1+ (and not 2+) to also normalize singular \n\t\r characters (#822).
+                data = node.data.replace(/[ \n\t\r]{1,}/g, ' ');
+                nodeEndsWithSpace = /[^\S\u00A0]/.test(data.charAt(data.length - 1));
+                const prevNode = i > 0 ? inlineNodes[i - 1] : null;
+                const nextNode = i + 1 < inlineNodes.length ? inlineNodes[i + 1] : null;
+                const shouldLeftTrim = !prevNode || prevNode.is('element') && prevNode.name == 'br' || prevNodeEndsWithSpace;
+                const shouldRightTrim = nextNode ? false : !startsWithFiller(node.data);
+                // Do not try to clear whitespaces if this is flat mapping for the purpose of mutation observer and differ in rendering.
+                if (options.withChildren !== false) {
+                    // If the previous dom text node does not exist or it ends by whitespace character, remove space character from the
+                    // beginning of this text node. Such space character is treated as a whitespace.
+                    if (shouldLeftTrim) {
+                        data = data.replace(/^ /, '');
+                    }
+                    // If the next text node does not exist remove space character from the end of this text node.
+                    if (shouldRightTrim) {
+                        data = data.replace(/ $/, '');
+                    }
+                }
+                // At the beginning and end of a block element, Firefox inserts normal space + <br> instead of non-breaking space.
+                // This means that the text node starts/end with normal space instead of non-breaking space.
+                // This causes a problem because the normal space would be removed in `.replace` calls above. To prevent that,
+                // the inline filler is removed only after the data is initially processed (by the `.replace` above). See ckeditor5#692.
+                data = getDataWithoutFiller(data);
+                // At this point we should have removed all whitespaces from DOM text data.
+                //
+                // Now, We will reverse the process that happens in `_processDataFromViewText`.
+                //
+                // We have to change &nbsp; chars, that were in DOM text data because of rendering reasons, to spaces.
+                // First, change all ` \u00A0` pairs (space + &nbsp;) to two spaces. DOM converter changes two spaces from model/view to
+                // ` \u00A0` to ensure proper rendering. Since here we convert back, we recognize those pairs and change them back to `  `.
+                data = data.replace(/ \u00A0/g, '  ');
+                const isNextNodeInlineObjectElement = nextNode && nextNode.is('element') && nextNode.name != 'br';
+                const isNextNodeStartingWithSpace = nextNode && nextNode.is('$text') && nextNode.data.charAt(0) == ' ';
+                // Then, let's change the last nbsp to a space.
+                if (/[ \u00A0]\u00A0$/.test(data) || !nextNode || isNextNodeInlineObjectElement || isNextNodeStartingWithSpace) {
+                    data = data.replace(/\u00A0$/, ' ');
+                }
+                // Then, change &nbsp; character that is at the beginning of the text node to space character.
+                // We do that replacement only if this is the first node or the previous node ends on whitespace character.
+                if (shouldLeftTrim || prevNode && prevNode.is('element') && prevNode.name != 'br') {
+                    data = data.replace(/^\u00A0/, ' ');
+                }
+            }
+            // At this point, all whitespaces should be removed and all &nbsp; created for rendering reasons should be
+            // changed to normal space. All left &nbsp; are &nbsp; inserted intentionally.
+            if (data.length == 0 && node.parent) {
+                node._remove();
+                inlineNodes.splice(i, 1);
+                i--;
+            }
+            else {
+                node._data = data;
+                prevNodeEndsWithSpace = nodeEndsWithSpace;
+            }
+        }
+        inlineNodes.length = 0;
+    }
     /**
      * Takes text data from a given {@link module:engine/view/text~Text#data} and processes it so
      * it is correctly displayed in the DOM.
@@ -1029,103 +1195,6 @@ export default class DomConverter {
         const data = this._processDataFromViewText(node);
         return data.charAt(data.length - 1) == ' ';
     }
-    /**
-     * Takes text data from native `Text` node and processes it to a correct {@link module:engine/view/text~Text view text node} data.
-     *
-     * Following changes are done:
-     *
-     * * multiple whitespaces are replaced to a single space,
-     * * space at the beginning of a text node is removed if it is the first text node in its container
-     * element or if the previous text node ends with a space character,
-     * * space at the end of the text node is removed if there are two spaces at the end of a node or if next node
-     * starts with a space or if it is the last text node in its container
-     * * nbsps are converted to spaces.
-     *
-     * @param node DOM text node to process.
-     * @returns Processed data.
-     */
-    _processDataFromDomText(node) {
-        let data = node.data;
-        if (_hasDomParentOfType(node, this.preElements)) {
-            return getDataWithoutFiller(node);
-        }
-        // Change all consecutive whitespace characters (from the [ \n\t\r] set –
-        // see https://github.com/ckeditor/ckeditor5-engine/issues/822#issuecomment-311670249) to a single space character.
-        // That's how multiple whitespaces are treated when rendered, so we normalize those whitespaces.
-        // We're replacing 1+ (and not 2+) to also normalize singular \n\t\r characters (#822).
-        data = data.replace(/[ \n\t\r]{1,}/g, ' ');
-        const prevNode = this._getTouchingInlineDomNode(node, false);
-        const nextNode = this._getTouchingInlineDomNode(node, true);
-        const shouldLeftTrim = this._checkShouldLeftTrimDomText(node, prevNode);
-        const shouldRightTrim = this._checkShouldRightTrimDomText(node, nextNode);
-        // If the previous dom text node does not exist or it ends by whitespace character, remove space character from the beginning
-        // of this text node. Such space character is treated as a whitespace.
-        if (shouldLeftTrim) {
-            data = data.replace(/^ /, '');
-        }
-        // If the next text node does not exist remove space character from the end of this text node.
-        if (shouldRightTrim) {
-            data = data.replace(/ $/, '');
-        }
-        // At the beginning and end of a block element, Firefox inserts normal space + <br> instead of non-breaking space.
-        // This means that the text node starts/end with normal space instead of non-breaking space.
-        // This causes a problem because the normal space would be removed in `.replace` calls above. To prevent that,
-        // the inline filler is removed only after the data is initially processed (by the `.replace` above). See ckeditor5#692.
-        data = getDataWithoutFiller(new Text(data));
-        // At this point we should have removed all whitespaces from DOM text data.
-        //
-        // Now, We will reverse the process that happens in `_processDataFromViewText`.
-        //
-        // We have to change &nbsp; chars, that were in DOM text data because of rendering reasons, to spaces.
-        // First, change all ` \u00A0` pairs (space + &nbsp;) to two spaces. DOM converter changes two spaces from model/view to
-        // ` \u00A0` to ensure proper rendering. Since here we convert back, we recognize those pairs and change them back to `  `.
-        data = data.replace(/ \u00A0/g, '  ');
-        const isNextNodeInlineObjectElement = nextNode && this.isElement(nextNode) && nextNode.tagName != 'BR';
-        const isNextNodeStartingWithSpace = nextNode && isText(nextNode) && nextNode.data.charAt(0) == ' ';
-        // Then, let's change the last nbsp to a space.
-        if (/( |\u00A0)\u00A0$/.test(data) || !nextNode || isNextNodeInlineObjectElement || isNextNodeStartingWithSpace) {
-            data = data.replace(/\u00A0$/, ' ');
-        }
-        // Then, change &nbsp; character that is at the beginning of the text node to space character.
-        // We do that replacement only if this is the first node or the previous node ends on whitespace character.
-        if (shouldLeftTrim || prevNode && this.isElement(prevNode) && prevNode.tagName != 'BR') {
-            data = data.replace(/^\u00A0/, ' ');
-        }
-        // At this point, all whitespaces should be removed and all &nbsp; created for rendering reasons should be
-        // changed to normal space. All left &nbsp; are &nbsp; inserted intentionally.
-        return data;
-    }
-    /**
-     * Helper function which checks if a DOM text node, preceded by the given `prevNode` should
-     * be trimmed from the left side.
-     *
-     * @param prevNode Either DOM text or `<br>` or one of `#inlineObjectElements`.
-     */
-    _checkShouldLeftTrimDomText(node, prevNode) {
-        if (!prevNode) {
-            return true;
-        }
-        if (this.isElement(prevNode)) {
-            return prevNode.tagName === 'BR';
-        }
-        // Shouldn't left trim if previous node is a node that was encountered as a raw content node.
-        if (this._encounteredRawContentDomNodes.has(node.previousSibling)) {
-            return false;
-        }
-        return /[^\S\u00A0]/.test(prevNode.data.charAt(prevNode.data.length - 1));
-    }
-    /**
-     * Helper function which checks if a DOM text node, succeeded by the given `nextNode` should
-     * be trimmed from the right side.
-     *
-     * @param nextNode Either DOM text or `<br>` or one of `#inlineObjectElements`.
-     */
-    _checkShouldRightTrimDomText(node, nextNode) {
-        if (nextNode) {
-            return false;
-        }
-        return !startsWithFiller(node);
-    }
     /**
      * Helper function. For given {@link module:engine/view/text~Text view text node}, it finds previous or next sibling
      * that is contained in the same container element. If there is no such sibling, `null` is returned.
@@ -1140,8 +1209,12 @@ export default class DomConverter {
             direction: getNext ? 'forward' : 'backward'
         });
         for (const value of treeWalker) {
+            // <br> found – it works like a block boundary, so do not scan further.
+            if (value.item.is('element', 'br')) {
+                return null;
+            }
             // Found an inline object (for example an image).
-            if (value.item.is('element') && this.inlineObjectElements.includes(value.item.name)) {
+            else if (this._isInlineObjectElement(value.item)) {
                 return value.item;
             }
             // ViewContainerElement is found on a way to next ViewText node, so given `node` was first/last
@@ -1149,10 +1222,6 @@ export default class DomConverter {
             else if (value.item.is('containerElement')) {
                 return null;
             }
-            // <br> found – it works like a block boundary, so do not scan further.
-            else if (value.item.is('element', 'br')) {
-                return null;
-            }
             // Found a text node in the same container element.
             else if (value.item.is('$textProxy')) {
                 return value.item;
@@ -1161,61 +1230,27 @@ export default class DomConverter {
         return null;
     }
     /**
-     * Helper function. For the given text node, it finds the closest touching node which is either
-     * a text, `<br>` or an {@link #inlineObjectElements inline object}.
-     *
-     * If no such node is found, `null` is returned.
-     *
-     * For instance, in the following DOM structure:
-     *
-     * ```html
-     * <p>foo<b>bar</b><br>bom</p>
-     * ```
-     *
-     * * `foo` doesn't have its previous touching inline node (`null` is returned),
-     * * `foo`'s next touching inline node is `bar`
-     * * `bar`'s next touching inline node is `<br>`
-     *
-     * This method returns text nodes and `<br>` elements because these types of nodes affect how
-     * spaces in the given text node need to be converted.
+     * Returns `true` if a DOM node belongs to {@link #blockElements}. `false` otherwise.
      */
-    _getTouchingInlineDomNode(node, getNext) {
-        if (!node.parentNode) {
-            return null;
-        }
-        const stepInto = getNext ? 'firstChild' : 'lastChild';
-        const stepOver = getNext ? 'nextSibling' : 'previousSibling';
-        let skipChildren = true;
-        let returnNode = node;
-        do {
-            if (!skipChildren && returnNode[stepInto]) {
-                returnNode = returnNode[stepInto];
-            }
-            else if (returnNode[stepOver]) {
-                returnNode = returnNode[stepOver];
-                skipChildren = false;
-            }
-            else {
-                returnNode = returnNode.parentNode;
-                skipChildren = true;
-            }
-            if (!returnNode || this._isBlockElement(returnNode)) {
-                return null;
-            }
-        } while (!(isText(returnNode) || returnNode.tagName == 'BR' || this._isInlineObjectElement(returnNode)));
-        return returnNode;
+    _isBlockDomElement(node) {
+        return this.isElement(node) && this.blockElements.includes(node.tagName.toLowerCase());
     }
     /**
-     * Returns `true` if a DOM node belongs to {@link #blockElements}. `false` otherwise.
+     * Returns `true` if a view node belongs to {@link #blockElements}. `false` otherwise.
      */
-    _isBlockElement(node) {
-        return this.isElement(node) && this.blockElements.includes(node.tagName.toLowerCase());
+    _isBlockViewElement(node) {
+        return node.is('element') && this.blockElements.includes(node.name);
     }
     /**
      * Returns `true` if a DOM node belongs to {@link #inlineObjectElements}. `false` otherwise.
      */
     _isInlineObjectElement(node) {
-        return this.isElement(node) && this.inlineObjectElements.includes(node.tagName.toLowerCase());
+        if (!node.is('element')) {
+            return false;
+        }
+        return node.name == 'br' ||
+            this.inlineObjectElements.includes(node.name) ||
+            !!this._inlineObjectElementMatcher.match(node);
     }
     /**
      * Creates view element basing on the node type.
@@ -1237,7 +1272,7 @@ export default class DomConverter {
      * @param options Conversion options. See {@link module:engine/view/domconverter~DomConverter#domToView} options parameter.
      */
     _isViewElementWithRawContent(viewElement, options) {
-        return options.withChildren !== false && !!this._rawContentElementMatcher.match(viewElement);
+        return options.withChildren !== false && viewElement.is('element') && !!this._rawContentElementMatcher.match(viewElement);
     }
     /**
      * Checks whether a given element name should be renamed in a current rendering mode.
@@ -1276,9 +1311,8 @@ export default class DomConverter {
  *
  * @returns`true` if such parent exists or `false` if it does not.
  */
-function _hasDomParentOfType(node, types) {
-    const parents = getAncestors(node);
-    return parents.some(parent => parent.tagName && types.includes(parent.tagName.toLowerCase()));
+function _hasViewParentOfType(node, types) {
+    return node.getAncestors().some(parent => parent.is('element') && types.includes(parent.name));
 }
 /**
  * A helper that executes given callback for each DOM node's ancestor, starting from the given node

package/src/view/downcastwriter.d.ts

@@ -5,23 +5,23 @@
 /**
  * @module engine/view/downcastwriter
  */
-import Position, { type PositionOffset } from './position';
-import Range from './range';
-import Selection, { type PlaceOrOffset, type Selectable, type SelectionOptions } from './selection';
-import ContainerElement from './containerelement';
-import AttributeElement from './attributeelement';
-import EmptyElement from './emptyelement';
-import UIElement from './uielement';
-import RawElement from './rawelement';
-import DocumentFragment from './documentfragment';
-import Text from './text';
-import EditableElement from './editableelement';
-import type Document from './document';
-import type Node from './node';
-import type { default as Element, ElementAttributes } from './element';
-import type DomConverter from './domconverter';
-import type Item from './item';
-import type { SlotFilter } from '../conversion/downcasthelpers';
+import Position, { type PositionOffset } from './position.js';
+import Range from './range.js';
+import Selection, { type PlaceOrOffset, type Selectable, type SelectionOptions } from './selection.js';
+import ContainerElement from './containerelement.js';
+import AttributeElement from './attributeelement.js';
+import EmptyElement from './emptyelement.js';
+import UIElement from './uielement.js';
+import RawElement from './rawelement.js';
+import DocumentFragment from './documentfragment.js';
+import Text from './text.js';
+import EditableElement from './editableelement.js';
+import type Document from './document.js';
+import type Node from './node.js';
+import type { default as Element, ElementAttributes } from './element.js';
+import type DomConverter from './domconverter.js';
+import type Item from './item.js';
+import type { SlotFilter } from '../conversion/downcasthelpers.js';
 type DomDocument = globalThis.Document;
 type DomElement = globalThis.HTMLElement;
 /**

package/src/view/downcastwriter.js

@@ -5,18 +5,18 @@
 /**
  * @module engine/view/downcastwriter
  */
-import Position from './position';
-import Range from './range';
-import Selection from './selection';
-import ContainerElement from './containerelement';
-import AttributeElement from './attributeelement';
-import EmptyElement from './emptyelement';
-import UIElement from './uielement';
-import RawElement from './rawelement';
+import Position from './position.js';
+import Range from './range.js';
+import Selection from './selection.js';
+import ContainerElement from './containerelement.js';
+import AttributeElement from './attributeelement.js';
+import EmptyElement from './emptyelement.js';
+import UIElement from './uielement.js';
+import RawElement from './rawelement.js';
 import { CKEditorError, isIterable } from '@ckeditor/ckeditor5-utils';
-import DocumentFragment from './documentfragment';
-import Text from './text';
-import EditableElement from './editableelement';
+import DocumentFragment from './documentfragment.js';
+import Text from './text.js';
+import EditableElement from './editableelement.js';
 import { isPlainObject } from 'lodash-es';
 /**
  * View downcast writer.