Changes in EditorWithUI and ElementApi interfaces

src/editor/editorwithui.jsdoc

@@ -28,6 +28,13 @@
  * @member {module:core/editor/editorui~EditorUI} #ui
  */
 
+ /**
+  * An HTML element that represents the editor with the UI.
+  *
+  * @readonly
+  * @member {HTMLElement} #element
+  */
+
 /**
  * Fired when the editor UI is ready.
  *

src/editor/utils/attachtoform.js

@@ -19,7 +19,7 @@ import CKEditorError from '@ckeditor/ckeditor5-utils/src/ckeditorerror';
  * @param {module:core/editor/editor~Editor} editor Editor instance.
  */
 export default function attachToForm( editor ) {
-	if ( !isFunction( editor.updateElement ) ) {
+	if ( !isFunction( editor.updateSourceElement ) ) {
 		/**
 		 * {@link module:core/editor/utils/elementapimixin~ElementApi ElementApi interface} is required.
 		 *
@@ -28,13 +28,13 @@ export default function attachToForm( editor ) {
 		throw new CKEditorError( 'attachtoform-missing-elementapi-interface: ElementApi interface is required.' );
 	}
 
-	const element = editor.element;
+	const sourceElement = editor.sourceElement;
 
 	// Only when replacing a textarea which is inside of a form element.
-	if ( element && element.tagName.toLowerCase() === 'textarea' && element.form ) {
+	if ( sourceElement && sourceElement.tagName.toLowerCase() === 'textarea' && sourceElement.form ) {
 		let originalSubmit;
-		const form = element.form;
-		const onSubmit = () => editor.updateElement();
+		const form = sourceElement.form;
+		const onSubmit = () => editor.updateSourceElement();
 
 		// Replace the original form#submit() to call a custom submit function first.
 		// Check if #submit is a function because the form might have an input named "submit".

src/editor/utils/elementapimixin.js

@@ -19,8 +19,8 @@ const ElementApiMixin = {
 	/**
 	 * @inheritDoc
 	 */
-	updateElement() {
-		setDataInElement( this.element, this.data.get() );
+	updateSourceElement() {
+		setDataInElement( this.sourceElement, this.data.get() );
 	}
 };
 
@@ -30,7 +30,7 @@ export default ElementApiMixin;
  * Interface describing an editor which replaced a DOM element (was "initialized on an element").
  *
  * Such an editor should provide a method to
- * {@link module:core/editor/utils/elementapimixin~ElementApi#updateElement update the replaced element with the current data}.
+ * {@link module:core/editor/utils/elementapimixin~ElementApi#updateSourceElement update the replaced element with the current data}.
  *
  * @interface ElementApi
  */
@@ -39,11 +39,11 @@ export default ElementApiMixin;
  * The element on which the editor has been initialized.
  *
  * @readonly
- * @member {HTMLElement} #element
+ * @member {HTMLElement} #sourceElement
  */
 
 /**
- * Updates the {@link #element editor element}'s content with the data.
+ * Updates the {@link #sourceElement editor source element}'s content with the data.
  *
- * @method #updateElement
+ * @method #updateSourceElement
  */

tests/editor/utils/attachtoform.js

@@ -52,7 +52,7 @@ describe( 'attachToForm()', () => {
 	} );
 
 	it( 'should update editor#element after the "submit" event', () => {
-		editor.element = textarea;
+		editor.sourceElement = textarea;
 		attachToForm( editor );
 
 		expect( textarea.value ).to.equal( '' );
@@ -66,7 +66,7 @@ describe( 'attachToForm()', () => {
 	} );
 
 	it( 'should update editor#element after calling the submit() method', () => {
-		editor.element = textarea;
+		editor.sourceElement = textarea;
 		attachToForm( editor );
 
 		expect( textarea.value ).to.equal( '' );
@@ -86,7 +86,7 @@ describe( 'attachToForm()', () => {
 		const element = document.createElement( 'div' );
 		form.appendChild( element );
 
-		editor.element = element;
+		editor.sourceElement = element;
 		attachToForm( editor );
 
 		expect( textarea.value ).to.equal( '' );
@@ -102,7 +102,7 @@ describe( 'attachToForm()', () => {
 		const standaloneTextarea = document.createElement( 'textarea' );
 		document.body.appendChild( standaloneTextarea );
 
-		editor.element = standaloneTextarea;
+		editor.sourceElement = standaloneTextarea;
 		attachToForm( editor );
 
 		expect( standaloneTextarea.value ).to.equal( '' );
@@ -117,7 +117,7 @@ describe( 'attachToForm()', () => {
 	} );
 
 	it( 'should not update editor#element after destruction of the editor - form.submit()', () => {
-		editor.element = textarea;
+		editor.sourceElement = textarea;
 		attachToForm( editor );
 
 		expect( textarea.value ).to.equal( '' );
@@ -132,7 +132,7 @@ describe( 'attachToForm()', () => {
 	} );
 
 	it( 'should not update the editor#element after destruction of the editor - "submit" event', () => {
-		editor.element = textarea;
+		editor.sourceElement = textarea;
 		attachToForm( editor );
 
 		expect( textarea.value ).to.equal( '' );
@@ -155,7 +155,7 @@ describe( 'attachToForm()', () => {
 		input.setAttribute( 'name', 'submit' );
 		form.appendChild( input );
 
-		editor.element = textarea;
+		editor.sourceElement = textarea;
 		attachToForm( editor );
 
 		expect( form.submit ).to.equal( input );

tests/editor/utils/elementapimixin.js

@@ -29,17 +29,17 @@ describe( 'ElementApiMixin', () => {
 
 	describe( 'updateEditorElement()', () => {
 		it( 'should be added to editor interface', () => {
-			expect( editor ).have.property( 'updateElement' ).to.be.a( 'function' );
+			expect( editor ).have.property( 'updateSourceElement' ).to.be.a( 'function' );
 		} );
 
 		it( 'sets data to editor element', () => {
 			const editorElement = document.createElement( 'div' );
 
 			editor.data.set( 'foo bar' );
 
-			editor.element = editorElement;
+			editor.sourceElement = editorElement;
 
-			editor.updateElement();
+			editor.updateSourceElement();
 
 			expect( editorElement.innerHTML ).to.equal( 'foo bar' );
 		} );