8
0
Quellcode durchsuchen

Merge pull request #181 from ckeditor/t/180

Other: Added support for the `config.initialData` option in `ClassicTestEditor` and `VirtualTestEditor`. Added support to data as the first parameter in`ClassicTestEditor.create` method. Closes #180.
Piotr Jasiun vor 6 Jahren
Ursprung
Commit
ef12391da6

+ 58 - 4
packages/ckeditor5-core/tests/_utils-tests/classictesteditor.js

@@ -10,6 +10,7 @@ import ClassicTestEditor from '../../tests/_utils/classictesteditor';
 
 import Plugin from '../../src/plugin';
 import HtmlDataProcessor from '@ckeditor/ckeditor5-engine/src/dataprocessor/htmldataprocessor';
+import Paragraph from '@ckeditor/ckeditor5-paragraph/src/paragraph';
 
 import EditorUI from '../../src/editor/editorui';
 import BoxedEditorUIView from '@ckeditor/ckeditor5-ui/src/editorui/boxed/boxededitoruiview';
@@ -21,6 +22,7 @@ import RootElement from '@ckeditor/ckeditor5-engine/src/model/rootelement';
 
 import { getData } from '@ckeditor/ckeditor5-engine/src/dev-utils/model';
 import testUtils from '../../tests/_utils/utils';
+import CKEditorError from '@ckeditor/ckeditor5-utils/src/ckeditorerror';
 
 describe( 'ClassicTestEditor', () => {
 	let editorElement;
@@ -32,13 +34,17 @@ describe( 'ClassicTestEditor', () => {
 		document.body.appendChild( editorElement );
 	} );
 
+	afterEach( () => {
+		editorElement.remove();
+	} );
+
 	describe( 'constructor()', () => {
 		it( 'creates an instance of editor', () => {
 			const editor = new ClassicTestEditor( editorElement, { foo: 1 } );
 
 			expect( editor ).to.be.instanceof( Editor );
 			expect( editor.config.get( 'foo' ) ).to.equal( 1 );
-			expect( editor.element ).to.equal( editorElement );
+			expect( editor.sourceElement ).to.equal( editorElement );
 			expect( editor.ui ).to.be.instanceOf( EditorUI );
 			expect( editor.ui.view ).to.be.instanceOf( BoxedEditorUIView );
 			expect( editor.data.processor ).to.be.instanceof( HtmlDataProcessor );
@@ -82,7 +88,7 @@ describe( 'ClassicTestEditor', () => {
 					expect( editor ).to.be.instanceof( ClassicTestEditor );
 
 					expect( editor.config.get( 'foo' ) ).to.equal( 1 );
-					expect( editor ).to.have.property( 'element', editorElement );
+					expect( editor.sourceElement ).to.equal( editorElement );
 				} );
 		} );
 
@@ -175,6 +181,54 @@ describe( 'ClassicTestEditor', () => {
 					return editor.destroy();
 				} );
 		} );
+
+		it( 'initializes the data controller with `config.initialData` if this option is provided', () => {
+			return ClassicTestEditor.create( editorElement, { initialData: '<p>foo</p>', plugins: [ Paragraph ] } )
+				.then( editor => {
+					expect( editor.getData() ).to.equal( '<p>foo</p>' );
+
+					return editor.destroy();
+				} );
+		} );
+
+		it( 'initializes the data controller with an empty string if the `config.initialData` is not provided', () => {
+			return ClassicTestEditor.create( editorElement )
+				.then( editor => {
+					expect( editor.getData() ).to.equal( '' );
+
+					return editor.destroy();
+				} );
+		} );
+
+		it( 'initializes the data controller with the data from the source element', () => {
+			editorElement.innerHTML = '<p>foo</p>';
+
+			return ClassicTestEditor.create( editorElement, { plugins: [ Paragraph ] } )
+				.then( editor => {
+					expect( editor.getData() ).to.equal( '<p>foo</p>' );
+
+					return editor.destroy();
+				} );
+		} );
+
+		it( 'initializes the data controller with the data from the first argument if it is a string', () => {
+			return ClassicTestEditor.create( '<p>foo</p>', { plugins: [ Paragraph ] } )
+				.then( editor => {
+					expect( editor.getData() ).to.equal( '<p>foo</p>' );
+
+					return editor.destroy();
+				} );
+		} );
+
+		it( 'throws when the data is passed from as the first argument and as a `config.initialData` at the same time', () => {
+			return ClassicTestEditor.create( '<p>foo</p>', { initialData: '<p>bar</p>' } )
+				.then( () => {
+					throw new Error( 'It should throw an error' );
+				}, err => {
+					expect( err.message ).to.match( /^editor-create-initial-data:/ );
+					expect( err ).to.be.instanceOf( CKEditorError );
+				} );
+		} );
 	} );
 
 	describe( 'destroy()', () => {
@@ -195,11 +249,11 @@ describe( 'ClassicTestEditor', () => {
 		it( 'restores the editor element', () => {
 			return ClassicTestEditor.create( editorElement, { foo: 1 } )
 				.then( editor => {
-					expect( editor.element.style.display ).to.equal( 'none' );
+					expect( editor.sourceElement.style.display ).to.equal( 'none' );
 
 					return editor.destroy()
 						.then( () => {
-							expect( editor.element.style.display ).to.equal( '' );
+							expect( editor.sourceElement.style.display ).to.equal( '' );
 						} );
 				} );
 		} );

+ 17 - 0
packages/ckeditor5-core/tests/_utils-tests/virtualtesteditor.js

@@ -9,6 +9,7 @@ import VirtualTestEditor from '../../tests/_utils/virtualtesteditor';
 import HtmlDataProcessor from '@ckeditor/ckeditor5-engine/src/dataprocessor/htmldataprocessor';
 import DataApiMixin from '../../src/editor/utils/dataapimixin';
 import RootElement from '@ckeditor/ckeditor5-engine/src/model/rootelement';
+import Paragraph from '@ckeditor/ckeditor5-paragraph/src/paragraph';
 
 import testUtils from '../../tests/_utils/utils';
 
@@ -34,4 +35,20 @@ describe( 'VirtualTestEditor', () => {
 			expect( testUtils.isMixed( VirtualTestEditor, DataApiMixin ) ).to.true;
 		} );
 	} );
+
+	describe( 'static create()', () => {
+		it( 'initializes the data controller with the `config.initialData`', () => {
+			return VirtualTestEditor.create( { initialData: '<p>foo</p>', plugins: [ Paragraph ] } )
+				.then( editor => {
+					expect( editor.getData() ).to.equal( '<p>foo</p>' );
+				} );
+		} );
+
+		it( 'initializes the data controller with an empty string if the `config.initialData` is not provided', () => {
+			return VirtualTestEditor.create()
+				.then( editor => {
+					expect( editor.getData() ).to.equal( '' );
+				} );
+		} );
+	} );
 } );

