Feature: Added 'dragover' event to ClipboardObserver.

src/clipboardobserver.js

@@ -22,7 +22,7 @@ export default class ClipboardObserver extends DomEventObserver {
 	constructor( doc ) {
 		super( doc );
 
-		this.domEventType = [ 'paste', 'copy', 'cut', 'drop' ];
+		this.domEventType = [ 'paste', 'copy', 'cut', 'drop', 'dragover' ];
 
 		this.listenTo( doc, 'paste', handleInput, { priority: 'low' } );
 		this.listenTo( doc, 'drop', handleInput, { priority: 'low' } );
@@ -98,6 +98,20 @@ function getDropViewRange( doc, domEvent ) {
  * then it's the drop position (which can be different than the selection at the moment of drop).
  */
 
+/**
+ * Fired when user drags content over one of the editables.
+ *
+ * Introduced by {@link module:clipboard/clipboardobserver~ClipboardObserver}.
+ *
+ * Note that this event is not available by default. To make it available {@link module:clipboard/clipboardobserver~ClipboardObserver}
+ * needs to be added to {@link module:engine/view/document~Document} by the {@link module:engine/view/document~Document#addObserver} method.
+ * It's done by the {@link module:clipboard/clipboard~Clipboard} feature. If it's not loaded, it must be done manually.
+ *
+ * @see module:engine/view/document~Document#event:clipboardInput
+ * @event module:engine/view/document~Document#event:dragover
+ * @param {module:clipboard/clipboardobserver~ClipboardEventData} data Event data.
+ */
+
 /**
  * Fired when user dropped content into one of the editables.
  *

tests/clipboardobserver.js

@@ -36,7 +36,7 @@ describe( 'ClipboardObserver', () => {
 	} );
 
 	it( 'should define domEventType', () => {
-		expect( observer.domEventType ).to.deep.equal( [ 'paste', 'copy', 'cut', 'drop' ] );
+		expect( observer.domEventType ).to.deep.equal( [ 'paste', 'copy', 'cut', 'drop', 'dragover' ] );
 	} );
 
 	describe( 'paste event', () => {
@@ -224,6 +224,30 @@ describe( 'ClipboardObserver', () => {
 			expect( sinon.assert.callOrder( normalPrioritySpy, eventSpy ) );
 		} );
 	} );
+
+	describe( 'dragover event', () => {
+		it( 'should fire when a file is dragging over the document', () => {
+			const targetElement = mockDomTargetElement( {} );
+			const dataTransfer = mockDomDataTransfer();
+
+			doc.on( 'dragover', eventSpy );
+
+			observer.onDomEvent( {
+				type: 'dragover',
+				target: targetElement,
+				dataTransfer
+			} );
+
+			expect( eventSpy.calledOnce ).to.equal( true );
+
+			const data = eventSpy.args[ 0 ][ 1 ];
+
+			expect( data.document ).to.equal( doc );
+			expect( data.domTarget ).to.equal( targetElement );
+			expect( data.domEvent.type ).to.equal( 'dragover' );
+			expect( data.dataTransfer.files ).to.deep.equal( dataTransfer.files );
+		} );
+	} );
 } );
 
 // Returns a super simple mock of HTMLElement (we use only ownerDocument from it).