浏览代码

Creator utils tests and API docs.

Piotrek Koszuliński 9 年之前
父节点
当前提交
8eb75ef178

+ 16 - 1
packages/ckeditor5-ui/src/bindings/creator-utils.js

@@ -5,10 +5,18 @@
 
 'use strict';
 
+/**
+ * Creates and if needed (if not yet done) binds the editable UI to the {@link ckeditor5.Editable editable instance}.
+ *
+ * @param {ckeditor5.Editor} editor The editor instance.
+ * @param {ckeditor5.Editable} editable The editable instance with which the editable UI will be bound.
+ * @param {Function} EditableUI Editable UI controller constructor.
+ * @param {Function} EditableUIView Editable UI view constructor.
+ * @returns {ui.editableui.EditableUI} Instance of the editable UI.
+ */
 export function createEditableUI( editor, editable, EditableUI, EditableUIView ) {
 	const domElement = editable.domElement;
 	const editableUI = new EditableUI( editor, editable );
-	// TODO InlineEditable must be defined in this package so we can define that domElement is its 3rd arg.
 	const editableUIView = new EditableUIView( editableUI.viewModel, editor.locale, domElement );
 
 	editableUI.view = editableUIView;
@@ -21,6 +29,13 @@ export function createEditableUI( editor, editable, EditableUI, EditableUIView )
 	return editableUI;
 }
 
