Explorar o código

Make the restricted editing expection span outer-most attribute element.

Maciej Gołaszewski %!s(int64=6) %!d(string=hai) anos
pai
achega
1c434f69c4

+ 11 - 1
packages/ckeditor5-restricted-editing/src/restrictededitingexceptionediting.js

@@ -29,7 +29,7 @@ export default class RestrictedEditingExceptionEditing extends Plugin {
 
 		editor.model.schema.extend( '$text', { allowAttributes: [ 'restrictedEditingException' ] } );
 
-		editor.conversion.attributeToElement( {
+		editor.conversion.for( 'upcast' ).elementToAttribute( {
 			model: 'restrictedEditingException',
 			view: {
 				name: 'span',
@@ -37,6 +37,16 @@ export default class RestrictedEditingExceptionEditing extends Plugin {
 			}
 		} );
 
+		editor.conversion.for( 'downcast' ).attributeToElement( {
+			model: 'restrictedEditingException',
+			view: ( modelAttributeValue, viewWriter ) => {
+				if ( modelAttributeValue ) {
+					// Make the restricted editing <span> outer-most in the view.
+					return viewWriter.createAttributeElement( 'span', { class: 'ck-restricted-editing-exception' }, { priority: -10 } );
+				}
+			}
+		} );
+
 		editor.commands.add( 'restrictedEditingException', new RestrictedEditingExceptionCommand( editor ) );
 	}
 }

+ 26 - 0
packages/ckeditor5-restricted-editing/tests/restrictededitingexceptionediting.js

@@ -11,6 +11,7 @@ import Paragraph from '@ckeditor/ckeditor5-paragraph/src/paragraph';
 
 import RestrictedEditingExceptionEditing from '../src/restrictededitingexceptionediting';
 import RestrictedEditingExceptionCommand from '../src/restrictededitingexceptioncommand';
+import { assertEqualMarkup } from '@ckeditor/ckeditor5-utils/tests/_utils/utils';
 
 describe( 'RestrictedEditingExceptionEditing', () => {
 	let editor, model;
@@ -70,6 +71,31 @@ describe( 'RestrictedEditingExceptionEditing', () => {
 				expect( editor.getData() ).to.equal( expectedView );
 				expect( getViewData( editor.editing.view, { withoutSelection: true } ) ).to.equal( expectedView );
 			} );
+
+			it( 'converted <span> should be outer most element', () => {
+				editor.conversion.for( 'downcast' ).attributeToElement( {
+					model: 'bold',
+					view: 'b'
+				} );
+				editor.conversion.for( 'downcast' ).attributeToElement( {
+					model: 'italic',
+					view: 'i'
+				} );
+
+				const expectedView = '<p><span class="ck-restricted-editing-exception"><b>foo</b> <i>bar</i> baz</span></p>';
+
+				setModelData( editor.model,
+					'<paragraph>' +
+						'<$text restrictedEditingException="true" bold="true">foo</$text>' +
+						'<$text restrictedEditingException="true"> </$text>' +
+						'<$text restrictedEditingException="true" italic="true">bar</$text>' +
+						'<$text restrictedEditingException="true"> baz</$text>' +
+					'</paragraph>'
+				);
+
+				assertEqualMarkup( editor.getData(), expectedView );
+				assertEqualMarkup( getViewData( editor.editing.view, { withoutSelection: true } ), expectedView );
+			} );
 		} );
 	} );
 } );