浏览代码

Renamed Editable to EditableUI and updated tests.

Piotrek Koszuliński 9 年之前
父节点
当前提交
292a66c764

+ 0 - 89
packages/ckeditor5-ui/src/editable/editable.js

@@ -1,89 +0,0 @@
-/**
- * @license Copyright (c) 2003-2016, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
- */
-
-'use strict';
-
-import Controller from '../controller.js';
-import Model from '../model.js';
-import utils from '../../utils/utils.js';
-import ObservableMixin from '../../utils/observablemixin.js';
-
-/**
- * @memberOf ui.editable
- * @extends ui.Controller
- * @mixes utils.ObservaleMixin
- */
-export default class Editable extends Controller {
-	/**
-	 * Creates a new instance of the Editable class.
-	 *
-	 * @param editor
-	 */
-	constructor( editor, editableModel ) {
-		super();
-
-		this.editor = editor;
-		this._editableModel = editableModel;
-	}
-
-	/**
-	 * The model for the editable view.
-	 *
-	 * @readonly
-	 * @type {ui.Model}
-	 */
-	get viewModel() {
-		if ( this._viewModel ) {
-			return this._viewModel;
-		}
-
-		this._viewModel = new Model();
-
-		this._viewModel.bind( 'isEditable', 'isFocused' ).to( this._editableModel );
-
-		return this._viewModel;
-	}
-
-	/**
-	 * Temporary implementation (waiting for integration with the data model).
-	 *
-	 * @param {String} data HTML to be loaded.
-	 */
-	setData( data ) {
-		this.view.editableElement.innerHTML = data;
-	}
-
-	/**
-	 * Temporary implementation (waiting for integration with the data model).
-	 *
-	 * @returns {String} HTML string.
-	 */
-	getData() {
-		return this.view.editableElement.innerHTML;
-	}
-}
-
-utils.mix( Editable, ObservableMixin );
-
-/**
- * The editable model interface.
- *
- * @memberOf ui.editable
- * @interface EditableModel
- */
-
-/**
- * Whether the editable has focus.
- *
- * @readonly
- * @member {Boolean} ui.editable.EditableModel#isFocused
- */
-
-/**
- * Whether the editable is not in read-only mode.
- *
- * @readonly
- * @member {Boolean} ui.editable.EditableModel#isEditable
- */

+ 1 - 1
packages/ckeditor5-ui/src/editable.jsdoc

@@ -4,5 +4,5 @@
  */
 
 /**
- * @namespace ui.editable
+ * @namespace ui.editableUI
  */

+ 41 - 0
packages/ckeditor5-ui/src/editableui/editableui.js

@@ -0,0 +1,41 @@
+/**
+ * @license Copyright (c) 2003-2016, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md.
+ */
+
+'use strict';
+
+import Controller from '../controller.js';
+import Model from '../model.js';
+
+/**
+ * @memberOf ui.editableUI
+ * @extends ui.Controller
+ */
+export default class EditableUI extends Controller {
+	/**
+	 * Creates a new instance of the Editable class.
+	 *
+	 * @param {Observable} editableModel The model for the editable.
+	 */
+	constructor( editor, editableModel ) {
+		super();
+
+		/**
+		 * The editor instance.
+		 *
+		 * @readonly
+		 * @member {ckeditor5.Editor} ui.editableUI.EditableUI#editor
+		 */
+		this.editor = editor;
+
+		/**
+		 * The model for the view.
+		 *
+		 * @readonly
+		 * @member {ui.Model} ui.editableUI.EditableUI#viewModel
+		 */
+		this.viewModel = new Model();
+		this.viewModel.bind( 'isEditable', 'isFocused' ).to( editableModel );
+	}
+}

+ 3 - 3
packages/ckeditor5-ui/src/editable/editableview.js

@@ -9,15 +9,15 @@ import View from '../view.js';
 import CKEditorError from '../../utils/ckeditorerror.js';
 
 /**
- * @memberOf ui.editable
+ * @memberOf ui.editableUI
  * @extends ui.View
  */
