Browse Source

The model element will be selected when focusing the edit source element.

Kamil Piechaczek 5 years ago
parent
commit
8c18067d7b

+ 9 - 0
packages/ckeditor5-html-embed/src/htmlembedediting.js

@@ -152,6 +152,15 @@ export default class HtmlEmbedEditing extends Plugin {
 					root.value = modelElement.getAttribute( 'value' ) || '';
 					root.readOnly = editor.isReadOnly;
 
+					// When focusing the "edit source" element, the model selection must be updated.
+					// If we do not do it, the `htmlEmbedUpdate` command will fail because it
+					// searches the `rawHtml` element based on selection.
+					root.addEventListener( 'focus', () => {
+						editor.model.change( writer => {
+							writer.setSelection( modelElement, 'on' );
+						} );
+					} );
+
 					root.addEventListener( 'input', () => {
 						editor.execute( 'htmlEmbedUpdate', root.value );
 					} );

+ 20 - 0
packages/ckeditor5-html-embed/tests/htmlembedediting.js

@@ -432,6 +432,26 @@ describe( 'HtmlEmbedEditing', () => {
 
 				expect( viewHtmlContainer.getChild( 1 ).getCustomProperty( 'domElement' ).readOnly ).to.equal( false );
 			} );
+
+			it( 'should select the proper model element when editing source', () => {
+				model.schema.register( 'paragraph', { inheritAllFrom: '$block' } );
+				editor.conversion.elementToElement( { model: 'paragraph', view: 'p' } );
+
+				setModelData( model, '<paragraph>Foo.[]</paragraph><rawHtml value="1"></rawHtml><rawHtml value="2"></rawHtml>' );
+
+				const secondHtmlContainer = viewDocument.getRoot().getChild( 2 ).getChild( 0 );
+				// Switch to edit mode.
+				secondHtmlContainer.getChild( 0 ).getCustomProperty( 'domElement' ).click();
+
+				const sourceElement = secondHtmlContainer.getChild( 1 );
+				const textarea = sourceElement.getCustomProperty( 'domElement' );
+
+				textarea.dispatchEvent( new Event( 'focus' ) );
+
+				expect( getModelData( model ) ).to.equal(
+					'<paragraph>Foo.</paragraph><rawHtml value="1"></rawHtml>[<rawHtml value="2"></rawHtml>]'
+				);
+			} );
 		} );
 
 		describe( 'with previews (htmlEmbed.showPreviews=true)', () => {