Răsfoiți Sursa

Created preventDefault() utility that prevents default of native DOM events if event target equals view#element.

Aleksander Nowodzinski 8 ani în urmă
părinte
comite
b7add081bc

+ 23 - 0
packages/ckeditor5-ui/src/bindings/preventdefault.js

@@ -0,0 +1,23 @@
+/**
+ * @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md.
+ */
+
+/**
+ * @module ui/bindings/preventdefault
+ */
+
+/**
+ * Returns a {module:ui/template~TemplateToBinding} resulting in a native `event#preventDefault`
+ * for the DOM event if `event#target` equals {@link module:ui/view~View#element}.
+ *
+ * @param {module:ui/view~View} view View instance that uses the template.
+ * @returns {module:ui/template~TemplateToBinding}
+ */
+export default function preventDefault( view ) {
+	return view.bindTemplate.to( evt => {
+		if ( evt.target === view.element ) {
+			evt.preventDefault();
+		}
+	} );
+}

+ 63 - 0
packages/ckeditor5-ui/tests/bindings/preventdefault.js

@@ -0,0 +1,63 @@
+/**
+ * @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md.
+ */
+
+/* global Event */
+
+import preventDefault from '../../src/bindings/preventdefault';
+import View from '../../src/view';
+import Template from '../../src/template';
+
+describe( 'preventDefault', () => {
+	it( 'prevents default of a native DOM event', () => {
+		const view = new View();
+
+		view.template = new Template( {
+			tag: 'div',
+
+			on: {
+				foo: preventDefault( view )
+			}
+		} );
+
+		const evt = new Event( 'foo', { bubbles: true } );
+		const spy = sinon.spy( evt, 'preventDefault' );
+
+		// Render to enable bubbling.
+		view.element;
+
+		view.element.dispatchEvent( evt );
+		sinon.assert.calledOnce( spy );
+	} );
+
+	it( 'prevents only when target is view#element', () => {
+		const view = new View();
+		const child = new View();
+
+		child.template = new Template( {
+			tag: 'a'
+		} );
+
+		view.template = new Template( {
+			tag: 'div',
+
+			on: {
+				foo: preventDefault( view )
+			},
+
+			children: [
+				child
+			]
+		} );
+
+		const evt = new Event( 'foo', { bubbles: true } );
+		const spy = sinon.spy( evt, 'preventDefault' );
+
+		// Render to enable bubbling.
+		view.element;
+
+		child.element.dispatchEvent( evt );
+		sinon.assert.notCalled( spy );
+	} );
+} );