Merge pull request #138 from ckeditor/t/137

Fix: The `ClassicTestEditor` should not render its UI in the `constructor()`. Closes #137.

Author: oskarwrobel

tests/_utils-tests/classictesteditor.js

@@ -44,13 +44,20 @@ describe( 'ClassicTestEditor', () => {
 			expect( editor.data.processor ).to.be.instanceof( HtmlDataProcessor );
 		} );
 
-		it( 'creates editable DOM', () => {
+		it( 'creates the instance of the editable (without rendering)', () => {
 			const editor = new ClassicTestEditor( editorElement );
 
 			expect( editor.ui.view.editable ).to.be.instanceOf( InlineEditableUIView );
+			expect( editor.ui.view.editable.isRendered ).to.be.false;
+		} );
+
+		it( 'creates the #ui and ui#view (without rendering)', () => {
+			const editor = new ClassicTestEditor( editorElement );
 
-			expect( editor.ui.view.editableElement.tagName ).to.equal( 'DIV' );
-			expect( editor.ui.view.editableElement ).to.equal( editor.ui.view.editable.element );
+			expect( editor.ui ).to.be.instanceOf( EditorUI );
+			expect( editor.ui.view ).to.be.instanceOf( BoxedEditorUIView );
+			expect( editor.ui.view.isRendered ).to.be.false;
+			expect( editor.ui.view.editableElement ).to.be.undefined;
 		} );
 
 		it( 'creates main root element', () => {
@@ -79,11 +86,14 @@ describe( 'ClassicTestEditor', () => {
 				} );
 		} );
 
-		it( 'creates and initializes the UI', () => {
+		it( 'renders the view including #editable and sets #editableElement', () => {
 			return ClassicTestEditor.create( editorElement, { foo: 1 } )
 				.then( editor => {
-					expect( editor.ui ).to.be.instanceOf( EditorUI );
-					expect( editor.ui.view ).to.be.instanceOf( BoxedEditorUIView );
+					const view = editor.ui.view;
+
+					expect( view.isRendered ).to.be.true;
+					expect( view.editableElement.tagName ).to.equal( 'DIV' );
+					expect( view.editableElement ).to.equal( view.editable.element );
 				} );
 		} );
 

tests/_utils/classictesteditor.js

@@ -37,8 +37,6 @@ export default class ClassicTestEditor extends Editor {
 
 		// Expose properties normally exposed by the ClassicEditorUI.
 		this.ui.view.editable = new InlineEditableUIView( this.ui.view.locale );
-		this.ui.view.main.add( this.ui.view.editable );
-		this.ui.view.editableElement = this.ui.view.editable.element;
 
 		// A helper to easily replace the editor#element with editor.editable#element.
 		this._elementReplacer = new ElementReplacer();
@@ -66,7 +64,15 @@ export default class ClassicTestEditor extends Editor {
 
 			resolve(
 				editor.initPlugins()
-					.then( () => editor.ui.view.render() )
+					// Simulate EditorUI.init() (e.g. like in ClassicEditorUI). The ui#view
+					// should be rendered after plugins are initialized.
+					.then( () => {
+						const view = editor.ui.view;
+
+						view.render();
+						view.main.add( view.editable );
+						view.editableElement = view.editable.element;
+					} )
 					.then( () => {
 						editor._elementReplacer.replace( element, editor.ui.view.element );
 						editor.fire( 'uiReady' );