Class

DomEventObserver (engine/view/observer)

@ckeditor/ckeditor5-engine/src/view/observer/domeventobserver

class

Base class for DOM event observers. This class handles adding listeners to DOM elements, disabling and re-enabling events. Child class needs to define DOM event type and callback.

For instance:

class ClickObserver extends DomEventObserver {
	// It can also be defined as a normal property in the constructor.
	get domEventType() {
		return 'click';
	}

	onDomEvent( domEvent ) {
		this.fire( 'click', domEvent );
	}
}

Filtering

Properties

  • document : Document

    readonly inherited

    A reference to the Document object.

  • domEventType : String | Array.<String>

    readonly

    Type of the DOM event the observer should listen to. Array of types can be defined if the observer should listen to multiple DOM events.

  • isEnabled : Boolean

    readonly inherited

    State of the observer. If it is disabled no events will be fired.

  • useCapture : Boolean

    If set to true DOM events will be listened on the capturing phase. Default value is false.

  • view : View

    readonly inherited

    An instance of the view controller.

Methods

  • constructor( view )

    inherited

    Creates an instance of the observer.

    Parameters

    view : View
  • checkShouldIgnoreEventFromTarget( domTarget ) → Boolean

    inherited

    Checks whether a given DOM event should be ignored (should not be turned into a synthetic view document event).

    Currently, an event will be ignored only if its target or any of its ancestors has the data-cke-ignore-events attribute. This attribute can be used inside the structures generated by DowncastWriter#createUIElement() to ignore events fired within a UI that should be excluded from CKEditor 5's realms.

    Parameters

    domTarget : Node

    The DOM event target to check (usually an element, sometimes a text node and potentially sometimes a document, too).

    Returns

    Boolean

    Whether this event should be ignored by the observer.

  • destroy()

    inherited

    Disables and destroys the observer, among others removes event listeners created by the observer.

  • disable()

    inherited

    Disables the observer. This method is called before rendering to prevent firing events during rendering.

    Related:

  • enable()

    inherited

    Enables the observer. This method is called when the observer is registered to the View and after rendering (all observers are disabled before rendering).

    A typical use case for disabling observers is that mutation observers need to be disabled for the rendering. However, a child class may not need to be disabled, so it can implement an empty method.

    Related:

  • fire( eventType, domEvent, [ additionalData ] )

    Calls Document#fire() if observer is enabled.

    Parameters

    eventType : String

    The event type (name).

    domEvent : Event

    The DOM event.

    [ additionalData ] : Object

    The additional data which should extend the event data object.

    Related:

  • observe( domElement, name )

    inherited

    Starts observing the given root element.

    Parameters

    domElement : HTMLElement
    name : String

    The name of the root element.

  • onDomEvent()

    Callback which should be called when the DOM event occurred. Note that the callback will not be called if observer is not enabled.