@ckeditor/ckeditor5-engine 44.2.1-alpha.0 → 44.3.0-alpha.0

package/src/view/domconverter.js

@@ -509,6 +509,10 @@ export default class DomConverter {
         generator.next();
         // Whitespace cleaning.
         this._processDomInlineNodes(null, inlineNodes, options);
+        // This was a single block filler so just remove it.
+        if (this.blockFillerMode == 'br' && isViewBrFiller(node)) {
+            return null;
+        }
         // Text not got trimmed to an empty string so there is no result node.
         if (node.is('$text') && node.data.length == 0) {
             return null;
@@ -544,7 +548,10 @@ export default class DomConverter {
                 if (this._isBlockViewElement(viewChild)) {
                     this._processDomInlineNodes(domElement, inlineNodes, options);
                 }
-                yield viewChild;
+                // Yield only if this is not a block filler.
+                if (!(this.blockFillerMode == 'br' && isViewBrFiller(viewChild))) {
+                    yield viewChild;
+                }
                 // Trigger children handling.
                 generator.next();
             }
@@ -863,10 +870,9 @@ export default class DomConverter {
         if (this.blockFillerMode == 'br') {
             return domNode.isEqualNode(BR_FILLER_REF);
         }
-        // Special case for <p><br></p> in which <br> should be treated as filler even when we are not in the 'br' mode. See ckeditor5#5564.
-        if (domNode.tagName === 'BR' &&
-            hasBlockParent(domNode, this.blockElements) &&
-            domNode.parentNode.childNodes.length === 1) {
+        // Special case for <p><br></p> in which <br> should be treated as filler even when we are not in the 'br' mode.
+        // See https://github.com/ckeditor/ckeditor5/issues/5564.
+        if (isOnlyBrInBlock(domNode, this.blockElements)) {
             return true;
         }
         // If not in 'br' mode, try recognizing both marked and regular nbsp block fillers.
@@ -1018,7 +1024,9 @@ export default class DomConverter {
      * Used later to process whitespaces.
      */
     *_domToView(domNode, options, inlineNodes) {
-        if (this.isBlockFiller(domNode)) {
+        // Special case for <p><br></p> in which <br> should be treated as filler even when we are not in the 'br' mode.
+        // See https://github.com/ckeditor/ckeditor5/issues/5564.
+        if (this.blockFillerMode != 'br' && isOnlyBrInBlock(domNode, this.blockElements)) {
             return null;
         }
         // When node is inside a UIElement or a RawElement return that parent as it's view representation.
@@ -1165,6 +1173,21 @@ export default class DomConverter {
                 // 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);
+                // Block filler handling.
+                if (this.blockFillerMode != 'br' && node.parent) {
+                    if (isViewMarkedNbspFiller(node.parent, data)) {
+                        data = '';
+                        // Mark block element as it has a block filler and remove the `<span data-cke-filler="true">` element.
+                        if (node.parent.parent) {
+                            node.parent.parent._setCustomProperty('$hasBlockFiller', true);
+                            node.parent._remove();
+                        }
+                    }
+                    else if (isViewNbspFiller(node.parent, data, this.blockElements)) {
+                        data = '';
+                        node.parent._setCustomProperty('$hasBlockFiller', true);
+                    }
+                }
                 // At this point we should have removed all whitespaces from DOM text data.
                 //
                 // Now, We will reverse the process that happens in `_processDataFromViewText`.
@@ -1423,7 +1446,7 @@ function forEachDomElementAncestor(element, callback) {
     }
 }
 /**
- * Checks if given node is a nbsp block filler.
+ * Checks if given DOM node is a nbsp block filler.
  *
  * A &nbsp; is a block filler only if it is a single child of a block element.
  *
@@ -1442,6 +1465,48 @@ function hasBlockParent(domNode, blockElements) {
     const parent = domNode.parentNode;
     return !!parent && !!parent.tagName && blockElements.includes(parent.tagName.toLowerCase());
 }
+/**
+ * Checks if given view node is a nbsp block filler.
+ *
+ * A &nbsp; is a block filler only if it is a single child of a block element.
+ */
+function isViewNbspFiller(parent, data, blockElements) {
+    return (data == '\u00A0' &&
+        parent &&
+        parent.is('element') &&
+        parent.childCount == 1 &&
+        blockElements.includes(parent.name));
+}
+/**
+ * Checks if given view node is a marked-nbsp block filler.
+ *
+ * A &nbsp; is a block filler only if it is wrapped in `<span data-cke-filler="true">` element.
+ */
+function isViewMarkedNbspFiller(parent, data) {
+    return (data == '\u00A0' &&
+        parent &&
+        parent.is('element', 'span') &&
+        parent.childCount == 1 &&
+        parent.hasAttribute('data-cke-filler'));
+}
+/**
+ * Checks if given view node is a br block filler.
+ *
+ * A <br> is a block filler only if it has data-cke-filler attribute set.
+ */
+function isViewBrFiller(node) {
+    return (node.is('element', 'br') &&
+        node.hasAttribute('data-cke-filler'));
+}
+/**
+ * Special case for `<p><br></p>` in which `<br>` should be treated as filler even when we are not in the 'br' mode.
+ */
+function isOnlyBrInBlock(domNode, blockElements) {
+    // See https://github.com/ckeditor/ckeditor5/issues/5564.
+    return (domNode.tagName === 'BR' &&
+        hasBlockParent(domNode, blockElements) &&
+        domNode.parentNode.childNodes.length === 1);
+}
 /**
  * Log to console the information about element that was replaced.
  * Check UNSAFE_ELEMENTS for all recognized unsafe elements.

package/src/view/downcastwriter.d.ts

@@ -13,6 +13,7 @@ import AttributeElement from './attributeelement.js';
 import EmptyElement from './emptyelement.js';
 import UIElement from './uielement.js';
 import RawElement from './rawelement.js';
+import { type ArrayOrItem } from '@ckeditor/ckeditor5-utils';
 import DocumentFragment from './documentfragment.js';
 import Text from './text.js';
 import EditableElement from './editableelement.js';
@@ -382,8 +383,25 @@ export default class DowncastWriter {
      *
      * @param key The attribute key.
      * @param value The attribute value.
+     * @param element The element to set an attribute on.
      */
     setAttribute(key: string, value: unknown, element: Element): void;
+    /**
+     * Adds or overwrites the element's attribute with a specified key and value.
+     * Note that for tokenized attributes it allows the `reset` parameter to specify if the previous
+     * attribute value should be overwritten or a new token (class name, style property) should be added.
+     *
+     * ```ts
+     * writer.setAttribute( 'href', 'http://ckeditor.com', linkElement );
+     * writer.setAttribute( 'class', 'foo', false, element );
+     * ```
+     *
+     * @param key The attribute key.
+     * @param value The attribute value.
+     * @param overwrite Whether tokenized attribute should overwrite the attribute value or just add a token.
+     * @param element The element to set an attribute on.
+     */
+    setAttribute(key: string, value: unknown, overwrite: boolean, element: Element): void;
     /**
      * Removes attribute from the element.
      *
@@ -392,8 +410,22 @@ export default class DowncastWriter {
      * ```
      *
      * @param key Attribute key.
+     * @param element The element to remove an attribute of.
      */
     removeAttribute(key: string, element: Element): void;
+    /**
+     * Removes specified tokens from an attribute value (for example class names, style properties).
+     * If resulting attribute become empty, the whole attribute is removed.
+     *
+     * ```ts
+     * writer.removeAttribute( 'class', 'foo', linkElement );
+     * ```
+     *
+     * @param key Attribute key.
+     * @param tokens Tokens to partly remove from attribute value. For example class names or style property names.
+     * @param element The element to remove an attribute of.
+     */
+    removeAttribute(key: string, tokens: ArrayOrItem<string>, element: Element): void;
     /**
      * Adds specified class to the element.
      *
@@ -924,26 +956,6 @@ export default class DowncastWriter {
      * @returns New position after wrapping.
      */
     private _wrapPosition;
-    /**
-     * Wraps one {@link module:engine/view/attributeelement~AttributeElement AttributeElement} into another by
-     * merging them if possible. When merging is possible - all attributes, styles and classes are moved from wrapper
-     * element to element being wrapped.
-     *
-     * @param wrapper Wrapper AttributeElement.
-     * @param toWrap AttributeElement to wrap using wrapper element.
-     * @returns Returns `true` if elements are merged.
-     */
-    private _wrapAttributeElement;
-    /**
-     * Unwraps {@link module:engine/view/attributeelement~AttributeElement AttributeElement} from another by removing
-     * corresponding attributes, classes and styles. All attributes, classes and styles from wrapper should be present
-     * inside element being unwrapped.
-     *
-     * @param wrapper Wrapper AttributeElement.
-     * @param toUnwrap AttributeElement to unwrap using wrapper element.
-     * @returns Returns `true` if elements are unwrapped.
-     **/
-    private _unwrapAttributeElement;
     /**
      * Helper function used by other `DowncastWriter` methods. Breaks attribute elements at the boundaries of given range.
      *

package/src/view/downcastwriter.js

@@ -257,30 +257,21 @@ export default class DowncastWriter {
         }
         return rawElement;
     }
-    /**
-     * Adds or overwrites the element's attribute with a specified key and value.
-     *
-     * ```ts
-     * writer.setAttribute( 'href', 'http://ckeditor.com', linkElement );
-     * ```
-     *
-     * @param key The attribute key.
-     * @param value The attribute value.
-     */
-    setAttribute(key, value, element) {
-        element._setAttribute(key, value);
+    setAttribute(key, value, elementOrOverwrite, element) {
+        if (element !== undefined) {
+            element._setAttribute(key, value, elementOrOverwrite);
+        }
+        else {
+            elementOrOverwrite._setAttribute(key, value);
+        }
     }
-    /**
-     * Removes attribute from the element.
-     *
-     * ```ts
-     * writer.removeAttribute( 'href', linkElement );
-     * ```
-     *
-     * @param key Attribute key.
-     */
-    removeAttribute(key, element) {
-        element._removeAttribute(key);
+    removeAttribute(key, elementOrTokens, element) {
+        if (element !== undefined) {
+            element._removeAttribute(key, elementOrTokens);
+        }
+        else {
+            elementOrTokens._removeAttribute(key);
+        }
     }
     /**
      * Adds specified class to the element.
@@ -1018,7 +1009,8 @@ export default class DowncastWriter {
             //
             // <p><span class="bar">abc</span></p>  -->  <p><span class="foo bar">abc</span></p>
             //
-            if (isAttribute && this._wrapAttributeElement(wrapElement, child)) {
+            if (isAttribute && child._canMergeAttributesFrom(wrapElement)) {
+                child._mergeAttributesFrom(wrapElement);
                 wrapPositions.push(new Position(parent, i));
             }
             //
@@ -1109,7 +1101,8 @@ export default class DowncastWriter {
             // <p><span class="foo bar">abc</span>xyz</p>  -->  <p><span class="bar">abc</span>xyz</p>
             // <p><i class="foo">abc</i>xyz</p>            -->  <p><i class="foo">abc</i>xyz</p>
             //
-            if (this._unwrapAttributeElement(unwrapElement, child)) {
+            if (child._canSubtractAttributesOf(unwrapElement)) {
+                child._subtractAttributesOf(unwrapElement);
                 unwrapPositions.push(new Position(parent, i), new Position(parent, i + 1));
                 i++;
                 continue;
@@ -1203,116 +1196,6 @@ export default class DowncastWriter {
         // If position is next to text node - move position inside.
         return movePositionToTextNode(newPosition);
     }
-    /**
-     * Wraps one {@link module:engine/view/attributeelement~AttributeElement AttributeElement} into another by
-     * merging them if possible. When merging is possible - all attributes, styles and classes are moved from wrapper
-     * element to element being wrapped.
-     *
-     * @param wrapper Wrapper AttributeElement.
-     * @param toWrap AttributeElement to wrap using wrapper element.
-     * @returns Returns `true` if elements are merged.
-     */
-    _wrapAttributeElement(wrapper, toWrap) {
-        if (!canBeJoined(wrapper, toWrap)) {
-            return false;
-        }
-        // Can't merge if name or priority differs.
-        if (wrapper.name !== toWrap.name || wrapper.priority !== toWrap.priority) {
-            return false;
-        }
-        // Check if attributes can be merged.
-        for (const key of wrapper.getAttributeKeys()) {
-            // Classes and styles should be checked separately.
-            if (key === 'class' || key === 'style') {
-                continue;
-            }
-            // If some attributes are different we cannot wrap.
-            if (toWrap.hasAttribute(key) && toWrap.getAttribute(key) !== wrapper.getAttribute(key)) {
-                return false;
-            }
-        }
-        // Check if styles can be merged.
-        for (const key of wrapper.getStyleNames()) {
-            if (toWrap.hasStyle(key) && toWrap.getStyle(key) !== wrapper.getStyle(key)) {
-                return false;
-            }
-        }
-        // Move all attributes/classes/styles from wrapper to wrapped AttributeElement.
-        for (const key of wrapper.getAttributeKeys()) {
-            // Classes and styles should be checked separately.
-            if (key === 'class' || key === 'style') {
-                continue;
-            }
-            // Move only these attributes that are not present - other are similar.
-            if (!toWrap.hasAttribute(key)) {
-                this.setAttribute(key, wrapper.getAttribute(key), toWrap);
-            }
-        }
-        for (const key of wrapper.getStyleNames()) {
-            if (!toWrap.hasStyle(key)) {
-                this.setStyle(key, wrapper.getStyle(key), toWrap);
-            }
-        }
-        for (const key of wrapper.getClassNames()) {
-            if (!toWrap.hasClass(key)) {
-                this.addClass(key, toWrap);
-            }
-        }
-        return true;
-    }
-    /**
-     * Unwraps {@link module:engine/view/attributeelement~AttributeElement AttributeElement} from another by removing
-     * corresponding attributes, classes and styles. All attributes, classes and styles from wrapper should be present
-     * inside element being unwrapped.
-     *
-     * @param wrapper Wrapper AttributeElement.
-     * @param toUnwrap AttributeElement to unwrap using wrapper element.
-     * @returns Returns `true` if elements are unwrapped.
-     **/
-    _unwrapAttributeElement(wrapper, toUnwrap) {
-        if (!canBeJoined(wrapper, toUnwrap)) {
-            return false;
-        }
-        // Can't unwrap if name or priority differs.
-        if (wrapper.name !== toUnwrap.name || wrapper.priority !== toUnwrap.priority) {
-            return false;
-        }
-        // Check if AttributeElement has all wrapper attributes.
-        for (const key of wrapper.getAttributeKeys()) {
-            // Classes and styles should be checked separately.
-            if (key === 'class' || key === 'style') {
-                continue;
-            }
-            // If some attributes are missing or different we cannot unwrap.
-            if (!toUnwrap.hasAttribute(key) || toUnwrap.getAttribute(key) !== wrapper.getAttribute(key)) {
-                return false;
-            }
-        }
-        // Check if AttributeElement has all wrapper classes.
-        if (!toUnwrap.hasClass(...wrapper.getClassNames())) {
-            return false;
-        }
-        // Check if AttributeElement has all wrapper styles.
-        for (const key of wrapper.getStyleNames()) {
-            // If some styles are missing or different we cannot unwrap.
-            if (!toUnwrap.hasStyle(key) || toUnwrap.getStyle(key) !== wrapper.getStyle(key)) {
-                return false;
-            }
-        }
-        // Remove all wrapper's attributes from unwrapped element.
-        for (const key of wrapper.getAttributeKeys()) {
-            // Classes and styles should be checked separately.
-            if (key === 'class' || key === 'style') {
-                continue;
-            }
-            this.removeAttribute(key, toUnwrap);
-        }
-        // Remove all wrapper's classes from unwrapped element.
-        this.removeClass(Array.from(wrapper.getClassNames()), toUnwrap);
-        // Remove all wrapper's styles from unwrapped element.
-        this.removeStyle(Array.from(wrapper.getStyleNames()), toUnwrap);
-        return true;
-    }
     /**
      * Helper function used by other `DowncastWriter` methods. Breaks attribute elements at the boundaries of given range.
      *
@@ -1687,10 +1570,3 @@ function validateRangeContainer(range, errorContext) {
         throw new CKEditorError('view-writer-invalid-range-container', errorContext);
     }
 }
-/**
- * Checks if two attribute elements can be joined together. Elements can be joined together if, and only if
- * they do not have ids specified.
- */
-function canBeJoined(a, b) {
-    return a.id === null && b.id === null;
-}