ソースを参照

Root.isFocused listen on document.focusedEditable now. Part of tests does not need focus again.

Piotr Jasiun 9 年 前
コミット
320e004dc8

+ 2 - 18
packages/ckeditor5-engine/src/view/observer/focusobserver.js

@@ -25,27 +25,11 @@ export default class FocusObserver extends DomEventObserver {
 
 		// Update `isFocus` property of root elements and `document#focusedEditable`.
 		document.on( 'focus', ( evt, data ) => {
-			const target = data.target;
-
-			for ( let root of document.roots.values() ) {
-				if ( target === root ) {
-					root.isFocused = true;
-				}
-			}
-
-			document.focusedEditable = target;
+			document.focusedEditable = data.target;
 		} );
 
 		document.on( 'blur', ( evt, data ) => {
-			const target = data.target;
-
-			for ( let root of document.roots.values() ) {
-				if ( target === root ) {
-					root.isFocused = false;
-				}
-			}
-
-			if ( document.focusedEditable == target ) {
+			if ( document.focusedEditable == data.target ) {
 				document.focusedEditable = null;
 			}
 		} );

+ 2 - 3
packages/ckeditor5-engine/src/view/rooteditableelement.js

@@ -45,14 +45,13 @@ export default class RootEditableElement extends EditableElement {
 		/**
 		 * Whether the editable is focused.
 		 *
-		 * This property is updated by the {@link engine.view.obsever.FocusObserver}.
-		 * If the {@link engine.view.obsever.FocusObserver} is disabled this property will not change.
+		 * This property updates when {@link engine.view.Document#focusedEditable} changes.
 		 *
 		 * @readonly
 		 * @observable
 		 * @member {Boolean} engine.view.RootEditableElement#isFocused
 		 */
-		this.set( 'isFocused', false );
+		this.bind( 'isFocused' ).to( document, 'focusedEditable', ( focusedEditable ) => focusedEditable == this );
 	}
 
 	/**

+ 22 - 0
packages/ckeditor5-engine/tests/view/_utils/createdocumentmock.js

@@ -0,0 +1,22 @@
+/**
+ * @license Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md.
+ */
+
+/* bender-tags: view */
+
+'use strict';
+
+import ObservableMixin from '/ckeditor5/utils/observablemixin.js';
+
+/**
+ * Creates {@link engine.view.Document view Document} mock.
+ *
+ * @returns {utils.ObservableMixin} Document mock
+ */
+export default function createDocumentMock() {
+	const doc = Object.create( ObservableMixin );
+	doc.set( 'focusedEditable', null );
+
+	return doc;
+}

+ 0 - 1
packages/ckeditor5-engine/tests/view/document/jumpoverinlinefiller.html

@@ -1,2 +1 @@
-<input type="text" id="focusPlaceholder" />
 <div contenteditable="true" id="editor"></div>

+ 2 - 6
packages/ckeditor5-engine/tests/view/document/jumpoverinlinefiller.js

@@ -9,7 +9,6 @@
 
 import ViewRange from '/ckeditor5/engine/view/range.js';
 import ViewDocument from '/ckeditor5/engine/view/document.js';
-import FocusObserver from '/ckeditor5/engine/view/observer/focusobserver.js';
 import KeyObserver from '/ckeditor5/engine/view/observer/keyobserver.js';
 import { INLINE_FILLER_LENGTH, isInlineFiller, startsWithFiller } from '/ckeditor5/engine/view/filler.js';
 
@@ -21,18 +20,15 @@ describe( 'Document', () => {
 	let viewDocument;
 
 	beforeEach( () => {
-		document.getElementById( 'focusPlaceholder' ).focus();
-
 		viewDocument = new ViewDocument();
 
 		viewDocument.addObserver( KeyObserver );
-		viewDocument.addObserver( FocusObserver );
 
-		viewDocument.createRoot( document.getElementById( 'editor' ) );
+		const viewRoot = viewDocument.createRoot( document.getElementById( 'editor' ) );
 
 		document.getSelection().removeAllRanges();
 
-		viewDocument.getDomRoot().focus();
+		viewDocument.focusedEditable = viewRoot;
 	} );
 
 	describe( 'jump over inline filler hack', () => {

+ 4 - 2
packages/ckeditor5-engine/tests/view/node.js

@@ -12,6 +12,8 @@ import Text from '/ckeditor5/engine/view/text.js';
 import RootEditableElement from '/ckeditor5/engine/view/rooteditableelement.js';
 import CKEditorError from '/ckeditor5/utils/ckeditorerror.js';
 
+import createDocumentMock from '/tests/engine/view/_utils/createdocumentmock.js';
+
 describe( 'Node', () => {
 	let root;
 	let one, two, three;
@@ -135,7 +137,7 @@ describe( 'Node', () => {
 		} );
 
 		it( 'should return Document attached to the parent element', () => {
-			const docMock = {};
+			const docMock = createDocumentMock();
 			const parent = new RootEditableElement( docMock, 'div' );
 			const child = new Element( 'p' );
 
@@ -154,7 +156,7 @@ describe( 'Node', () => {
 		} );
 
 		it( 'should return root element', () => {
-			const parent = new RootEditableElement( {}, 'div' );
+			const parent = new RootEditableElement( createDocumentMock(), 'div' );
 			const child = new Element( 'p' );
 
 			child.parent = parent;

+ 0 - 1
packages/ckeditor5-engine/tests/view/observer/__template__.html

@@ -1,3 +1,2 @@
-<input type="text" id="focusPlaceholder" />
 <div contenteditable="true" id="main"></div>
 <div contenteditable="true" id="additional"></div>

+ 0 - 32
packages/ckeditor5-engine/tests/view/observer/focusobserver.js

@@ -50,38 +50,6 @@ describe( 'FocusObserver', () => {
 		} );
 	} );
 
-	describe( 'handle isFocused property of root elements', () => {
-		let domMain, domHeader, viewMain, viewHeader;
-
-		beforeEach( () => {
-			domMain = document.createElement( 'div' );
-			domHeader = document.createElement( 'h1' );
-
-			viewMain = viewDocument.createRoot( domMain );
-			viewHeader = viewDocument.createRoot( domHeader, 'header' );
-		} );
-
-		it( 'should change isFocused on focus event', () => {
-			observer.onDomEvent( { type: 'focus', target: domMain } );
-
-			expect( viewMain.isFocused ).to.be.true;
-			expect( viewHeader.isFocused ).to.be.false;
-		} );
-
-		it( 'should change isFocused on blur event', () => {
-			observer.onDomEvent( { type: 'focus', target: domMain } );
-
-			expect( viewMain.isFocused ).to.be.true;
-			expect( viewHeader.isFocused ).to.be.false;
-
-			observer.onDomEvent( { type: 'blur', target: domMain } );
-			observer.onDomEvent( { type: 'focus', target: domHeader } );
-
-			expect( viewMain.isFocused ).to.be.false;
-			expect( viewHeader.isFocused ).to.be.true;
-		} );
-	} );
-
 	describe( 'handle focusedEditable property of the document', () => {
 		let domMain, domHeader, viewMain, viewHeader;
 

+ 2 - 4
packages/ckeditor5-engine/tests/view/observer/selectionobserver.js

@@ -12,7 +12,6 @@ import ViewSelection from '/ckeditor5/engine/view/selection.js';
 import ViewDocument from '/ckeditor5/engine/view/document.js';
 import SelectionObserver from '/ckeditor5/engine/view/observer/selectionobserver.js';
 import MutationObserver from '/ckeditor5/engine/view/observer/mutationobserver.js';
-import FocusObserver from '/ckeditor5/engine/view/observer/focusobserver.js';
 
 import EmitterMixin from '/ckeditor5/utils/emittermixin.js';
 
@@ -30,18 +29,17 @@ describe( 'SelectionObserver', () => {
 
 		mutationObserver = viewDocument.addObserver( MutationObserver );
 		selectionObserver = viewDocument.addObserver( SelectionObserver );
-		viewDocument.addObserver( FocusObserver );
 
 		viewRoot = viewDocument.getRoot();
 
 		viewRoot.appendChildren( parse( '<container:p>foo</container:p><container:p>bar</container:p>' ) );
 
 		viewDocument.render();
+
+		viewDocument.focusedEditable = viewRoot;
 	} );
 
 	beforeEach( ( done ) => {
-		document.getElementById( 'focusPlaceholder' ).focus();
-
 		viewDocument.selection.removeAllRanges();
 		document.getSelection().removeAllRanges();
 

+ 33 - 5
packages/ckeditor5-engine/tests/view/rooteditableelement.js

@@ -11,10 +11,12 @@ import ContainerElement from '/ckeditor5/engine/view/containerelement.js';
 import EditableElement from '/ckeditor5/engine/view/editableelement.js';
 import RootEditableElement from '/ckeditor5/engine/view/rooteditableelement.js';
 
+import createDocumentMock from '/tests/engine/view/_utils/createdocumentmock.js';
+
 describe( 'RootEditableElement', () => {
 	describe( 'constructor', () => {
 		it( 'should create an element with default root name', () => {
-			const root = new RootEditableElement( {}, 'div' );
+			const root = new RootEditableElement( createDocumentMock(), 'div' );
 
 			expect( root ).to.be.instanceof( EditableElement );
 			expect( root ).to.be.instanceof( ContainerElement );
@@ -27,7 +29,7 @@ describe( 'RootEditableElement', () => {
 		} );
 
 		it( 'should create an element with custom root name', () => {
-			const root = new RootEditableElement( {}, 'h1', 'header' );
+			const root = new RootEditableElement( createDocumentMock(), 'h1', 'header' );
 
 			expect( root.rootName ).to.equal( 'header' );
 			expect( root.name ).to.equal( 'h1' );
@@ -38,8 +40,17 @@ describe( 'RootEditableElement', () => {
 	} );
 
 	describe( 'isFocused', () => {
+		let docMock, viewMain, viewHeader;
+
+		beforeEach( () => {
+			docMock = createDocumentMock();
+
+			viewMain = new RootEditableElement( docMock, 'div' );
+			viewHeader = new RootEditableElement( docMock, 'h1', 'header' );
+		} );
+
 		it( 'should be observable', () => {
-			const root = new RootEditableElement( {}, 'div' );
+			const root = new RootEditableElement( createDocumentMock(), 'div' );
 
 			expect( root.isFocused ).to.be.false;
 
@@ -53,11 +64,28 @@ describe( 'RootEditableElement', () => {
 
 			expect( isFocusedSpy.calledOnce ).to.be.true;
 		} );
+
+		it( 'should change isFocused when focusedEditable changes', () => {
+			docMock.focusedEditable = viewMain;
+
+			expect( viewMain.isFocused ).to.be.true;
+			expect( viewHeader.isFocused ).to.be.false;
+
+			docMock.focusedEditable = viewHeader;
+
+			expect( viewMain.isFocused ).to.be.false;
+			expect( viewHeader.isFocused ).to.be.true;
+
+			docMock.focusedEditable = null;
+
+			expect( viewMain.isFocused ).to.be.false;
+			expect( viewHeader.isFocused ).to.be.false;
+		} );
 	} );
 
 	describe( 'isReadOnly', () => {
 		it( 'should be observable', () => {
-			const root = new RootEditableElement( {}, 'div' );
+			const root = new RootEditableElement( createDocumentMock(), 'div' );
 
 			expect( root.isReadOnly ).to.be.false;
 
@@ -75,7 +103,7 @@ describe( 'RootEditableElement', () => {
 
 	describe( 'getDocument', ()=> {
 		it( 'should return document', () => {
-			const docMock = {};
+			const docMock = createDocumentMock();
 			const root = new RootEditableElement( docMock, 'div' );
 
 			expect( root.getDocument() ).to.equal( docMock );

+ 24 - 0
packages/ckeditor5-engine/tests/view/utils-tests/createdocumentmock.js

@@ -0,0 +1,24 @@
+/**
+ * @license Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
+ * For licensing, see LICENSE.md.
+ */
+
+/* bender-tags: view */
+
+'use strict';
+
+import createDocumentMock from '/tests/engine/view/_utils/createdocumentmock.js';
+
+describe( 'createDocumentMock', () => {
+	it( 'should create document mock', ( done ) => {
+		const docMock = createDocumentMock();
+		const rootMock = {};
+
+		docMock.on( 'change:focusedEditable', ( evt, key, value ) => {
+			expect( value ).to.equal( rootMock );
+			done();
+		} );
+
+		docMock.focusedEditable = rootMock;
+	} );
+} );