@ckeditor/ckeditor5-engine 33.0.0 → 34.2.0

package/src/model/utils/insertobject.js

@@ -0,0 +1,173 @@
+/**
+ * @license Copyright (c) 2003-2022, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/**
+ * @module engine/model/utils/insertobject
+ */
+
+import first from '@ckeditor/ckeditor5-utils/src/first';
+import CKEditorError from '@ckeditor/ckeditor5-utils/src/ckeditorerror';
+
+import { findOptimalInsertionRange } from './findoptimalinsertionrange';
+
+/**
+ * Inserts an {@glink framework/guides/deep-dive/schema#object-elements object element} at a specific position in the editor content.
+ *
+ * **Note:** Use {@link module:engine/model/model~Model#insertObject} instead of this function.
+ * This function is only exposed to be reusable in algorithms which change the {@link module:engine/model/model~Model#insertObject}
+ * method's behavior.
+ *
+ * **Note**: For more documentation and examples, see {@link module:engine/model/model~Model#insertObject}.
+ *
+ * @param {module:engine/model/model~Model} model The model in context of which the insertion
+ * should be performed.
+ * @param {module:engine/model/element~Element} object An object to be inserted into the model document.
+ * @param {module:engine/model/selection~Selectable} [selectable=model.document.selection]
+ * A selectable where the content should be inserted. If not specified, the current
+ * {@link module:engine/model/document~Document#selection document selection} will be used instead.
+ * @param {Number|'before'|'end'|'after'|'on'|'in'} placeOrOffset Specifies the exact place or offset for the insertion to take place,
+ * relative to `selectable`.
+ * @param {Object} [options] Additional options.
+ * @param {'auto'|'before'|'after'} [options.findOptimalPosition] An option that, when set, adjusts the insertion position (relative to
+ * `selectable` and `placeOrOffset`) so that the content of `selectable` is not split upon insertion (a.k.a. non-destructive insertion).
+ * * When `'auto'`, the algorithm will decide whether to insert the object before or after `selectable` to avoid content splitting.
+ * * When `'before'`, the closest position before `selectable` will be used that will not result in content splitting.
+ * * When `'after'`, the closest position after `selectable` will be used that will not result in content splitting.
+ *
+ * Note that this option works only for block objects. Inline objects are inserted into text and do not split blocks.
+ * @param {'on'|'after'} [options.setSelection] An option that, when set, moves the
+ * {@link module:engine/model/document~Document#selection document selection} after inserting the object.
+ * * When `'on'`, the document selection will be set on the inserted object.
+ * * When `'after'`, the document selection will move to the closest text node after the inserted object. If there is no
+ * such text node, a paragraph will be created and the document selection will be moved inside it.
+ * @returns {module:engine/model/range~Range} A range which contains all the performed changes. This is a range that, if removed,
+ * would return the model to the state before the insertion. If no changes were preformed by `insertObject()`, returns a range collapsed
+ * at the insertion position.
+ */
+export default function insertObject( model, object, selectable, placeOrOffset, options = {} ) {
+	if ( !model.schema.isObject( object ) ) {
+		/**
+		 * Tried to insert an element with {@link module:engine/model/utils/insertobject insertObject()} function
+		 * that is not defined as an object in schema.
+		 * See {@link module:engine/model/schema~SchemaItemDefinition#isObject `SchemaItemDefinition`}.
+		 * If you want to insert content that is not an object you might want to use
+		 * {@link module:engine/model/utils/insertcontent insertContent()} function.
+		 * @error insertobject-element-not-an-object
+		 */
+		throw new CKEditorError( 'insertobject-element-not-an-object', model, { object } );
+	}
+
+	// Normalize selectable to a selection instance.
+	let originalSelection;
+
+	if ( !selectable ) {
+		originalSelection = model.document.selection;
+	} else if ( selectable.is( 'selection' ) ) {
+		originalSelection = selectable;
+	} else {
+		originalSelection = model.createSelection( selectable, placeOrOffset );
+	}
+
+	// Adjust the insertion selection.
+	let insertionSelection = originalSelection;
+
+	if ( options.findOptimalPosition && model.schema.isBlock( object ) ) {
+		insertionSelection = model.createSelection( findOptimalInsertionRange( originalSelection, model, options.findOptimalPosition ) );
+	}
+
+	// Collect attributes to be copied on the inserted object.
+	const firstSelectedBlock = first( originalSelection.getSelectedBlocks() );
+	const attributesToCopy = {};
+
+	if ( firstSelectedBlock ) {
+		Object.assign( attributesToCopy, model.schema.getAttributesWithProperty( firstSelectedBlock, 'copyOnReplace', true ) );
+	}
+
+	return model.change( writer => {
+		// Remove the selected content to find out what the parent of the inserted object would be.
+		// It would be removed inside model.insertContent() anyway.
+		if ( !insertionSelection.isCollapsed ) {
+			model.deleteContent( insertionSelection, { doNotAutoparagraph: true } );
+		}
+
+		let elementToInsert = object;
+		const insertionPositionParent = insertionSelection.anchor.parent;
+
+		// Autoparagraphing of an inline objects.
+		if (
+			!model.schema.checkChild( insertionPositionParent, object ) &&
+			model.schema.checkChild( insertionPositionParent, 'paragraph' ) &&
+			model.schema.checkChild( 'paragraph', object )
+		) {
+			elementToInsert = writer.createElement( 'paragraph' );
+
+			writer.insert( object, elementToInsert );
+		}
+
+		// Apply attributes that are allowed on the inserted object (or paragraph if autoparagraphed).
+		model.schema.setAllowedAttributes( elementToInsert, attributesToCopy, writer );
+
+		// Insert the prepared content at the optionally adjusted selection.
+		const affectedRange = model.insertContent( elementToInsert, insertionSelection );
+
+		// Nothing got inserted.
+		if ( affectedRange.isCollapsed ) {
+			return affectedRange;
+		}
+
+		if ( options.setSelection ) {
+			updateSelection( writer, object, options.setSelection, attributesToCopy );
+		}
+
+		return affectedRange;
+	} );
+}
+
+// Updates document selection based on given `place` parameter in relation to `contextElement` element.
+//
+// @private
+// @param {module:engine/model/writer~Writer} writer An instance of the model writer.
+// @param {module:engine/model/element~Element} contextElement An element to set the attributes on.
+// @param {'on'|'after'} place The place where selection should be set in relation to the `contextElement` element.
+// Value `on` will set selection on the passed `contextElement`. Value `after` will set selection after `contextElement`.
+// @param {Object} attributes Attributes keys and values to set on a paragraph that this function can create when
+// `place` parameter is equal to `after` but there is no element with `$text` node to set selection in.
+function updateSelection( writer, contextElement, place, paragraphAttributes ) {
+	const model = writer.model;
+
+	if ( place == 'after' ) {
+		let nextElement = contextElement.nextSibling;
+
+		// Check whether an element next to the inserted element is defined and can contain a text.
+		const canSetSelection = nextElement && model.schema.checkChild( nextElement, '$text' );
+
+		// If the element is missing, but a paragraph could be inserted next to the element, let's add it.
+		if ( !canSetSelection && model.schema.checkChild( contextElement.parent, 'paragraph' ) ) {
+			nextElement = writer.createElement( 'paragraph' );
+
+			model.schema.setAllowedAttributes( nextElement, paragraphAttributes, writer );
+			model.insertContent( nextElement, writer.createPositionAfter( contextElement ) );
+		}
+
+		// Put the selection inside the element, at the beginning.
+		if ( nextElement ) {
+			writer.setSelection( nextElement, 0 );
+		}
+	}
+	else if ( place == 'on' ) {
+		writer.setSelection( contextElement, 'on' );
+	}
+	else {
+		/**
+		 * The unsupported `options.setSelection` parameter was passed
+		 * to the {@link module:engine/model/utils/insertobject insertObject()} function.
+		 * Check the {@link module:engine/model/utils/insertobject insertObject()} API documentation for allowed
+		 * `options.setSelection` parameter values.
+		 *
+		 * @error insertobject-invalid-place-parameter-value
+		 */
+		throw new CKEditorError( 'insertobject-invalid-place-parameter-value', model );
+	}
+}

