浏览代码

Merge branch 'master' into t/266

Aleksander Nowodzinski 8 年之前
父节点
当前提交
8fff2a5f26
共有 2 个文件被更改,包括 69 次插入1 次删除
  1. 25 0
      packages/ckeditor5-ui/src/list/listitemview.js
  2. 44 1
      packages/ckeditor5-ui/tests/list/listitemview.js

+ 25 - 0
packages/ckeditor5-ui/src/list/listitemview.js

@@ -9,6 +9,7 @@
 
 import View from '../view';
 import Template from '../template';
+import KeystrokeHandler from '@ckeditor/ckeditor5-utils/src/keystrokehandler';
 
 /**
  * The list item view class.
@@ -31,6 +32,14 @@ export default class ListItemView extends View {
 		 */
 		this.set( 'tabindex', -1 );
 
+		/**
+		 * Instance of the {@link module:utils/keystrokehandler~KeystrokeHandler}.
+		 *
+		 * @readonly
+		 * @member {module:utils/keystrokehandler~KeystrokeHandler}
+		 */
+		this.keystrokes = new KeystrokeHandler();
+
 		const bind = this.bindTemplate;
 
 		this.template = new Template( {
@@ -93,6 +102,22 @@ export default class ListItemView extends View {
 	}
 
 	/**
+	 * @inheritDoc
+	 */
+	init() {
+		const onKeystrokePress = ( data, cancel ) => {
+			this.fire( 'execute' );
+			cancel();
+		};
+
+		this.keystrokes.listenTo( this.element );
+
+		// Execute on Enter and Space key press.
+		this.keystrokes.set( 'Enter', onKeystrokePress );
+		this.keystrokes.set( 'Space', onKeystrokePress );
+	}
+
+	/**
 	 * Focuses the list item.
 	 */
 	focus() {

+ 44 - 1
packages/ckeditor5-ui/tests/list/listitemview.js

@@ -3,9 +3,10 @@
  * For licensing, see LICENSE.md.
  */
 
-/* globals Event */
+/* global Event */
 
 import ListItemView from '../../src/list/listitemview';
+import KeystrokeHandler from '@ckeditor/ckeditor5-utils/src/keystrokehandler';
 
 describe( 'ListItemView', () => {
 	let view;
@@ -24,6 +25,48 @@ describe( 'ListItemView', () => {
 		it( 'creates element from template', () => {
 			expect( view.element.classList.contains( 'ck-list__item' ) ).to.be.true;
 		} );
+
+		it( 'should create #keystrokes instance', () => {
+			expect( view.keystrokes ).to.be.instanceOf( KeystrokeHandler );
+		} );
+	} );
+
+	describe( 'init()', () => {
+		it( 'starts listening for #keystrokes coming from #element', () => {
+			const spy = sinon.spy( view.keystrokes, 'listenTo' );
+
+			view.init();
+			sinon.assert.calledOnce( spy );
+			sinon.assert.calledWithExactly( spy, view.element );
+		} );
+
+		// https://github.com/ckeditor/ckeditor5-ui/issues/153
+		it( 'triggers view#execute event when Enter or Space key is pressed', () => {
+			const spy = sinon.spy();
+			const evtData = {
+				keyCode: 10,
+				preventDefault: sinon.spy(),
+				stopPropagation: sinon.spy()
+			};
+
+			view.on( 'execute', spy );
+			view.keystrokes.press( evtData );
+
+			sinon.assert.notCalled( spy );
+			sinon.assert.notCalled( evtData.preventDefault );
+
+			evtData.keyCode = 13;
+			view.keystrokes.press( evtData );
+
+			sinon.assert.calledOnce( spy );
+			sinon.assert.calledOnce( evtData.preventDefault );
+
+			evtData.keyCode = 32;
+			view.keystrokes.press( evtData );
+
+			sinon.assert.calledTwice( spy );
+			sinon.assert.calledTwice( evtData.preventDefault );
+		} );
 	} );
 
 	describe( 'DOM bindings', () => {