@ckeditor/ckeditor5-utils 31.0.0 → 31.1.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ckeditor/ckeditor5-utils",
-  "version": "31.0.0",
+  "version": "31.1.0",
   "description": "Miscellaneous utilities used by CKEditor 5.",
   "keywords": [
     "ckeditor",
@@ -14,12 +14,10 @@
     "lodash-es": "^4.17.15"
   },
   "devDependencies": {
-    "@ckeditor/ckeditor5-build-classic": "^31.0.0",
-    "@ckeditor/ckeditor5-editor-classic": "^31.0.0",
-    "@ckeditor/ckeditor5-core": "^31.0.0",
-    "@ckeditor/ckeditor5-engine": "^31.0.0",
-    "assertion-error": "^1.1.0",
-    "js-beautify": "^1.11.0"
+    "@ckeditor/ckeditor5-build-classic": "^31.1.0",
+    "@ckeditor/ckeditor5-editor-classic": "^31.1.0",
+    "@ckeditor/ckeditor5-core": "^31.1.0",
+    "@ckeditor/ckeditor5-engine": "^31.1.0"
   },
   "engines": {
     "node": ">=12.0.0",

package/src/dom/emittermixin.js

@@ -52,19 +52,21 @@ const DomEmitterMixin = extend( {}, EmitterMixin, {
 	 * @param {Boolean} [options.usePassive=false] Indicates that the function specified by listener will never call preventDefault()
 	 * and prevents blocking browser's main thread by this event handler.
 	 */
-	listenTo( emitter, ...rest ) {
-		// Check if emitter is an instance of DOM Node. If so, replace the argument with
-		// corresponding ProxyEmitter (or create one if not existing).
+	listenTo( emitter, event, callback, options = {} ) {
+		// Check if emitter is an instance of DOM Node. If so, use corresponding ProxyEmitter (or create one if not existing).
 		if ( isNode( emitter ) || isWindow( emitter ) ) {
-			const proxy = this._getProxyEmitter( emitter ) || new ProxyEmitter( emitter );
+			const proxyOptions = {
+				capture: !!options.useCapture,
+				passive: !!options.usePassive
+			};
 
-			proxy.attach( ...rest );
+			const proxyEmitter = this._getProxyEmitter( emitter, proxyOptions ) || new ProxyEmitter( emitter, proxyOptions );
 
-			emitter = proxy;
+			this.listenTo( proxyEmitter, event, callback, options );
+		} else {
+			// Execute parent class method with Emitter (or ProxyEmitter) instance.
+			EmitterMixin.listenTo.call( this, emitter, event, callback, options );
 		}
-
-		// Execute parent class method with Emitter (or ProxyEmitter) instance.
-		EmitterMixin.listenTo.call( this, emitter, ...rest );
 	},
 
 	/**
@@ -83,35 +85,49 @@ const DomEmitterMixin = extend( {}, EmitterMixin, {
 	 * `event`.
 	 */
 	stopListening( emitter, event, callback ) {
-		// Check if emitter is an instance of DOM Node. If so, replace the argument with corresponding ProxyEmitter.
+		// Check if the emitter is an instance of DOM Node. If so, forward the call to the corresponding ProxyEmitters.
 		if ( isNode( emitter ) || isWindow( emitter ) ) {
-			const proxy = this._getProxyEmitter( emitter );
+			const proxyEmitters = this._getAllProxyEmitters( emitter );
 
-			// Element has no listeners.
-			if ( !proxy ) {
-				return;
+			for ( const proxy of proxyEmitters ) {
+				this.stopListening( proxy, event, callback );
 			}
-
-			emitter = proxy;
+		} else {
+			// Execute parent class method with Emitter (or ProxyEmitter) instance.
+			EmitterMixin.stopListening.call( this, emitter, event, callback );
 		}
+	},
 
-		// Execute parent class method with Emitter (or ProxyEmitter) instance.
-		EmitterMixin.stopListening.call( this, emitter, event, callback );
-
-		if ( emitter instanceof ProxyEmitter ) {
-			emitter.detach( event );
-		}
+	/**
+	 * Retrieves ProxyEmitter instance for given DOM Node residing in this Host and given options.
+	 *
+	 * @private
+	 * @param {Node} node DOM Node of the ProxyEmitter.
+	 * @param {Object} [options] Additional options.
+	 * @param {Boolean} [options.useCapture=false] Indicates that events of this type will be dispatched to the registered
+	 * listener before being dispatched to any EventTarget beneath it in the DOM tree.
+	 * @param {Boolean} [options.usePassive=false] Indicates that the function specified by listener will never call preventDefault()
+	 * and prevents blocking browser's main thread by this event handler.
+	 * @returns {module:utils/dom/emittermixin~ProxyEmitter|null} ProxyEmitter instance bound to the DOM Node.
+	 */
+	_getProxyEmitter( node, options ) {
+		return _getEmitterListenedTo( this, getProxyEmitterId( node, options ) );
 	},
 
 	/**
-	 * Retrieves ProxyEmitter instance for given DOM Node residing in this Host.
+	 * Retrieves all the ProxyEmitter instances for given DOM Node residing in this Host.
 	 *
 	 * @private
 	 * @param {Node} node DOM Node of the ProxyEmitter.
-	 * @returns {module:utils/dom/emittermixin~ProxyEmitter} ProxyEmitter instance or null.
+	 * @returns {Array.<module:utils/dom/emittermixin~ProxyEmitter>}
 	 */
-	_getProxyEmitter( node ) {
-		return _getEmitterListenedTo( this, getNodeUID( node ) );
+	_getAllProxyEmitters( node ) {
+		return [
+			{ capture: false, passive: false },
+			{ capture: false, passive: true },
+			{ capture: true, passive: false },
+			{ capture: true, passive: true }
+		].map( options => this._getProxyEmitter( node, options ) ).filter( proxy => !!proxy );
 	}
 } );
 
@@ -120,6 +136,8 @@ export default DomEmitterMixin;
 /**
  * Creates a ProxyEmitter instance. Such an instance is a bridge between a DOM Node firing events
  * and any Host listening to them. It is backwards compatible with {@link module:utils/emittermixin~EmitterMixin#on}.
+ * There is a separate instance for each combination of modes (useCapture & usePassive). The mode is concatenated with
+ * UID stored in HTMLElement to give each instance unique identifier.
  *
  *                                  listenTo( click, ... )
  *                    +-----------------------------------------+
@@ -128,14 +146,14 @@ export default DomEmitterMixin;
  *     | Host                       |                           |   +---------------------------------------------+
  *     +----------------------------+                           |   |       removeEventListener( click, ... )     |
  *     | _listeningTo: {            |                +----------v-------------+                                   |
- *     |   UID: {                   |                | ProxyEmitter           |                                   |
+ *     |   UID+mode: {              |                | ProxyEmitter           |                                   |
  *     |     emitter: ProxyEmitter, |                +------------------------+                      +------------v----------+
  *     |     callbacks: {           |                | events: {              |                      | Node (HTMLElement)    |
  *     |       click: [ callbacks ] |                |   click: [ callbacks ] |                      +-----------------------+
  *     |     }                      |                | },                     |                      | data-ck-expando: UID  |
  *     |   }                        |                | _domNode: Node,        |                      +-----------------------+
  *     | }                          |                | _domListeners: {},     |                                   |
- *     | +------------------------+ |                | _emitterId: UID        |                                   |
+ *     | +------------------------+ |                | _emitterId: UID+mode   |                                   |
  *     | | DomEmitterMixin        | |                +--------------^---------+                                   |
  *     | +------------------------+ |                           |   |                                             |
  *     +--------------^-------------+                           |   +---------------------------------------------+
@@ -150,14 +168,21 @@ export default DomEmitterMixin;
 class ProxyEmitter {
 	/**
 	 * @param {Node} node DOM Node that fires events.
-	 * @returns {Object} ProxyEmitter instance bound to the DOM Node.
+	 * @param {Object} [options] Additional options.
+	 * @param {Boolean} [options.useCapture=false] Indicates that events of this type will be dispatched to the registered
+	 * listener before being dispatched to any EventTarget beneath it in the DOM tree.
+	 * @param {Boolean} [options.usePassive=false] Indicates that the function specified by listener will never call preventDefault()
+	 * and prevents blocking browser's main thread by this event handler.
 	 */
-	constructor( node ) {
+	constructor( node, options ) {
 		// Set emitter ID to match DOM Node "expando" property.
-		_setEmitterId( this, getNodeUID( node ) );
+		_setEmitterId( this, getProxyEmitterId( node, options ) );
 
 		// Remember the DOM Node this ProxyEmitter is bound to.
 		this._domNode = node;
+
+		// And given options.
+		this._options = options;
 	}
 }
 
@@ -175,31 +200,23 @@ extend( ProxyEmitter.prototype, EmitterMixin, {
 	 * It attaches a native DOM listener to the DOM Node. When fired,
 	 * a corresponding Emitter event will also fire with DOM Event object as an argument.
 	 *
+	 * **Note**: This is automatically called by the
+	 * {@link module:utils/emittermixin~EmitterMixin#listenTo `EmitterMixin#listenTo()`}.
+	 *
 	 * @method module:utils/dom/emittermixin~ProxyEmitter#attach
 	 * @param {String} event The name of the event.
-	 * @param {Function} callback The function to be called on event.
-	 * @param {Object} [options={}] Additional options.
-	 * @param {Boolean} [options.useCapture=false] Indicates that events of this type will be dispatched to the registered
-	 * listener before being dispatched to any EventTarget beneath it in the DOM tree.
-	 * @param {Boolean} [options.usePassive=false] Indicates that the function specified by listener will never call preventDefault()
-	 * and prevents blocking browser's main thread by this event handler.
 	 */
-	attach( event, callback, options = {} ) {
+	attach( event ) {
 		// If the DOM Listener for given event already exist it is pointless
 		// to attach another one.
 		if ( this._domListeners && this._domListeners[ event ] ) {
 			return;
 		}
 
-		const listenerOptions = {
-			capture: !!options.useCapture,
-			passive: !!options.usePassive
-		};
-
-		const domListener = this._createDomListener( event, listenerOptions );
+		const domListener = this._createDomListener( event );
 
 		// Attach the native DOM listener to DOM Node.
-		this._domNode.addEventListener( event, domListener, listenerOptions );
+		this._domNode.addEventListener( event, domListener, this._options );
 
 		if ( !this._domListeners ) {
 			this._domListeners = {};
@@ -213,6 +230,9 @@ extend( ProxyEmitter.prototype, EmitterMixin, {
 	/**
 	 * Stops executing the callback on the given event.
 	 *
+	 * **Note**: This is automatically called by the
+	 * {@link module:utils/emittermixin~EmitterMixin#stopListening `EmitterMixin#stopListening()`}.
+	 *
 	 * @method module:utils/dom/emittermixin~ProxyEmitter#detach
 	 * @param {String} event The name of the event.
 	 */
@@ -228,6 +248,36 @@ extend( ProxyEmitter.prototype, EmitterMixin, {
 		}
 	},
 
+	/**
+	 * Adds callback to emitter for given event.
+	 *
+	 * @protected
+	 * @method module:utils/dom/emittermixin~ProxyEmitter#_addEventListener
+	 * @param {String} event The name of the event.
+	 * @param {Function} callback The function to be called on event.
+	 * @param {Object} [options={}] Additional options.
+	 * @param {module:utils/priorities~PriorityString|Number} [options.priority='normal'] The priority of this event callback. The higher
+	 * the priority value the sooner the callback will be fired. Events having the same priority are called in the
+	 * order they were added.
+	 */
+	_addEventListener( event, callback, options ) {
+		this.attach( event );
+		EmitterMixin._addEventListener.call( this, event, callback, options );
+	},
+
+	/**
+	 * Removes callback from emitter for given event.
+	 *
+	 * @protected
+	 * @method module:utils/dom/emittermixin~ProxyEmitter#_removeEventListener
+	 * @param {String} event The name of the event.
+	 * @param {Function} callback The function to stop being called.
+	 */
+	_removeEventListener( event, callback ) {
+		EmitterMixin._removeEventListener.call( this, event, callback );
+		this.detach( event );
+	},
+
 	/**
 	 * Creates a native DOM listener callback. When the native DOM event
 	 * is fired it will fire corresponding event on this ProxyEmitter.
@@ -236,13 +286,9 @@ extend( ProxyEmitter.prototype, EmitterMixin, {
 	 * @private
 	 * @method module:utils/dom/emittermixin~ProxyEmitter#_createDomListener
 	 * @param {String} event The name of the event.
-	 * @param {Object} [options] Additional options.
-	 * @param {Boolean} [options.capture=false] Indicates whether the listener was created for capturing event.
-	 * @param {Boolean} [options.passive=false] Indicates that the function specified by listener will never call preventDefault()
-	 * and prevents blocking browser's main thread by this event handler.
 	 * @returns {Function} The DOM listener callback.
 	 */
-	_createDomListener( event, options ) {
+	_createDomListener( event ) {
 		const domListener = domEvt => {
 			this.fire( event, domEvt );
 		};
@@ -251,7 +297,7 @@ extend( ProxyEmitter.prototype, EmitterMixin, {
 		// detach it from the DOM Node, when it is no longer necessary.
 		// See: {@link detach}.
 		domListener.removeListener = () => {
-			this._domNode.removeEventListener( event, domListener, options );
+			this._domNode.removeEventListener( event, domListener, this._options );
 			delete this._domListeners[ event ];
 		};
 
@@ -268,6 +314,26 @@ function getNodeUID( node ) {
 	return node[ 'data-ck-expando' ] || ( node[ 'data-ck-expando' ] = uid() );
 }
 
+// Gets id of the ProxyEmitter for the given node.
+//
+// Combines DOM Node identifier and additional options.
+//
+// @private
+// @param {Node} node
+// @param {Object} options Additional options.
+// @returns {String} ProxyEmitter id.
+function getProxyEmitterId( node, options ) {
+	let id = getNodeUID( node );
+
+	for ( const option of Object.keys( options ).sort() ) {
+		if ( options[ option ] ) {
+			id += '-' + option;
+		}
+	}
+
+	return id;
+}
+
 /**
  * Interface representing classes which mix in {@link module:utils/dom/emittermixin~EmitterMixin}.
  *

package/src/env.js

@@ -25,6 +25,14 @@ const env = {
 	 */
 	isMac: isMac( userAgent ),
 
+	/**
+	 * Indicates that the application is running on Windows.
+	 *
+	 * @static
+	 * @type {Boolean}
+	 */
+	isWindows: isWindows( userAgent ),
+
 	/**
 	 * Indicates that the application is running in Firefox (Gecko).
 	 *
@@ -41,6 +49,14 @@ const env = {
 	 */
 	isSafari: isSafari( userAgent ),
 
+	/**
+	 * Indicates the the application is running in iOS.
+	 *
+	 * @static
+	 * @type {Boolean}
+	 */
+	isiOS: isiOS( userAgent ),
+
 	/**
 	 * Indicates that the application is running on Android mobile device.
 	 *
@@ -87,6 +103,16 @@ export function isMac( userAgent ) {
 	return userAgent.indexOf( 'macintosh' ) > -1;
 }
 
+/**
+ * Checks if User Agent represented by the string is running on Windows.
+ *
+ * @param {String} userAgent **Lowercase** `navigator.userAgent` string.
+ * @returns {Boolean} Whether User Agent is running on Windows or not.
+ */
+export function isWindows( userAgent ) {
+	return userAgent.indexOf( 'windows' ) > -1;
+}
+
 /**
  * Checks if User Agent represented by the string is Firefox (Gecko).
  *
@@ -107,6 +133,17 @@ export function isSafari( userAgent ) {
 	return userAgent.indexOf( ' applewebkit/' ) > -1 && userAgent.indexOf( 'chrome' ) === -1;
 }
 
+/**
+ * Checks if User Agent represented by the string is running in iOS.
+ *
+ * @param {String} userAgent **Lowercase** `navigator.userAgent` string.
+ * @returns {Boolean} Whether User Agent is running in iOS or not.
+ */
+export function isiOS( userAgent ) {
+	// "Request mobile site" || "Request desktop site".
+	return !!userAgent.match( /iphone|ipad/i ) || ( isMac( userAgent ) && navigator.maxTouchPoints > 0 );
+}
+
 /**
  * Checks if User Agent represented by the string is Android mobile device.
  *

package/src/version.js

@@ -11,7 +11,7 @@
 
 import CKEditorError from './ckeditorerror';
 
-const version = '31.0.0';
+const version = '31.1.0';
 
 export default version;