package/src/view/attributeelement.js

@@ -24,16 +24,6 @@ const DEFAULT_PRIORITY = 10;
  * To create a new attribute element instance use the
  * {@link module:engine/view/downcastwriter~DowncastWriter#createAttributeElement `DowncastWriter#createAttributeElement()`} method.
  *
- * **Note:** Attribute elements by default can wrap {@link module:engine/view/text~Text},
- * {@link module:engine/view/emptyelement~EmptyElement}, {@link module:engine/view/uielement~UIElement},
- * {@link module:engine/view/rawelement~RawElement} and other attribute elements with higher priority. Other elements while placed inside
- * an attribute element will split it (or nest in case of an `AttributeElement`). This behavior can be modified by changing
- * the `isAllowedInsideAttributeElement` option while creating
- * {@link module:engine/view/downcastwriter~DowncastWriter#createContainerElement},
- * {@link module:engine/view/downcastwriter~DowncastWriter#createEmptyElement},
- * {@link module:engine/view/downcastwriter~DowncastWriter#createUIElement} or
- * {@link module:engine/view/downcastwriter~DowncastWriter#createRawElement}.
- *
  * @extends module:engine/view/element~Element
  */
 export default class AttributeElement extends Element {

package/src/view/domconverter.js

@@ -35,7 +35,6 @@ const NBSP_FILLER_REF = NBSP_FILLER( document ); // eslint-disable-line new-cap
 const MARKED_NBSP_FILLER_REF = MARKED_NBSP_FILLER( document ); // eslint-disable-line new-cap
 const UNSAFE_ATTRIBUTE_NAME_PREFIX = 'data-ck-unsafe-attribute-';
 const UNSAFE_ELEMENT_REPLACEMENT_ATTRIBUTE = 'data-ck-unsafe-element';
-const UNSAFE_ELEMENTS = [ 'script', 'style' ];
 
 /**
  * `DomConverter` is a set of tools to do transformations between DOM nodes and view nodes. It also handles
@@ -127,6 +126,15 @@ export default class DomConverter {
 			'object', 'iframe', 'input', 'button', 'textarea', 'select', 'option', 'video', 'embed', 'audio', 'img', 'canvas'
 		];
 
+		/**
+		 * A list of elements which may affect the editing experience. To avoid this, those elements are replaced with
+		 * `<span data-ck-unsafe-element="[element name]"></span>` while rendering in the editing mode.
+		 *
+		 * @readonly
+		 * @member {Array.<String>} module:engine/view/domconverter~DomConverter#unsafeElements
+		 */
+		this.unsafeElements = [ 'script', 'style' ];
+
 		/**
 		 * The DOM-to-view mapping.
 		 *
@@ -493,7 +501,22 @@ export default class DomConverter {
 				yield this._getBlockFiller( domDocument );
 			}
 
-			yield this.viewToDom( childView, domDocument, options );
+			const transparentRendering = childView.is( 'element' ) && childView.getCustomProperty( 'dataPipeline:transparentRendering' );
+
+			if ( transparentRendering && this.renderingMode == 'data' ) {
+				yield* this.viewChildrenToDom( childView, domDocument, options );
+			} else {
+				if ( transparentRendering ) {
+					/**
+					 * The `dataPipeline:transparentRendering` flag is supported only in the data pipeline.
+					 *
+					 * @error domconverter-transparent-rendering-unsupported-in-editing-pipeline
+					 */
+					logWarning( 'domconverter-transparent-rendering-unsupported-in-editing-pipeline', { viewElement: childView } );
+				}
+
+				yield this.viewToDom( childView, domDocument, options );
+			}
 
 			offset++;
 		}
@@ -657,7 +680,7 @@ export default class DomConverter {
 				const attrs = domNode.attributes;
 
 				if ( attrs ) {
-					for ( let i = attrs.length - 1; i >= 0; i-- ) {
+					for ( let l = attrs.length, i = 0; i < l; i++ ) {
 						viewElement._setAttribute( attrs[ i ].name, attrs[ i ].value );
 					}
 				}
@@ -1549,7 +1572,7 @@ export default class DomConverter {
 	_shouldRenameElement( elementName ) {
 		const name = elementName.toLowerCase();
 
-		return this.renderingMode === 'editing' && UNSAFE_ELEMENTS.includes( name );
+		return this.renderingMode === 'editing' && this.unsafeElements.includes( name );
 	}
 
 	/**

package/src/view/downcastwriter.js

@@ -185,10 +185,6 @@ export default class DowncastWriter {
 	 *		// Set `id` of a marker element so it is not joined or merged with "normal" elements.
 	 *		writer.createAttributeElement( 'span', { class: 'my-marker' }, { id: 'marker:my' } );
 	 *
-	 * **Note:** By default an `AttributeElement` is split by a
-	 * {@link module:engine/view/containerelement~ContainerElement `ContainerElement`} but this behavior can be modified
-	 * with `isAllowedInsideAttributeElement` option set while {@link #createContainerElement creating the element}.
-	 *
 	 * @param {String} name Name of the element.
 	 * @param {Object} [attributes] Element's attributes.
 	 * @param {Object} [options] Element's options.
@@ -237,7 +233,7 @@ export default class DowncastWriter {
 	 *		] );
 	 *
 	 *		// Create element with specific options.
-	 *		writer.createContainerElement( 'span', { class: 'placeholder' }, { isAllowedInsideAttributeElement: true } );
+	 *		writer.createContainerElement( 'span', { class: 'placeholder' }, { renderUnsafeAttributes: [ 'foo' ] } );
 	 *
 	 * @param {String} name Name of the element.
 	 * @param {Object} [attributes] Elements attributes.
@@ -245,9 +241,6 @@ export default class DowncastWriter {
 	 * A node or a list of nodes to be inserted into the created element. If no children were specified, element's `options`
 	 * can be passed in this argument.
 	 * @param {Object} [options] Element's options.
-	 * @param {Boolean} [options.isAllowedInsideAttributeElement=false] Whether an element is
-	 * {@link module:engine/view/element~Element#isAllowedInsideAttributeElement allowed inside an AttributeElement} and can be wrapped
-	 * with {@link module:engine/view/attributeelement~AttributeElement} by {@link module:engine/view/downcastwriter~DowncastWriter}.
 	 * @param {Array.<String>} [options.renderUnsafeAttributes] A list of attribute names that should be rendered in the editing
 	 * pipeline even though they would normally be filtered out by unsafe attribute detection mechanisms.
 	 * @returns {module:engine/view/containerelement~ContainerElement} Created element.
@@ -263,10 +256,6 @@ export default class DowncastWriter {
 
 		const containerElement = new ContainerElement( this.document, name, attributes, children );
 
-		if ( options.isAllowedInsideAttributeElement !== undefined ) {
-			containerElement._isAllowedInsideAttributeElement = options.isAllowedInsideAttributeElement;
-		}
-
 		if ( options.renderUnsafeAttributes ) {
 			containerElement._unsafeAttributesToRender.push( ...options.renderUnsafeAttributes );
 		}
@@ -310,9 +299,6 @@ export default class DowncastWriter {
 	 * @param {String} name Name of the element.
 	 * @param {Object} [attributes] Elements attributes.
 	 * @param {Object} [options] Element's options.
-	 * @param {Boolean} [options.isAllowedInsideAttributeElement=true] Whether an element is
-	 * {@link module:engine/view/element~Element#isAllowedInsideAttributeElement allowed inside an AttributeElement} and can be wrapped
-	 * with {@link module:engine/view/attributeelement~AttributeElement} by {@link module:engine/view/downcastwriter~DowncastWriter}.
 	 * @param {Array.<String>} [options.renderUnsafeAttributes] A list of attribute names that should be rendered in the editing
 	 * pipeline even though they would normally be filtered out by unsafe attribute detection mechanisms.
 	 * @returns {module:engine/view/emptyelement~EmptyElement} Created element.
@@ -320,10 +306,6 @@ export default class DowncastWriter {
 	createEmptyElement( name, attributes, options = {} ) {
 		const emptyElement = new EmptyElement( this.document, name, attributes );
 
-		if ( options.isAllowedInsideAttributeElement !== undefined ) {
-			emptyElement._isAllowedInsideAttributeElement = options.isAllowedInsideAttributeElement;
-		}
-
 		if ( options.renderUnsafeAttributes ) {
 			emptyElement._unsafeAttributesToRender.push( ...options.renderUnsafeAttributes );
 		}
@@ -354,23 +336,15 @@ export default class DowncastWriter {
 	 * @param {String} name The name of the element.
 	 * @param {Object} [attributes] Element attributes.
 	 * @param {Function} [renderFunction] A custom render function.
-	 * @param {Object} [options] Element's options.
-	 * @param {Boolean} [options.isAllowedInsideAttributeElement=true] Whether an element is
-	 * {@link module:engine/view/element~Element#isAllowedInsideAttributeElement allowed inside an AttributeElement} and can be wrapped
-	 * with {@link module:engine/view/attributeelement~AttributeElement} by {@link module:engine/view/downcastwriter~DowncastWriter}.
 	 * @returns {module:engine/view/uielement~UIElement} The created element.
 	 */
-	createUIElement( name, attributes, renderFunction, options = {} ) {
+	createUIElement( name, attributes, renderFunction ) {
 		const uiElement = new UIElement( this.document, name, attributes );
 
 		if ( renderFunction ) {
 			uiElement.render = renderFunction;
 		}
 
-		if ( options.isAllowedInsideAttributeElement !== undefined ) {
-			uiElement._isAllowedInsideAttributeElement = options.isAllowedInsideAttributeElement;
-		}
-
 		return uiElement;
 	}
 
@@ -397,9 +371,6 @@ export default class DowncastWriter {
 	 * @param {Object} [attributes] Element attributes.
 	 * @param {Function} [renderFunction] A custom render function.
 	 * @param {Object} [options] Element's options.
-	 * @param {Boolean} [options.isAllowedInsideAttributeElement=true] Whether an element is
-	 * {@link module:engine/view/element~Element#isAllowedInsideAttributeElement allowed inside an AttributeElement} and can be wrapped
-	 * with {@link module:engine/view/attributeelement~AttributeElement} by {@link module:engine/view/downcastwriter~DowncastWriter}.
 	 * @param {Array.<String>} [options.renderUnsafeAttributes] A list of attribute names that should be rendered in the editing
 	 * pipeline even though they would normally be filtered out by unsafe attribute detection mechanisms.
 	 * @returns {module:engine/view/rawelement~RawElement} The created element.
@@ -409,10 +380,6 @@ export default class DowncastWriter {
 
 		rawElement.render = renderFunction || ( () => {} );
 
-		if ( options.isAllowedInsideAttributeElement !== undefined ) {
-			rawElement._isAllowedInsideAttributeElement = options.isAllowedInsideAttributeElement;
-		}
-
 		if ( options.renderUnsafeAttributes ) {
 			rawElement._unsafeAttributesToRender.push( ...options.renderUnsafeAttributes );
 		}
@@ -790,7 +757,7 @@ export default class DowncastWriter {
 
 			// Break attributes on nodes that do exist in the model tree so they can have attributes, other elements
 			// can't have an attribute in model and won't get wrapped with an AttributeElement while down-casted.
-			const breakAttributes = !( node.is( 'uiElement' ) && node.isAllowedInsideAttributeElement );
+			const breakAttributes = !node.is( 'uiElement' );
 
 			if ( !lastGroup || lastGroup.breakAttributes != breakAttributes ) {
 				groups.push( {
@@ -979,16 +946,6 @@ export default class DowncastWriter {
 	 * Throws {@link module:utils/ckeditorerror~CKEditorError} `view-writer-wrap-nonselection-collapsed-range` when passed range
 	 * is collapsed and different than view selection.
 	 *
-	 * **Note:** Attribute elements by default can wrap {@link module:engine/view/text~Text},
-	 * {@link module:engine/view/emptyelement~EmptyElement}, {@link module:engine/view/uielement~UIElement},
-	 * {@link module:engine/view/rawelement~RawElement} and other attribute elements with higher priority. Other elements while placed
-	 * inside an attribute element will split it (or nest it in case of an `AttributeElement`). This behavior can be modified by changing
-	 * the `isAllowedInsideAttributeElement` option while using
-	 * {@link module:engine/view/downcastwriter~DowncastWriter#createContainerElement},
-	 * {@link module:engine/view/downcastwriter~DowncastWriter#createEmptyElement},
-	 * {@link module:engine/view/downcastwriter~DowncastWriter#createUIElement} or
-	 * {@link module:engine/view/downcastwriter~DowncastWriter#createRawElement}.
-	 *
 	 * @param {module:engine/view/range~Range} range Range to wrap.
 	 * @param {module:engine/view/attributeelement~AttributeElement} attribute Attribute element to use as wrapper.
 	 * @returns {module:engine/view/range~Range} range Range after wrapping, spanning over wrapping attribute element.
@@ -1399,7 +1356,6 @@ export default class DowncastWriter {
 			const child = parent.getChild( i );
 			const isText = child.is( '$text' );
 			const isAttribute = child.is( 'attributeElement' );
-			const isAllowedInsideAttributeElement = child.isAllowedInsideAttributeElement;
 
 			//
 			// (In all examples, assume that `wrapElement` is `<span class="foo">` element.)
@@ -1418,7 +1374,7 @@ export default class DowncastWriter {
 			//
 			// <p>abc</p>                   -->  <p><span class="foo">abc</span></p>
 			// <p><strong>abc</strong></p>  -->  <p><span class="foo"><strong>abc</strong></span></p>
-			else if ( isText || isAllowedInsideAttributeElement || ( isAttribute && shouldABeOutsideB( wrapElement, child ) ) ) {
+			else if ( isText || !isAttribute || shouldABeOutsideB( wrapElement, child ) ) {
 				// Clone attribute.
 				const newAttribute = wrapElement._clone();
 
@@ -1436,7 +1392,7 @@ export default class DowncastWriter {
 			//
 			// <p><a href="foo.html">abc</a></p>  -->  <p><a href="foo.html"><span class="foo">abc</span></a></p>
 			//
-			else if ( isAttribute ) {
+			else /* if ( isAttribute ) */ {
 				this._wrapChildren( child, 0, child.childCount, wrapElement );
 			}
 

package/src/view/element.js

@@ -130,15 +130,6 @@ export default class Element extends Node {
 		 */
 		this._customProperties = new Map();
 
-		/**
-		 * Whether an element is allowed inside an AttributeElement and can be wrapped with
-		 * {@link module:engine/view/attributeelement~AttributeElement} by {@link module:engine/view/downcastwriter~DowncastWriter}.
-		 *
-		 * @protected
-		 * @member {Boolean}
-		 */
-		this._isAllowedInsideAttributeElement = false;
-
 		/**
 		 * A list of attribute names that should be rendered in the editing pipeline even though filtering mechanisms
 		 * implemented in the {@link module:engine/view/domconverter~DomConverter} (for instance,
@@ -175,17 +166,6 @@ export default class Element extends Node {
 		return this._children.length === 0;
 	}
 
-	/**
-	 * Whether the element is allowed inside an AttributeElement and can be wrapped with
-	 * {@link module:engine/view/attributeelement~AttributeElement} by {@link module:engine/view/downcastwriter~DowncastWriter}.
-	 *
-	 * @readonly
-	 * @type {Boolean}
-	 */
-	get isAllowedInsideAttributeElement() {
-		return this._isAllowedInsideAttributeElement;
-	}
-
 	/**
 	 * Checks whether this object is of the given.
 	 *
@@ -350,11 +330,6 @@ export default class Element extends Node {
 			return false;
 		}
 
-		// Check isAllowedInsideAttributeElement property.
-		if ( this.isAllowedInsideAttributeElement != otherElement.isAllowedInsideAttributeElement ) {
-			return false;
-		}
-
 		// Check number of attributes, classes and styles.
 		if ( this._attrs.size !== otherElement._attrs.size || this._classes.size !== otherElement._classes.size ||
 			this._styles.size !== otherElement._styles.size ) {
@@ -633,7 +608,8 @@ export default class Element extends Node {
 		// is changed by e.g. toWidget() function from ckeditor5-widget. Perhaps this should be one of custom props.
 		cloned.getFillerOffset = this.getFillerOffset;
 
-		cloned._isAllowedInsideAttributeElement = this.isAllowedInsideAttributeElement;
+		// Clone unsafe attributes list.
+		cloned._unsafeAttributesToRender = this._unsafeAttributesToRender;
 
 		return cloned;
 	}

package/src/view/emptyelement.js

@@ -37,9 +37,6 @@ export default class EmptyElement extends Element {
 	constructor( document, name, attrs, children ) {
 		super( document, name, attrs, children );
 
-		// Override the default of the base class.
-		this._isAllowedInsideAttributeElement = true;
-
 		/**
 		 * Returns `null` because filler is not needed for EmptyElements.
 		 *

package/src/view/filler.js

@@ -56,7 +56,7 @@ export const NBSP_FILLER = domDocument => domDocument.createTextNode( '\u00A0' )
 export const MARKED_NBSP_FILLER = domDocument => {
 	const span = domDocument.createElement( 'span' );
 	span.dataset.ckeFiller = true;
-	span.innerHTML = '\u00A0';
+	span.innerText = '\u00A0';
 
 	return span;
 };

package/src/view/matcher.js

@@ -739,7 +739,7 @@ function matchStyles( patterns, element ) {
  * 			styles: /^border.*$/
  * 		}
  *
- * Refer to the {@glink builds/guides/migration/migration-to-29##migration-to-ckeditor-5-v2910 Migration to v29.1.0} guide
+ * Refer to the {@glink updating/migration-to-29##migration-to-ckeditor-5-v2910 Migration to v29.1.0} guide
  * and {@link module:engine/view/matcher~MatcherPattern} documentation.
  *
  * @param {Object} pattern Pattern with missing properties.
@@ -769,7 +769,7 @@ function matchStyles( patterns, element ) {
  * 			classes: 'foobar'
  * 		}
  *
- * Refer to the {@glink builds/guides/migration/migration-to-29##migration-to-ckeditor-5-v2910 Migration to v29.1.0} guide
+ * Refer to the {@glink updating/migration-to-29##migration-to-ckeditor-5-v2910 Migration to v29.1.0} guide
  * and the {@link module:engine/view/matcher~MatcherPattern} documentation.
  *
  * @param {Object} pattern Pattern with missing properties.

package/src/view/observer/clickobserver.js

@@ -1,4 +1,3 @@
-
 /**
  * @license Copyright (c) 2003-2022, CKSource Holding sp. z o.o. All rights reserved.
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license

package/src/view/observer/inputobserver.js

@@ -1,6 +1,6 @@
 /**
  * @license Copyright (c) 2003-2022, CKSource Holding sp. z o.o. All rights reserved.
- * For licensing, see LICENSE.md.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
  */
 
 /**

package/src/view/observer/tabobserver.js

@@ -0,0 +1,68 @@
+/**
+ * @license Copyright (c) 2003-2022, CKSource Holding sp. z o.o. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+/**
+ * @module engine/view/observer/tabobserver
+ */
+
+import Observer from './observer';
+import BubblingEventInfo from './bubblingeventinfo';
+
+import { keyCodes } from '@ckeditor/ckeditor5-utils/src/keyboard';
+
+/**
+ * Tab observer introduces the {@link module:engine/view/document~Document#event:tab `Document#tab`} event.
+ *
+ * Note that because {@link module:engine/view/observer/tabobserver~TabObserver} is attached by the
+ * {@link module:engine/view/view~View}, this event is available by default.
+ *
+ * @extends module:engine/view/observer/observer~Observer
+ */
+export default class TabObserver extends Observer {
+	/**
+	 * @inheritDoc
+	 */
+	constructor( view ) {
+		super( view );
+
+		const doc = this.document;
+
+		doc.on( 'keydown', ( evt, data ) => {
+			if (
+				!this.isEnabled ||
+				data.keyCode != keyCodes.tab ||
+				data.ctrlKey
+			) {
+				return;
+			}
+
+			const event = new BubblingEventInfo( doc, 'tab', doc.selection.getFirstRange() );
+
+			doc.fire( event, data );
+
+			if ( event.stop.called ) {
+				evt.stop();
+			}
+		} );
+	}
+
+	/**
+	 * @inheritDoc
+	 */
+	observe() {}
+}
+
+/**
+ * Event fired when the user presses a tab key.
+ *
+ * Introduced by {@link module:engine/view/observer/tabobserver~TabObserver}.
+ *
+ * Note that because {@link module:engine/view/observer/tabobserver~TabObserver} is attached by the
+ * {@link module:engine/view/view~View}, this event is available by default.
+ *
+ * @event module:engine/view/document~Document#event:tab
+ *
+ * @param {module:engine/view/observer/domeventdata~DomEventData} data
+ */

package/src/view/placeholder.js

@@ -276,7 +276,7 @@ function getChildPlaceholderHostSubstitute( parent ) {
 	if ( parent.childCount ) {
 		const firstChild = parent.getChild( 0 );
 
-		if ( firstChild.is( 'element' ) && !firstChild.is( 'uiElement' ) ) {
+		if ( firstChild.is( 'element' ) && !firstChild.is( 'uiElement' ) && !firstChild.is( 'attributeElement' ) ) {
 			return firstChild;
 		}
 	}

package/src/view/rawelement.js

@@ -47,9 +47,6 @@ export default class RawElement extends Element {
 	constructor( document, name, attrs, children ) {
 		super( document, name, attrs, children );
 
-		// Override the default of the base class.
-		this._isAllowedInsideAttributeElement = true;
-
 		/**
 		 * Returns `null` because filler is not needed for raw elements.
 		 *

package/src/view/renderer.js

@@ -234,6 +234,10 @@ export default class Renderer {
 		else if ( this._inlineFiller && this._inlineFiller.parentNode ) {
 			// While the user is making selection, preserve the inline filler at its original position.
 			inlineFillerPosition = this.domConverter.domPositionToView( this._inlineFiller );
+
+			if ( inlineFillerPosition.parent.is( '$text' ) ) {
+				inlineFillerPosition = ViewPosition._createBefore( inlineFillerPosition.parent );
+			}
 		}
 
 		for ( const element of this.markedAttributes ) {

package/src/view/uielement.js

@@ -50,9 +50,6 @@ export default class UIElement extends Element {
 	constructor( document, name, attributes, children ) {
 		super( document, name, attributes, children );
 
-		// Override the default of the base class.
-		this._isAllowedInsideAttributeElement = true;
-
 		/**
 		 * Returns `null` because filler is not needed for UIElements.
 		 *

package/src/view/view.js

@@ -23,6 +23,7 @@ import FocusObserver from './observer/focusobserver';
 import CompositionObserver from './observer/compositionobserver';
 import InputObserver from './observer/inputobserver';
 import ArrowKeysObserver from './observer/arrowkeysobserver';
+import TabObserver from './observer/tabobserver';
 
 import ObservableMixin from '@ckeditor/ckeditor5-utils/src/observablemixin';
 import mix from '@ckeditor/ckeditor5-utils/src/mix';
@@ -54,6 +55,8 @@ import env from '@ckeditor/ckeditor5-utils/src/env';
  * * {@link module:engine/view/observer/keyobserver~KeyObserver},
  * * {@link module:engine/view/observer/fakeselectionobserver~FakeSelectionObserver}.
  * * {@link module:engine/view/observer/compositionobserver~CompositionObserver}.
+ * * {@link module:engine/view/observer/arrowkeysobserver~ArrowKeysObserver}.
+ * * {@link module:engine/view/observer/tabobserver~TabObserver}.
  *
  * This class also {@link module:engine/view/view~View#attachDomRoot binds the DOM and the view elements}.
  *
@@ -186,6 +189,7 @@ export default class View {
 		this.addObserver( FakeSelectionObserver );
 		this.addObserver( CompositionObserver );
 		this.addObserver( ArrowKeysObserver );
+		this.addObserver( TabObserver );
 
 		if ( env.isAndroid ) {
 			this.addObserver( InputObserver );