Merge pull request #1446 from ckeditor/t/1445

Feature: Introduced `ViewDocument#layoutChanged` event. Closes #1445.

src/view/document.js

@@ -140,6 +140,14 @@ export default class Document {
 			}
 		} while ( wasFixed );
 	}
+
+	/**
+	 * Event fired whenever document content layout changes. It is fired whenever content is
+	 * {@link module:engine/view/view~View#event:render rendered}, but should be also fired by observers in case of
+	 * other actions which may change layout, for instance when image loads.
+	 *
+	 * @event module:engine/view/document~Document#event:layoutChanged
+	 */
 }
 
 mix( Document, ObservableMixin );

src/view/view.js

@@ -149,6 +149,9 @@ export default class View {
 		// Use 'normal' priority so that rendering is performed as first when using that priority.
 		this.on( 'render', () => {
 			this._render();
+
+			// Informs that layout has changed after render.
+			this.document.fire( 'layoutChanged' );
 		} );
 	}
 

tests/view/view/view.js

@@ -1,25 +1,25 @@
 /* globals document */
 
 import View from '../../../src/view/view';
+import Observer from '../../../src/view/observer/observer';
 import MutationObserver from '../../../src/view/observer/mutationobserver';
-import count from '@ckeditor/ckeditor5-utils/src/count';
 import KeyObserver from '../../../src/view/observer/keyobserver';
 import FakeSelectionObserver from '../../../src/view/observer/fakeselectionobserver';
 import SelectionObserver from '../../../src/view/observer/selectionobserver';
 import FocusObserver from '../../../src/view/observer/focusobserver';
 import CompositionObserver from '../../../src/view/observer/compositionobserver';
-import createViewRoot from '../_utils/createroot';
-import Observer from '../../../src/view/observer/observer';
-import log from '@ckeditor/ckeditor5-utils/src/log';
-import testUtils from '@ckeditor/ckeditor5-core/tests/_utils/utils';
-import global from '@ckeditor/ckeditor5-utils/src/dom/global';
 import ViewRange from '../../../src/view/range';
-import RootEditableElement from '../../../src/view/rooteditableelement';
 import ViewElement from '../../../src/view/element';
 import ViewPosition from '../../../src/view/position';
 import { isBlockFiller, BR_FILLER } from '../../../src/view/filler';
-import createElement from '@ckeditor/ckeditor5-utils/src/dom/createelement';
 import CKEditorError from '@ckeditor/ckeditor5-utils/src/ckeditorerror';
+import log from '@ckeditor/ckeditor5-utils/src/log';
+
+import count from '@ckeditor/ckeditor5-utils/src/count';
+import global from '@ckeditor/ckeditor5-utils/src/dom/global';
+import createViewRoot from '../_utils/createroot';
+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;
@@ -45,6 +45,7 @@ describe( 'view', () => {
 				this.enable = sinon.spy();
 				this.disable = sinon.spy();
 				this.observe = sinon.spy();
+				this.destroy = sinon.spy();
 			}
 		};
 
@@ -379,6 +380,20 @@ describe( 'view', () => {
 
 			sinon.assert.callOrder( observerMock.disable, renderStub, observerMock.enable );
 		} );
+
+		it( 'should fire view.document.layoutChanged event on render', () => {
+			const spy = sinon.spy();
+
+			view.document.on( 'layoutChanged', spy );
+
+			view.render();
+
+			sinon.assert.calledOnce( spy );
+
+			view.render();
+
+			sinon.assert.calledTwice( spy );
+		} );
 	} );
 
 	describe( 'view and DOM integration', () => {
@@ -391,7 +406,7 @@ describe( 'view', () => {
 			const view = new View();
 			const viewDocument = view.document;
 
-			createRoot( 'div', 'main', viewDocument );
+			createViewRoot( viewDocument, 'div', 'main' );
 			view.attachDomRoot( domDiv );
 			view.render();
 
@@ -407,7 +422,7 @@ describe( 'view', () => {
 
 			const view = new View();
 			const viewDocument = view.document;
-			createRoot( 'div', 'main', viewDocument );
+			createViewRoot( viewDocument, 'div', 'main' );
 			view.attachDomRoot( domDiv );
 
 			viewDocument.getRoot()._appendChild( new ViewElement( 'p' ) );
@@ -424,7 +439,7 @@ describe( 'view', () => {
 
 			const view = new View();
 			const viewDocument = view.document;
-			const viewRoot = createRoot( 'div', 'main', viewDocument );
+			const viewRoot = createViewRoot( viewDocument, 'div', 'main' );
 
 			view.attachDomRoot( domRoot );
 
@@ -588,13 +603,13 @@ describe( 'view', () => {
 		} );
 	} );
 
-	function createRoot( name, rootName, viewDoc ) {
-		const viewRoot = new RootEditableElement( name );
+	describe( 'destroy()', () => {
+		it( 'should destroy all observers', () => {
+			const observerMock = view.addObserver( ObserverMock );
 
-		viewRoot.rootName = rootName;
-		viewRoot._document = viewDoc;
-		viewDoc.roots.add( viewRoot );
+			view.destroy();
 
-		return viewRoot;
-	}
+			sinon.assert.calledOnce( observerMock.destroy );
+		} );
+	} );
 } );