+ 43 - 15
packages/ckeditor5-core/tests/_utils/classictesteditor.js

@@ -13,6 +13,8 @@ import ElementReplacer from '@ckeditor/ckeditor5-utils/src/elementreplacer';
 import InlineEditableUIView from '@ckeditor/ckeditor5-ui/src/editableui/inline/inlineeditableuiview';
 import getDataFromElement from '@ckeditor/ckeditor5-utils/src/dom/getdatafromelement';
 import mix from '@ckeditor/ckeditor5-utils/src/mix';
+import { isElement } from 'lodash-es';
+import CKEditorError from '@ckeditor/ckeditor5-utils/src/ckeditorerror';
 
 /**
  * A simplified classic editor. Useful for testing features.
@@ -24,51 +26,66 @@ export default class ClassicTestEditor extends Editor {
 	/**
 	 * @inheritDoc
 	 */
-	constructor( element, config ) {
+	constructor( sourceElementOrData, config ) {
 		super( config );
 
-		// The element on which the editor has been initialized.
-		this.element = element;
+		if ( isElement( sourceElementOrData ) ) {
+			this.sourceElement = sourceElementOrData;
+		}
 
 		// Use the HTML data processor in this editor.
 		this.data.processor = new HtmlDataProcessor();
 
+		// Create the ("main") root element of the model tree.
+		this.model.document.createRoot();
+
 		this.ui = new ClassicTestEditorUI( this, new BoxedEditorUIView( this.locale ) );
 
 		// Expose properties normally exposed by the ClassicEditorUI.
 		this.ui.view.editable = new InlineEditableUIView( this.ui.view.locale, this.editing.view );
-
-		// Create the ("main") root element of the model tree.
-		this.model.document.createRoot();
 	}
 
 	/**
 	 * @inheritDoc
 	 */
 	destroy() {
+		if ( this.sourceElement ) {
+			this.updateSourceElement();
+		}
+
 		this.ui.destroy();
 
 		return super.destroy();
 	}
 
 	/**
-	 * @inheritDoc
+	 * @param {HTMLElement|String} sourceElementOrData The DOM element that will be the source for the created editor
+	 * or the editor's initial data.
+	 * @param {module:core/editor/editorconfig~EditorConfig} [config] The editor configuration.
+	 * @returns {Promise} A promise resolved once the editor is ready. The promise resolves with the created editor instance.
 	 */
-	static create( element, config ) {
+	static create( sourceElementOrData, config = {} ) {
 		return new Promise( resolve => {
-			const editor = new this( element, config );
+			const editor = new this( sourceElementOrData, config );
 
 			resolve(
 				editor.initPlugins()
 					// Simulate EditorUI.init() (e.g. like in ClassicEditorUI). The ui#view
 					// should be rendered after plugins are initialized.
-					.then( () => editor.ui.init( element ) )
+					.then( () => editor.ui.init( isElement( sourceElementOrData ) ? sourceElementOrData : null ) )
 					.then( () => editor.editing.view.attachDomRoot( editor.ui.getEditableElement() ) )
-					.then( () => editor.data.init( getDataFromElement( element ) ) )
 					.then( () => {
-						editor.state = 'ready';
-						editor.fire( 'ready' );
+						if ( !isElement( sourceElementOrData ) && config.initialData ) {
+							// Documented in core/editor/editorconfig.jsdoc.
+							throw new CKEditorError(
+								'editor-create-initial-data: ' +
+								'The config.initialData option cannot be used together with initial data passed in Editor.create().'
+							);
+						}
+
+						editor.data.init( config.initialData || getInitialData( sourceElementOrData ) );
 					} )
+					.then( () => editor.fire( 'ready' ) )
 					.then( () => editor )
 			);
 		} );
@@ -104,7 +121,12 @@ class ClassicTestEditorUI extends EditorUI {
 		return this._view;
 	}
 
-	init( element ) {
+	/**
+	 * Initializes the UI.
+	 *
+	 * @param {HTMLElement|null} replacementElement The DOM element that will be the source for the created editor.
+	 */
+	init( replacementElement ) {
 		const view = this.view;
 		const editable = view.editable;
 		const editingView = this.editor.editing.view;
@@ -118,7 +140,9 @@ class ClassicTestEditorUI extends EditorUI {
 
 		this._editableElements.set( 'main', view.editable.element );
 
-		this._elementReplacer.replace( element, view.element );
+		if ( replacementElement ) {
+			this._elementReplacer.replace( replacementElement, view.element );
+		}
 
 		this.fire( 'ready' );
 	}
@@ -137,3 +161,7 @@ class ClassicTestEditorUI extends EditorUI {
 
 mix( ClassicTestEditor, DataApiMixin );
 mix( ClassicTestEditor, ElementApiMixin );
+
+function getInitialData( sourceElementOrData ) {
+	return isElement( sourceElementOrData ) ? getDataFromElement( sourceElementOrData ) : sourceElementOrData;
+}

+ 3 - 1
packages/ckeditor5-core/tests/_utils/virtualtesteditor.js

@@ -27,13 +27,15 @@ export default class VirtualTestEditor extends Editor {
 		this.model.document.createRoot();
 	}
 
-	static create( config ) {
+	static create( config = {} ) {
 		return new Promise( resolve => {
 			const editor = new this( config );
 
 			resolve(
 				editor.initPlugins()
 					.then( () => {
+						editor.data.init( config.initialData || '' );
+
 						// Fire `data#ready` event manually as `data#init()` method is not used.
 						editor.data.fire( 'ready' );
 						editor.fire( 'ready' );