Merge pull request #1753 from ckeditor/t/ckeditor5-typing/167

Feature: Added `view.Document#event:beforeinput`.

src/view/observer/inputobserver.js

@@ -0,0 +1,44 @@
+/**
+ * @license Copyright (c) 2003-2018, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md.
+ */
+
+/**
+ * @module engine/view/observer/inputobserver
+ */
+
+import DomEventObserver from './domeventobserver';
+
+/**
+ * Observer for events connected with data input.
+ *
+ * Note that this observer is attached by the {@link module:engine/view/view~View} and is available by default.
+ *
+ * @extends module:engine/view/observer/domeventobserver~DomEventObserver
+ */
+export default class InputObserver extends DomEventObserver {
+	constructor( view ) {
+		super( view );
+
+		this.domEventType = [ 'beforeinput' ];
+	}
+
+	onDomEvent( domEvent ) {
+		this.fire( domEvent.type, domEvent );
+	}
+}
+
+/**
+ * Fired before browser inputs (or deletes) some data.
+ *
+ * This event is available only on browsers which support DOM `beforeinput` event.
+ *
+ * Introduced by {@link module:engine/view/observer/inputobserver~InputObserver}.
+ *
+ * Note that because {@link module:engine/view/observer/inputobserver~InputObserver} is attached by the
+ * {@link module:engine/view/view~View} this event is available by default.
+ *
+ * @see module:engine/view/observer/inputobserver~InputObserver
+ * @event module:engine/view/document~Document#event:beforeinput
+ * @param {module:engine/view/observer/domeventdata~DomEventData} data Event data.
+ */

src/view/observer/keyobserver.js

@@ -11,7 +11,7 @@ import DomEventObserver from './domeventobserver';
 import { getCode } from '@ckeditor/ckeditor5-utils/src/keyboard';
 
 /**
- * {@link module:engine/view/document~Document#event:keydown Key down} event observer.
+ * Observer for events connected with pressing keyboard keys.
  *
  * Note that this observer is attached by the {@link module:engine/view/view~View} and is available by default.
  *

src/view/view.js

@@ -21,6 +21,7 @@ import FakeSelectionObserver from './observer/fakeselectionobserver';
 import SelectionObserver from './observer/selectionobserver';
 import FocusObserver from './observer/focusobserver';
 import CompositionObserver from './observer/compositionobserver';
+import InputObserver from './observer/inputobserver';
 
 import ObservableMixin from '@ckeditor/ckeditor5-utils/src/observablemixin';
 import log from '@ckeditor/ckeditor5-utils/src/log';
@@ -172,6 +173,7 @@ export default class View {
 		this.addObserver( KeyObserver );
 		this.addObserver( FakeSelectionObserver );
 		this.addObserver( CompositionObserver );
+		this.addObserver( InputObserver );
 
 		// Inject quirks handlers.
 		injectQuirksHandling( this );

tests/view/observer/inputobserver.js

@@ -0,0 +1,40 @@
+/**
+ * @license Copyright (c) 2003-2019, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
+ */
+
+import InputObserver from '../../../src/view/observer/inputobserver';
+import View from '../../../src/view/view';
+
+describe( 'InputObserver', () => {
+	let view, viewDocument, observer;
+
+	beforeEach( () => {
+		view = new View();
+		viewDocument = view.document;
+		observer = view.getObserver( InputObserver );
+	} );
+
+	afterEach( () => {
+		view.destroy();
+	} );
+
+	it( 'should define domEventType', () => {
+		expect( observer.domEventType ).to.contains( 'beforeinput' );
+	} );
+
+	it( 'should fire beforeinput with dom event data', () => {
+		const spy = sinon.spy();
+
+		viewDocument.on( 'beforeinput', spy );
+
+		const domEvtData = {
+			type: 'beforeinput'
+		};
+
+		observer.onDomEvent( domEvtData );
+
+		expect( spy.calledOnce ).to.be.true;
+		expect( spy.args[ 0 ][ 1 ].domEvent ).to.equal( domEvtData );
+	} );
+} );

tests/view/view/view.js

@@ -9,6 +9,7 @@ import View from '../../../src/view/view';
 import Observer from '../../../src/view/observer/observer';
 import MutationObserver from '../../../src/view/observer/mutationobserver';
 import KeyObserver from '../../../src/view/observer/keyobserver';
+import InputObserver from '../../../src/view/observer/inputobserver';
 import FakeSelectionObserver from '../../../src/view/observer/fakeselectionobserver';
 import SelectionObserver from '../../../src/view/observer/selectionobserver';
 import FocusObserver from '../../../src/view/observer/focusobserver';
@@ -28,7 +29,7 @@ import createElement from '@ckeditor/ckeditor5-utils/src/dom/createelement';
 import testUtils from '@ckeditor/ckeditor5-core/tests/_utils/utils';
 
 describe( 'view', () => {
-	const DEFAULT_OBSERVERS_COUNT = 6;
+	const DEFAULT_OBSERVERS_COUNT = 7;
 	let domRoot, view, viewDocument, ObserverMock, instantiated, enabled, ObserverMockGlobalCount;
 
 	testUtils.createSinonSandbox();
@@ -85,6 +86,7 @@ describe( 'view', () => {
 		expect( view.getObserver( KeyObserver ) ).to.be.instanceof( KeyObserver );
 		expect( view.getObserver( FakeSelectionObserver ) ).to.be.instanceof( FakeSelectionObserver );
 		expect( view.getObserver( CompositionObserver ) ).to.be.instanceof( CompositionObserver );
+		expect( view.getObserver( InputObserver ) ).to.be.instanceof( InputObserver );
 	} );
 
 	describe( 'attachDomRoot()', () => {