-export default class EditableView extends View {
+export default class EditableUIView extends View {
 	/**
 	 * The element which is the main editable element (usually the one with `contentEditable="true"`).
 	 *
 	 * @readonly
-	 * @member {HTMLElement} ui.editable.EditableView#editableElement
+	 * @member {HTMLElement} ui.editable.EditableUIView#editableElement
 	 */
 
 	/**

+ 0 - 79
packages/ckeditor5-ui/tests/editable/editable.js

@@ -1,79 +0,0 @@
-/**
- * @license Copyright (c) 2003-2016, CKSource - Frederico Knabben. All rights reserved.
- * For licensing, see LICENSE.md.
- */
-
-/* bender-tags: editable */
-
-'use strict';
-
-import Editor from '/ckeditor5/editor.js';
-import Editable from '/ckeditor5/ui/editable/editable.js';
-import Model from '/ckeditor5/ui/model.js';
-import testUtils from '/tests/utils/_utils/utils.js';
-
-describe( 'Editable', () => {
-	let editable, editor;
-
-	beforeEach( () => {
-		editor = new Editor();
-		editable = new Editable( editor );
-	} );
-
-	describe( 'constructor', () => {
-		it( 'sets all the properties', () => {
-			expect( editable ).to.have.property( 'editor', editor );
-			expect( editable ).to.have.property( 'isFocused', false );
-			expect( editable ).to.have.property( 'isEditable', true );
-		} );
-	} );
-
-	describe( 'viewModel', () => {
-		it( 'returns a model instance', () => {
-			expect( editable.viewModel ).to.be.an.instanceof( Model );
-		} );
-
-		it( 'always returns the same instance', () => {
-			expect( editable.viewModel ).to.equal( editable.viewModel );
-		} );
-
-		it( 'constains editable attributes', () => {
-			expect( editable.viewModel ).to.have.property( 'isEditable', true );
-			expect( editable.viewModel ).to.have.property( 'isFocused', false );
-		} );
-
-		it( 'binds this.isFocused to editable', () => {
-			testUtils.assertBinding(
-				editable,
-				{ isFocused: false },
-				[
-					[ editable.viewModel, { isFocused: true } ]
-				],
-				{ isFocused: true }
-			);
-		} );
-
-		it( 'binds editable.isEditable to itself', () => {
-			testUtils.assertBinding(
-				editable.viewModel,
-				{ isEditable: true },
-				[
-					[ editable, { isEditable: false } ]
-				],
-				{ isEditable: false }
-			);
-		} );
-	} );
-
-	// These are temporary implementation, so tests do nothing beside ensuring 100% CC.
-	describe( 'getData() and setData()', () => {
-		it( 'exist', () => {
-			editable.view = {
-				editableElement: document.createElement( 'div' )
-			};
-
-			editable.getData();
-			editable.setData();
-		} );
-	} );
-} );

+ 60 - 0
packages/ckeditor5-ui/tests/editableui/editableui.js

@@ -0,0 +1,60 @@
+/**
+ * @license Copyright (c) 2003-2016, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md.
+ */
+
+/* bender-tags: editable */
+
+'use strict';
+
+import Editor from '/ckeditor5/editor.js';
+import Editable from '/ckeditor5/editable.js';
+import EditableUI from '/ckeditor5/ui/editableui/editableui.js';
+import Model from '/ckeditor5/ui/model.js';
+import testUtils from '/tests/utils/_utils/utils.js';
+
+describe( 'EditableUI', () => {
+	let editable, editableUI, editor;
+
+	beforeEach( () => {
+		editor = new Editor();
+		editable = new Editable( editor, 'foo' );
+		editableUI = new EditableUI( editor, editable );
+	} );
+
+	describe( 'constructor', () => {
+		it( 'sets all properties', () => {
+			expect( editableUI.editor ).to.equal( editor );
+			expect( editableUI.viewModel ).to.be.instanceof( Model );
+		} );
+	} );
+
+	describe( 'viewModel', () => {
+		it( 'constains observable attributes', () => {
+			expect( editableUI.viewModel ).to.have.property( 'isEditable', true );
+			expect( editableUI.viewModel ).to.have.property( 'isFocused', false );
+		} );
+
+		it( 'binds isFocused to editable.isFocused', () => {
+			testUtils.assertBinding(
+				editableUI.viewModel,
+				{ isFocused: false },
+				[
+					[ editable, { isFocused: true } ]
+				],
+				{ isFocused: true }
+			);
+		} );
+
+		it( 'binds isEditable to editable.isEditable', () => {
+			testUtils.assertBinding(
+				editableUI.viewModel,
+				{ isEditable: true },
+				[
+					[ editable, { isEditable: false } ]
+				],
+				{ isEditable: false }
+			);
+		} );
+	} );
+} );

+ 7 - 11
packages/ckeditor5-ui/tests/editable/editableview.js

@@ -8,15 +8,15 @@
 'use strict';
 
 import CKEditorError from '/ckeditor5/utils/ckeditorerror.js';
-import EditableView from '/ckeditor5/ui/editable/editableview.js';
+import EditableUIView from '/ckeditor5/ui/editableui/editableuiview.js';
 import Model from '/ckeditor5/ui/model.js';
 
-describe( 'EditableView', () => {
+describe( 'EditableUIView', () => {
 	let model, view, editableElement;
 
 	beforeEach( () => {
 		model = new Model( { isEditable: true, isFocused: false } );
-		view = new EditableView( model );
+		view = new EditableUIView( model );
 		editableElement = document.createElement( 'div' );
 
 		return view.init();
@@ -49,18 +49,14 @@ describe( 'EditableView', () => {
 			expect( editableElement.contentEditable ).to.equal( 'false' );
 		} );
 
-		it( 'sets the model.isFocused based on element#focus and element#blur events', () => {
+		it( 'sets the contentEditable attribute to model.isEditable', () => {
 			view.setEditableElement( editableElement );
 
-			expect( model.isFocused ).to.equal( false );
-
-			editableElement.dispatchEvent( new Event( 'focus' ) );
-
-			expect( model.isFocused ).to.equal( true );
+			expect( editableElement.classList.contains( 'ck-blurred' ) ).to.be.true;
 
-			editableElement.dispatchEvent( new Event( 'blur' ) );
+			model.isFocused = true;
 
-			expect( model.isFocused ).to.equal( false );
+			expect( editableElement.classList.contains( 'ck-focused' ) ).to.be.true;
 		} );
 	} );
 } );