foo
-> 1 // Length of an element which is mapped is by default equal to 1. foo -> 3 // Length of an element which is not mapped is a length of its children.x
y
are mapped.
```
[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-engine/src/conversion/mapper.ts#L582)
#### Parameters
* `viewNode: ViewNode | ViewDocumentFragment`
View node.
#### Returns
* `number`
Length of the node in the tree model.
### `listenTo( emitter, event, callback, options? ) → void` _(inherited)_
Registers a callback function to be executed when an event is fired in a specific (emitter) object.
Events can be grouped in namespaces using `:`. When namespaced event is fired, it additionally fires all callbacks for that namespace.
```typescript
// myEmitter.on( ... ) is a shorthand for myEmitter.listenTo( myEmitter, ... ).
myEmitter.on( 'myGroup', genericCallback );
myEmitter.on( 'myGroup:myEvent', specificCallback );
// genericCallback is fired.
myEmitter.fire( 'myGroup' );
// both genericCallback and specificCallback are fired.
myEmitter.fire( 'myGroup:myEvent' );
// genericCallback is fired even though there are no callbacks for "foo".
myEmitter.fire( 'myGroup:foo' );
```
An event callback can [stop the event](module_utils_eventinfo-EventInfo.md#member-stop) and set the [return value](module_utils_eventinfo-EventInfo.md#member-return) of the [`fire`](#function-fire) method.
[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-utils/src/emittermixin.ts#L475)
#### Type parameters
* `TEvent: extends BaseEvent`
The type describing the event. See [`BaseEvent`](module_utils_emittermixin-BaseEvent.md).
#### Parameters
* `emitter: Emitter`
The object that fires the event.
* `event: TEvent[ 'name' ]`
The name of the event.
* `callback: GetCallback fobarbom |fobarbom fo|barbom fobar|bom fo|barbom fobar|bom foba|rbom []foo []foo foo[]foo foo{}foo []foo {}foo fooba|r foo|bar fooba|r and following elements in view,
// and the model element is bound to
element. Force mapping model positions inside "captionedImage" to that
// element.
mapper.on( 'modelToViewPosition', ( evt, data ) => {
const positionParent = modelPosition.parent;
if ( positionParent.name == 'captionedImage' ) {
const viewImg = data.mapper.toViewElement( positionParent );
const viewCaption = viewImg.nextSibling; // The element.
data.viewPosition = new ViewPosition( viewCaption, modelPosition.offset );
// Stop the event if other callbacks should not modify calculated value.
evt.stop();
}
} );
```
**Note:** keep in mind that sometimes a "phantom" model position is being converted. A "phantom" model position is a position that points to a nonexistent place in model. Such a position might still be valid for conversion, though (it would point to a correct place in the view when converted). One example of such a situation is when a range is removed from the model, there may be a need to map the range's end (which is no longer a valid model position). To handle such situations, check the `data.isPhantom` flag:
```typescript
// Assume that there is a "customElement" model element and whenever the position is before it,
// we want to move it to the inside of the view element bound to "customElement".
mapper.on( 'modelToViewPosition', ( evt, data ) => {
if ( data.isPhantom ) {
return;
}
// Below line might crash for phantom position that does not exist in model.
const sibling = data.modelPosition.nodeBefore;
// Check if this is the element we are interested in.
if ( !sibling.is( 'element', 'customElement' ) ) {
return;
}
const viewElement = data.mapper.toViewElement( sibling );
data.viewPosition = new ViewPosition( sibling, 0 );
evt.stop();
} );
```
**Note:** the default mapping callback is provided with a `low` priority setting and does not cancel the event, so it is possible to attach a custom callback after a default callback and also use `data.viewPosition` calculated by the default callback (for example to fix it).
**Note:** the default mapping callback will not fire if `data.viewPosition` is already set.
**Note:** these callbacks are called **very often**. For efficiency reasons, it is advised to use them only when position mapping between the given model and view elements is unsolvable by using just elements mapping and default algorithm. Also, the condition that checks if a special case scenario happened should be as simple as possible.
[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-engine/src/conversion/mapper.ts#L1330)
#### Parameters
* `eventInfo: EventInfo`
An object containing information about the fired event.
* `
to the "captionedImage" element.
mapper.on( 'viewToModelPosition', ( evt, data ) => {
const positionParent = viewPosition.parent;
if ( positionParent.hasClass( 'image-caption' ) ) {
const viewImg = positionParent.previousSibling;
const modelImg = data.mapper.toModelElement( viewImg );
data.modelPosition = new ModelPosition( modelImg, viewPosition.offset );
evt.stop();
}
} );
```
**Note:** the default mapping callback is provided with a `low` priority setting and does not cancel the event, so it is possible to attach a custom callback after the default callback and also use `data.modelPosition` calculated by the default callback (for example to fix it).
**Note:** the default mapping callback will not fire if `data.modelPosition` is already set.
**Note:** these callbacks are called **very often**. For efficiency reasons, it is advised to use them only when position mapping between the given model and view elements is unsolvable by using just elements mapping and default algorithm. Also, the condition that checks if special case scenario happened should be as simple as possible.
[See source](https://github.com/ckeditor/ckeditor5/blob/master/packages/ckeditor5-engine/src/conversion/mapper.ts#L1395)
#### Parameters
* `eventInfo: EventInfo`
An object containing information about the fired event.
* `