+/**
+ * Creates editor UI instance.
+ *
+ * @param {ckeditor5.Editor} editor The editor instance.
+ * @param {Function} Editor UI controller constructor.
+ * @param {Function} Editor UI view constructor.
+ */
 export function createEditorUI( editor, EditorUI, EditorUIView ) {
 	const editorUI = new EditorUI( editor );
 	const editorUIView = new EditorUIView( editorUI.viewModel, editor.locale );

+ 2 - 1
packages/ckeditor5-ui/src/editableui/editableui.js

@@ -16,7 +16,8 @@ export default class EditableUI extends Controller {
 	/**
 	 * Creates a new instance of the Editable class.
 	 *
-	 * @param {Observable} editableModel The model for the editable.
+	 * @param {ckeditor5.Editor} editor The editor instance.
+	 * @param {utils.Observable} editableModel The model for the editable.
 	 */
 	constructor( editor, editableModel ) {
 		super();

+ 10 - 0
packages/ckeditor5-ui/src/editableui/editableuiview.js

@@ -14,6 +14,16 @@ import CKEditorError from '../../utils/ckeditorerror.js';
  */
 export default class EditableUIView extends View {
 	/**
+	 * Creates an instance of the EditableUIView class.
+	 *
+	 * @method constructor
+	 * @param {ui.Model} model (View)Model of this view.
+	 * @param {utils.Locale} [locale] The {@link ckeditor5.Editor#locale editor's locale} instance.
+	 * @param {HTMLElement} [editableElement] The editable element. If not specified the editable UI view
+	 * should create it. Otherwise, the existing element should be used.
+	 */
+
+	/**
 	 * The element which is the main editable element (usually the one with `contentEditable="true"`).
 	 *
 	 * @readonly

+ 1 - 1
packages/ckeditor5-ui/src/view.js

@@ -24,7 +24,7 @@ const bindIfSymbol = Symbol( 'bindIf' );
  */
 export default class View {
 	/**
-	 * Creates an instance of the {@link View} class.
+	 * Creates an instance of the {@link ui.View} class.
 	 *
 	 * @param {ui.Model} model (View)Model of this View.
 	 * @param {utils.Locale} [locale] The {@link ckeditor5.Editor#locale editor's locale} instance.

+ 7 - 2
packages/ckeditor5-ui/tests/controller.js

@@ -56,11 +56,16 @@ describe( 'Controller', () => {
 				} );
 		} );
 
-		it( 'should set #ready flag', () => {
+		it( 'should set #ready flag and fire #ready event', () => {
 			const controller = new Controller();
+			const spy = sinon.spy( () => {
+				expect( controller ).to.have.property( 'ready', true );
+			} );
+
+			controller.on( 'ready', spy );
 
 			return controller.init().then( () => {
-				expect( controller.ready ).to.be.true;
+				expect( spy.calledOnce ).to.be.true;
 			} );
 		} );
 

+ 126 - 0
packages/ckeditor5-ui/tests/creator-utils.js

@@ -0,0 +1,126 @@
+/**
+ * @license Copyright (c) 2003-2016, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md.
+ */
+
+/* bender-tags: ui */
+
+'use strict';
+
+import { createEditableUI, createEditorUI } from '/ckeditor5/ui/creator-utils.js';
+import ObservableMixin from '/ckeditor5/utils/observablemixin.js';
+import utils from '/ckeditor5/utils/utils.js';
+import Editor from '/ckeditor5/editor.js';
+import Controller from '/ckeditor5/ui/controller.js';
+import View from '/ckeditor5/ui/view.js';
+import Model from '/ckeditor5/ui/model.js';
+
+describe( 'creator-utils', () => {
+	let editor;
+
+	beforeEach( () => {
+		editor = new Editor();
+	} );
+
+	describe( 'createEditableUI', () => {
+		let editable;
+
+		class Editable {}
+		utils.mix( Editable, ObservableMixin );
+
+		class TestController extends Controller {
+			constructor( editor, editable ) {
+				super();
+
+				this.editor = editor;
+				this.editable = editable;
+
+				this.viewModel = new Model();
+			}
+		}
+
+		class TestView extends View {
+			constructor( model, locale, editableElement ) {
+				super( model, locale );
+
+				this.editableElement = editableElement;
+			}
+		}
+
+		beforeEach( () => {
+			editable = new Editable();
+			editable.bindTo = sinon.spy();
+		} );
+
+		it( 'creates an instance of editable UI', () => {
+			const editableUI = createEditableUI( editor, editable, TestController, TestView );
+
+			expect( editableUI ).to.be.instanceof( TestController );
+			expect( editableUI ).to.have.property( 'editor', editor );
+			expect( editableUI ).to.have.property( 'editable', editable );
+
+			const view = editableUI.view;
+			expect( view ).to.be.instanceof( TestView );
+			expect( view.model ).to.equal( editableUI.viewModel );
+			expect( view.editableElement ).to.be.undefined;
+			expect( view.locale ).to.equal( editor.locale );
+		} );
+
+		it( 'passes the editable.domElement to the view and do not try to bind it again', () => {
+			const editableElement = document.createElement( 'div' );
+
+			editable.domElement = editableElement;
+			editable.bindTo = sinon.spy();
+
+			const editableUI = createEditableUI( editor, editable, TestController, TestView );
+
+			expect( editableUI.view.editableElement ).to.equal( editableElement );
+			expect( editable.bindTo.callCount ).to.equal( 0 );
+		} );
+
+		it( 'passes the editable.domElement to the view and do not try to bind it again', () => {
+			const editableElement = document.createElement( 'div' );
+
+			editable.domElement = editableElement;
+
+			const editableUI = createEditableUI( editor, editable, TestController, TestView );
+
+			expect( editableUI.view.editableElement ).to.equal( editableElement );
+			expect( editable.bindTo.callCount ).to.equal( 0 );
+		} );
+
+		it( 'if editable.domElement is not yet defined, tries to bind the editable element', () => {
+			const editableElement = document.createElement( 'div' );
+			const editableUI = createEditableUI( editor, editable, TestController, TestView );
+
+			editableUI.view.editableElement = editableElement;
+			editableUI.fire( 'ready' );
+
+			expect( editable.bindTo.calledWith( editableElement ) ).to.be.true;
+		} );
+	} );
+
+	describe( 'createEditorUI', () => {
+		class TestController extends Controller {
+			constructor( editor ) {
+				super();
+
+				this.editor = editor;
+				this.viewModel = new Model();
+			}
+		}
+
+		class TestView extends View {}
+
+		it( 'creates an instance of the EditorUI', () => {
+			const editorUI = createEditorUI( editor, TestController, TestView );
+
+			expect( editorUI ).to.be.instanceof( TestController );
+			expect( editorUI.editor ).to.equal( editor );
+
+			expect( editorUI.view ).to.be.instanceof( TestView );
+			expect( editorUI.view.model ).to.equal( editorUI.viewModel );
+			expect( editorUI.view.locale ).to.equal( editor.locale );
+		} );
+	} );
+} );