8
0
Просмотр исходного кода

Fix panel visibility on expanded selection test.

Maciej Gołaszewski 6 лет назад
Родитель
Сommit
ce7d25c77a

+ 29 - 5
packages/ckeditor5-mention/src/mentionediting.js

@@ -9,6 +9,7 @@
 
 import Plugin from '@ckeditor/ckeditor5-core/src/plugin';
 import MentionCommand from './mentioncommand';
+import uid from '@ckeditor/ckeditor5-utils/src/uid';
 
 /**
  * The mention editing feature.
@@ -40,9 +41,26 @@ export default class MentionEditing extends Plugin {
 			},
 			model: {
 				key: 'mention',
-				value: viewItem => ( {
-					name: viewItem.getAttribute( 'data-mention' )
-				} )
+				value: viewItem => {
+					const dataMention = viewItem.getAttribute( 'data-mention' );
+
+					const textNode = viewItem.getChild( 0 );
+
+					if ( !textNode || !textNode.is( 'text' ) ) {
+						return;
+					}
+
+					const mentionString = textNode.data;
+
+					// const marker = mentionString.slice( 0, 1 );
+					const name = mentionString.slice( 1 );
+
+					if ( name != dataMention ) {
+						return;
+					}
+
+					return { name: dataMention };
+				}
 			}
 		} );
 
@@ -51,10 +69,16 @@ export default class MentionEditing extends Plugin {
 			view: ( modelAttributeValue, viewWriter ) => {
 				const mention = modelAttributeValue && modelAttributeValue.name || modelAttributeValue;
 
-				return viewWriter.createAttributeElement( 'span', {
+				const attributes = {
 					class: 'mention',
 					'data-mention': mention
-				} );
+				};
+
+				const options = {
+					id: uid() // Set unique identifier as id option to not merge view attribute elements.
+				};
+
+				return viewWriter.createAttributeElement( 'span', attributes, options );
 			}
 		} );
 

+ 42 - 1
packages/ckeditor5-mention/tests/mentionediting.js

@@ -6,7 +6,7 @@
 import VirtualTestEditor from '@ckeditor/ckeditor5-core/tests/_utils/virtualtesteditor';
 import MentionEditing from '../src/mentionediting';
 import testUtils from '@ckeditor/ckeditor5-core/tests/_utils/utils';
-import { setData as setModelData, getData as getModelData } from '@ckeditor/ckeditor5-engine/src/dev-utils/model';
+import { getData as getModelData, setData as setModelData } from '@ckeditor/ckeditor5-engine/src/dev-utils/model';
 import Paragraph from '@ckeditor/ckeditor5-paragraph/src/paragraph';
 
 describe( 'MentionEditing', () => {
@@ -65,6 +65,38 @@ describe( 'MentionEditing', () => {
 				expect( editor.getData() ).to.equal( '<p>foo <span class="mention" data-mention="John">@John</span> bar</p>' );
 			} );
 
+			it( 'should convert consecutive mentions spans as two text nodes and two spans in the view', () => {
+				editor.setData(
+					'<p>' +
+					'<span class="mention" data-mention="John">@John</span>' +
+					'<span class="mention" data-mention="John">@John</span>' +
+					'</p>'
+				);
+
+				// getModelData() merges text blocks with "same" attributes:
+				// So expected: <$text mention="{"name":"John"}">@John</$text><$text mention="{"name":"John"}">@John</$text>'
+				// Is returned as: <$text mention="{"name":"John"}">@John@John</$text>'
+				const paragraph = doc.getRoot().getChild( 0 );
+
+				expect( paragraph.childCount ).to.equal( 2 );
+
+				assertTextNode( paragraph.getChild( 1 ) );
+				assertTextNode( paragraph.getChild( 1 ) );
+
+				expect( editor.getData() ).to.equal(
+					'<p>' +
+					'<span class="mention" data-mention="John">@John</span>' +
+					'<span class="mention" data-mention="John">@John</span>' +
+					'</p>'
+				);
+
+				function assertTextNode( textNode ) {
+					expect( textNode ).to.not.be.null;
+					expect( textNode.hasAttribute( 'mention' ) ).to.be.true;
+					expect( textNode.getAttribute( 'mention' ) ).to.deep.equal( { name: 'John' } );
+				}
+			} );
+
 			it( 'should remove mention on adding a text inside mention', () => {
 				editor.setData( '<p>foo <span class="mention" data-mention="John">@John</span> bar</p>' );
 
@@ -135,6 +167,7 @@ describe( 'MentionEditing', () => {
 			it( 'should set also other styles in inserted text', () => {
 				model.schema.extend( '$text', { allowAttributes: [ 'bold' ] } );
 				editor.conversion.attributeToElement( { model: 'bold', view: 'strong' } );
+
 				setModelData( model, '<paragraph><$text bold="true">foo@John[]bar</$text></paragraph>' );
 
 				const start = model.createPositionAt( doc.getRoot().getChild( 0 ), 3 );
@@ -154,6 +187,14 @@ describe( 'MentionEditing', () => {
 					'</p>'
 				);
 			} );
+
+			it( 'should not convert partial mentions', () => {
+				editor.setData( '<p><span class="mention" data-mention="John">@Jo</span></p>' );
+
+				expect( getModelData( model, { withoutSelection: true } ) ).to.equal( '<paragraph>@Jo</paragraph>' );
+
+				expect( editor.getData() ).to.equal( '<p>@Jo</p>' );
+			} );
 		} );
 
 		describe( 'typing integration', () => {